CSS 文本样式: 通过文本属性,改变文字 *范围小的选择器生效优先级高于范围大的选择器 css样式属性之间没有先后顺序,有这条属性就行 如果对盒子没有指定宽高,那么盒子的宽高,由其子元素来撑开 选择器+声明叫做一条css描述 缩进文本 p {text-indent: -5em;}//负位移 p {text-indent: 20%;}//百分数要参考父元素的宽度。只影响第一行,举例,如果将缩进值设置为 20%,元素的第一行会缩进 20%(参考其父元素宽度的)。 水平对齐 text-align:center line-height 字间隔 p.spread {word-spacing: 30px;} p.tight {word-spacing: -0.5em;} 字母间隔 h1 {letter-spacing: -0.5em} h4 {letter-spacing: 20px} 字符大小写转换 h1 {text-transform: uppercase} h1 {text-transform: lowercase} h1 {text-transform: capitalize}//首字母大写 h1 {text-transform: none} 文本装饰 a {text-decoration: none;} a {text-decoration: underline;}//下划线 a {text-decoration: overline;} a {text-decoration: line-through;} 处理空白符 p {white-space: normal;} //合并多余的空白符 p {white-space: pre;} // 不合并空白符,不忽略换行符 p {white-space: pre-wrap;} //不合并空白符,不忽略换行符,还允许自动换行。 p {white-space: pre-line;} /合并空白符,保留换行符, 还允许自动换行 段落间距 p.big{line-height: 200%}//参考其父元素的行高 p.big{line-height: 20px} p.big{line-height: 0.5}//0.5是什么 CSS 字体 字体的属性:那种字体、大小、加粗、风格(如斜体)和变形(如小型大写字母) body {font-family: sans-serif;}//字体系列 font-family 字体 font-family: "宋体"; font-family:"微软雅黑" font-family:"微软雅黑","宋体"; font-family:"Microsoft Yahei","SimSun" font-family:"Arial","Microsoft Yahei","SimSun" font-family:arial,sans-serif;//字体系列至少2个字体,通用字体系列和特定字体系列 只有当字体名中有一个或多个空格(比如 New York),或者如果字体名包括 # 或 $ 之类的符号,才需要在 font-family 声明中加引号。 font-style 设置斜体 p.normal {font-style:normal;}//字体样式,如斜体 italic; 让文字倾斜 oblique 与 italic区别: italic会找到新的斜的字型替代 oblique是普通的倾斜 中文一律用italic font-variant 设定小型大写字母 p {font-variant:small-caps;} p.normal {font-variant: normal} font-weight 设定字体粗细 p.thick {font-weight:bold;}//700或bold字体 加粗 p.thicker {font-weight:400;}//400或normal 表示正常 font-size 设置字体大小 h1 {font-size:3.75em;} //字体大小 h1 {font-size:60px;} 字体简写属性: p.ex1{font:italic arial,sans-serif;} font: italic bold 14px/28px arial,sans-serif;//无顺序书写,不同描述用空格隔开,一个描述用逗号隔开 em W3C 推荐使用 em 尺寸单位 浏览器中默认的文本大小是 16 像素。因此 1em 的默认尺寸是 16 像素。 如果要避免在 Internet Explorer 中无法调整文本的问题,许多开发者使用 em 单位代替 pixels 1em 等于当前的字体尺寸。如果一个元素的 font-size 为 16 像素,那么对于该元素,1em 就等于 16 像素。在设置字体大小时,em 的值会相对于父元素的字体大小改变。 结合使用百分比和 EM 在所有浏览器中均有效的方案是为 body 元素(父元素)以百分比设置默认的 font-size 值: 文本阴影 CSS3 文本阴影 h1{ text-shadow: 5px 5px 5px #FF0000; } text-shadow: h-shadow v-shadow blur color; h-shadow 水平阴影的位置 v-shadow 垂直阴影的位置 blur 模糊的距离,值越大越模糊 color 阴影的颜色 自动换行 p {word-wrap:break-word;}//仅对一个英文单词过长没换行溢出的情况