|
今天学习css中的文本格式 一.文本格式 1、控制字体 1、指定字体 font-family : value,value,value ... eg:font-family:"微软雅黑","Arial"; font-family:"Microsoft Yahei"; 提示：一般网页中，中文使用 微软雅黑较多，英文使用 Arial 2、字体大小 font-size:12px; 提示：网页中，默认文本一般采用12px 3、字体加粗 相当于 <b></b> font-weight:normal / bold / value; value : 400-900 之间 400 相当于 normal 900 相当于 bold 4、字体样式 相当于<i></i> font-style:normal / italic; 5、小型大写字母 font-variant : normal / small-caps; 6、字体属性 : font font 为简写属性 ， 包含6个值 font : font-style font-variant font-weight font-size/line-height font-family; font:bold 12px "microsoft yahei"; font:12px/24px "microsoft yahei"; 应用：现在我想在页面中显示 文本大小28px ，文字加粗 ，斜体,字体为微软雅黑的一段文本 - <!DOCTYPE html>
- <html>
- <head>
- <title>字体</title>
- <meta charset="utf-8" />
- <style>
- #d1{
- /*文本大小28px ，文字加粗 ，斜体,字体为微软雅黑，*/
- font-size:28px;
- font-weight:bold;
- font-style:italic;
显示效果为 ： 2、控制文本格式 1、文本颜色 color:value; 2、文字水平排列方式: text-align : left/right/center 3、文本线条修饰 text-decoration:none / underline ; 取值 ：overline(上划线) , line-through(删除线) 4、行高 每行文本所占的高度是多少。一旦设定好后，该行文本将在该行内垂直居中显示（仅在行高大于本文大小时有效）。 问：在一个div中，有一行文本，向让该行文本在div中垂直居中显示 ？ 解决：div中文本的 行高 要设置与 div的高度一致 但是，紧紧局限于 一行数据 5、首行文本缩进 text-indent : value ; value 表示的是缩进的距离 6、文本阴影 text-shadow : h-shadow v-shadow blur color; 应用，我现在想分别显示一段红色的，水平居中，有下划线和一段垂直居中，首行缩进20px，有阴影的文本： - <!DOCTYPE html >
- <head>
- <title>文本格式</title>
- <meta charset="utf-8" />
- <style>
- #d1{
- height:40px;
- width:500px;
- border:1px solid black;
- color:red;
- text-align:center;
- text-decoration:underline;
- }
- #d2{
- height:40px;
- width:500px;
- border:1px solid black;
- line-height:40px;
- text-indent:20px;
- text-shadow:1px 2px ;
- }
- </style>
- </head>
- <body>
- <div id="d1">
- 这是一段红色的，水平居中，有下划线的文本
- </div> <br/>
- <div id="d2">
- 垂直居中,首行缩进了20个像素，具备阴影的文本
- </div>
- </body>
| 
楼主
千斤顶
发表于 2015-11-8 17:13:13
发表于 2018-5-2 04:48:27
