本文共 2199 字，大约阅读时间需要 7 分钟。
CSS（Cascading Style Sheets，层叠样式表）是一种用于为HTML文件定义样式的语言。它允许你对网页元素的字体、颜色、边距、高度、宽度、背景图片、网页定位等属性进行设定，从而实现对网页内容的美化。
CSS的核心优势包括内容与表现的分离、样式的统一性、代码量的减少以及对搜索引擎的友好性等。
CSS的发展经历了多个版本：
CSS的语法遵循选择器-属性-值的规则，格式如下：
选择器 { 属性1: 属性值; 属性2: 属性值; ...} 注意：CSS的最后一条声明的“;”可写可不写，建议遵循规范。
在HTML文档中，CSS样式可以通过<style>标签定义，位置应放在<head>标签内。例如：
style属性直接在元素上定义样式。Hello, CSS
<style>标签内，位于<head>中。Hello, world!
.css文件中，通过<link>标签引入。选择器基于HTML标签名称，例如：
h1 { color: red; }p { color: blue; } 通过类名选择元素，类名前加.：
.a { font-family: 华文行楷; }.b { font-style: italic; } 通过id属性选择唯一元素，选择器前加#：
#aaa { color: red; }#bbb { color: blue; } 选择器的优先级顺序为：ID > 类 > 标签。
例如：
body p { background: red; }body > p { background: pink; } 用于匹配父级元素的特定子元素，例如：
:first-child：第一个子元素:last-child：最后一个子元素:nth-child(n)：第n个子元素（可与even、odd结合）:first-of-type：类型为指定类型的第一个子元素:last-of-type：类型为指定类型的最后一个子元素:nth-of-type(n)：类型为指定类型的第n个子元素通过元素属性值匹配元素，例如：
[attr]：匹配具有指定属性的元素[attr=val]：匹配属性值为val的元素[attr^=val]：匹配属性值以val开头的元素[attr$=val]：匹配属性值以val结尾的元素[attr*=val]：匹配属性值包含val的元素所有HTML元素都可以看作盒子，盒子模型包括：
border-top-color、border-right-color、border-bottom-color、border-left-colorborder-color：同时设置四个边框颜色border-width：可选thin、medium、thick或像素值border-style：可选none、dotted、dashed、solid、double、groove、ridge、inset、outsetfloat：将元素向左或向右浮动。clear：清除浮动元素的边框塌陷。<div>：确保父级元素的高度。overflow属性：在父级元素中设置overflow: hidden。static：默认值，无定位。relative：相对定位。absolute：绝对定位。fixed：固定定位。通过opacity或filter属性设置元素透明度。
opacity：值范围为0~1。filter：可与opacity结合使用，值范围为0~100。以上内容涵盖了CSS的基础知识和实践，适合用于网页美化和布局。
转载地址：http://akwm.baihongyu.com/