css--文本样式

css文本设置

常用的应用文本的css样式:

  • color 设置文字的颜色,如: color:red;

  • font-size 设置文字的大小,如:font-size:12px;

  • font-family 设置文字的字体,如:font-family:'微软雅黑';

  • font-style 设置字体是否倾斜,如:font-style:'normal'; 设置不倾斜,font-style:'italic';设置文字倾斜

  • font-weight 设置文字是否加粗,如:font-weight:bold; 设置加粗 font-weight:normal 设置不加粗

  • font 同时设置文字的几个属性,写的顺序有兼容问题,建议按照如下顺序写: font:是否加粗 字号/行高 字体;如: font:normal 12px/36px '微软雅黑';

  • line-height 设置文字的行高,如:line-height:24px;

  • text-decoration 设置文字的下划线,如:text-decoration:none; 将文字下划线去掉

  • text-indent 设置文字首行缩进,如:text-indent:24px; 设置文字首行缩进24px

  • text-align 设置文字水平对齐方式,如text-align:center 设置文字水平居中

css颜色表示法

css颜色值主要有三种表示方法:

1、颜色名表示,比如:red 红色,gold 金色

2、rgb表示,比如:rgb(255,0,0)表示红色

3、16进制数值表示,比如:#ff0000 表示红色,这种可以简写成 #f00

 

 1 <!doctype html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <meta name="viewport"
 6           content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
 7     <meta http-equiv="X-UA-Compatible" content="ie=edge">
 8     <title>文本样式</title>
 9 
10     <style type="text/css">
11         a{text-decoration:none}
12        div{text-indent:40px}
13        em{font-style:normal}
14        span{font-weight:bold}
15        h1{font:normal 20px/50px "楷体"}
16        h1{/* text-align:center */  /* color:gold */  /* color:#ff0000 */ color:rgb(255,0,0) }
17 
18     </style>
19 
20 </head>
21 <body>
22 
23 <a href="hhh">你好呀</a>
24 <br>
25 <h1>哈哈哈哈哈</h1>
26 
27 <div>
28     通过<em>fiddler</em>会话列表中<span>会显示捕获</span>会显示捕获的所有的http通信量,并以列表的形式展现出来,点击你想查看的一个或者多个会话,再点击右边的“Statistics”菜单,你就可以很轻松的查看到请求数、发送字节数等信息。如果你选择第一个请求和最后一个请求,还可以获得页面加载所消耗的总体时间,还可以从图表中分辨出哪些请求耗时最多,从而可以对页面的访问速度进行优化
29 </div>
30 
31 </body>
32 </html>

 

posted on 2019-10-31 22:59  cherry_ning  阅读(143)  评论(0)    收藏  举报

导航