CSS3
2021-02-02 02:14
标签：type 基本 引擎 技术 xhtml 引用 级联 lin 速度 什么是CSS Cascading Style Sheet 级联样式表 CSS的优势 内容与表现分离 语 TML中引入CSS样式 行内样式：使用style属性引入CSS样式 直接在HTML标签中设置的样式 内部样式表： CSS代码写在的
优点 外部样式表 导入式 CSS样式优先级：行内样式>内部样式表>外部样式表 CSS3基本选择器：标签选择器 类选择器 ID选择器 小结 标签选择器直接应用于HTML标签 基本选择器的优先级:ID选择器>类选择器>标签选择器 CSS的高级选择器:层次选择器 结构伪类选择器 属性选择器 结构伪类选择器 小结 使用E F:nth-child(n)和E F:nth-of-type(n)的 关键点 属性选择器 法： CSS3 标签：type 基本 引擎 技术 xhtml 引用 级联 lin 速度 原文地址：https://www.cnblogs.com/wufanfan/p/13174316.html
表现HTML或XHTML文件样式的计算机语言：包括对字体、颜色、边距、高度、宽度、背景图片、网页定位等设定
网页的表现统一，容易修改
丰富的样式，使得页面布局更加灵活
减少网页的代码量，增加网页的浏览速度，节省网络带宽
运用独立于页面的CSS，有利于网页被搜索引擎收录选择器 { 声明1;
声明2;
…… }
例如：h1 {
font-size:12px;
color:#F00;
}
CSS的最后一条声明后的“;”可写可不写，但是，基于W3C标准规范考虑，建议最后一条声明的结束“;” 都要写上
style标签：{
font-size:12px;
color:#F00;
}
style属性的应用
方便在同页面中修改样式
缺点
不利于在多页面间共享复用代码及维护，对内容与样式的分离也不够彻底
CSS代码保存在扩展名为.css的样式表中
HTML文件引用扩展名为.css的样式表，有两种方式
链接式：
……
……
……
就近原则标签内容标签名>
类选择器：.class { font-size:16px;}
ID选择器：#id { font-size:16px;}
类选择器可在页面中多次使用
ID选择器在同一个页面中只能使用一次
后代选择器:body p{ background: red; }
子选择器:body>p{ background: pink; }
相邻兄弟选择器:.active+p { background: green; }
通用兄弟选择器:.active~p{ background: yellow; }
ul li:first-child{ background: red;}
ul li:last-child{ background: green;}
p:nth-child(1){ background: yellow;}
p:nth-of-type(2){ background: blue;}
E F:nth-child(n)在父级里从一个元素开始查找，不分类型
E F:nth-of-type(n)在父级里先看类型，再看位置E[attr]属性选择器:a[id] { background: yellow; }
E[attr=val]属性选择器:a[id=first] { background: red; }
E[attr*=val]属性选择器:a[class*=links] { background: red; }
E[attr^=val]属性选择器: a[href^=http] { background: red; }
E[attr$=val]属性选择器:a[href$=png] { background: red; }
下一篇：css 和js基础