CSS3——注释 id 和 class 选择器 css创建(外部、内部、内联样式表)
注释
/* 注释内容 */
id 和 class 选择器
id ID属性不要以数字开头,数字开头的ID在 Mozilla/Firefox 浏览器中不起作用
<style>
#para1
{
text-align:center;
color:red;
}
</style>
... <body>
<p id="para1">Hello World!</p>
</body>
class
<style>
.center
{
text-align:center;
}
</style>
</head>
<body>
<h1 class="center">标题居中</h1>
<p class="center">段落居中。</p>
</body>
用于特定的元素
<style>
p.xxx
{
text-align:center;
}
</style>
</head>
<body>
<h1 class="xxx">这个标题不受影响</h1>
<p class="xxx">这个段落居中对齐。</p>
</body>


属性选择器、包含选择器、子选择器、兄弟选择器等等 【戳上方链接进入】
外部样式表
<head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>
内部样式表
<head>
<style>
hr {color:sienna;}
p {margin-left:20px;}
body {background-image:url("images/back40.gif");}
</style>
</head>
内联样式
<p style="color:sienna;margin-left:20px">这是一个段落。</p>
多重样式
颜色属性将被继承于外部样式表,而文字排列(text-alignment)和字体尺寸(font-size)会被内部样式表中的规则取代

多重样式的优先级
内联样式)Inline style > (内部样式)Internal style sheet >(外部样式)External style sheet > 浏览器默认样式

CSS3——注释 id 和 class 选择器 css创建(外部、内部、内联样式表)的更多相关文章
- CSS的引用方式(引用外部样式表、内部样式表、内联样式表)
CSS引用外部样式表的优点:一般的浏览器都带有缓存功能,所以用户不用每次都下载此CSS文件,所以外部引用相对于内部引用和内联引用来说是是节省资源的. CSS使用内部样式表.内联样式表的优点:可以直观的 ...
- 语法、id和class选择器、创建、
一. 1.CSS规则由两个主要部分构成:选择器,以及一条或多条声明(每条声明由一个属性和一个值构成,属性和值被冒号分开). 2.声明以分号“:”结束,生命组用大括号“{}”括起来. [示例:p {co ...
- 前端极易被误导的css选择器权重计算及css内联样式的妙用技巧
记得大学时候,专业课的网页设计书籍里面讲过css选择器权重的计算:id是100,class是10,html标签是5等等,然后全部加起来的和进行比较... 我只想说:真是误人子弟,害人不浅! 最近,在前 ...
- HTML&CSS基础-内联样式和内部样式表
HTML&CSS基础-内联样式和内部样式表 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.CSS(Cascading Style Sheets)简介 层叠样式表(Cas ...
- 你真的知道css三种存在样式(外联样式、内部样式、内联样式)的区别吗?
css样式在html中有三种存在形态: 内联样式:<div style="display: none"></div> 内部样式: <style> ...
- CSS 块状元素和内联元素
在用CSS布局页面的时候,我们会将HTML标签分成两种,块状元素和内联元素(我们平常用到的div和p就是块状元素,链接标签a就是内联元素) 块状元素一般是其他元素的容器,可容纳内联元素和其他块状元素, ...
- CSS块元素与内联元素(转)
为什么<a><span>这种标签定义width,height等CSS属性时会发现完全不生效? 因为它们不是容器,它们是内联元素,不是块元素 CSS 块元素与内联元素 关键字: ...
- css position, display, float 内联元素、块级元素
position属性:position属性指出一个元素的定位方法.有4种可能值:static, relative, absolute or fixed: static:默认值,元素按照在文档流中出现的 ...
- CSS 块状元素和内联元素的详解
我们先来分析一下块级元素.内联级元素的定义和解析: 块元素(block element)一般是其他元素的容器元素,块元素一般都从新行开始,它可以容纳内联元素和其他块元素,常见块元素是段落标签'P&q ...
随机推荐
- 获得 bootstrapTable行号index
方法一: $('#table-picManager').on("click-row.bs.table",function(e,row,$element){ index=$eleme ...
- SpringMVC入门示例
1.新建一个Java Web项目 2.导入jar包 3.在WEB-INF下面建一个hello.jsp页面. 1 <%@ page language="java" import ...
- mongodb数据库的改操作
原来字段: { "_id" : ObjectId("5df0a28e406405edeac5001f"), "username" : &qu ...
- JSP 和Servlet 有有什么关系?
Servlet是一个特殊的Java程序,它运行于服务器的JVM中,能够依靠服务器的支持向浏览器提供显示内容. JSP本质上是Servlet的一种简易形式, JSP会被服务器处理成一个类似于Servle ...
- vue 父组件使用keep-alive和infinite-scroll导致在子组件触发父组件的infinite-scroll方法
(vue.js)vue 父组件使用keep-alive和infinite-scroll导致在子组件触发父组件的infinite-scroll方法”问题疑问,本网通过在网上对“ (vue.js)vue ...
- DOM例子小结(一)
一.点击按钮切换图片 核心思路: 1.首先获取元素 2.为元素添加点击事件 3.当事件被触发时运行代码 <!DOCTYPE html> <html lang="en&quo ...
- MySQL概述 - 一条查询sql语句的执行过程
Server层 连接器 建立连接.获取权限.维持和管理连接. 连接建立比较复杂,建议使用长连接 定期断开长连接 mysql_reset_connection指令 查询缓存 建议关闭,任何更新操作会此t ...
- Spring Boot教程(十四)快速入门
快速入门 本章主要目标完成Spring Boot基础项目的构建,并且实现一个简单的Http请求处理,通过这个例子对Spring Boot有一个初步的了解,并体验其结构简单.开发快速的特性. 系统要求: ...
- Spring Cloud Stream教程(三)持续发布 - 订阅支持
应用之间的通信遵循发布订阅模式,其中通过共享主题广播数据.这可以在下图中看到,它显示了一组交互式的Spring Cloud Stream应用程序的典型部署. 图6. Spring Cloud Stre ...
- navicat_premium_x64最新版安装说明
先到官网下载最新的navicat http://www.navicat.com.cn/ 下载破解文件 链接: https://pan.baidu.com/s/1hhsh5Tfe4c_lQeyX8D-C ...