CSS(四) 设置文本样式

来源:互联网 发布:万界淘宝商txt百度云 编辑:程序博客网 时间:2024/06/05 09:33

如果对于类型为p1的文本的属性进行设置的话

.p1{        xxx:yyy;        aaa:bbb;    }

设置文字的字体,如果第一个值没有直接向后找
font-family: "Times New Roman",Arial;
font-family: 微软雅黑,黑体,宋体;
font-style: italic;设置文字的倾斜效果 (斜体italic)
font-weight: bold;设置文字的加粗效果
text-transform: capitalize;设置英文字母大小写转换(uppercase/lowercase)
font-size: 36px;设置文字的大小
text-decoration: none/underline/line-through/overline;设置文字的装饰效果
text-indent: 2em;设置段落首行缩进
word-spacing: 20px;
letter-spacing: 2px;
设置字词间距(注意区分中英文)
line-height: 1.5;设置文字的行高
text-align: left/right/center/justify;
设置文本的水平位置(justify 是左右两边分散对齐 center 收尾会有空白)
margin: 1px;设置段落之间的距离
color: blue;
background-color: red;
设置文字和背景的颜色
border: 1px red solid;边框设置

设置段落的垂直对齐方式(较为复杂)修改height

  <div class="greenBorder" style="display: table; height: 200px; #position: relative; overflow: hidden;">    <div style=" #position: absolute; #top: 50%;display: table-cell; vertical-align: middle;">      <div class="greenBorder" style=" #position: relative; #top: -50%">        xxxx      </div>    </div>  </div>
原创粉丝点击