CSS系列之美化网页/span标签和div标签/字体样式/文本样式
01 span标签和div标签
span标签的作用 能让几个文字或者某个词语凸显出来属于行内元素 div标签 属于块级元素 程序示例：<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>span标签</title><style>#a{font-size: 40px;color: red;font-weight: bold;}.b{font-size: 20px;color: black;font-weight: bold;}#c{font-size: 30px;color: red;font-weight: bold;}#d{font-size: 30px;color: red;font-weight: bold;}</style></head><body><p><span class="b">你要批评指点四周风景，</span> <span id="a">你首先要爬上屋顶</span></p><div class="b">不以<span id="c">物</span>喜，不以<span id="d">己</span>悲</div></body></html>
运行结果
02 字体样式
常用字体样式设置03 文本样式
常用文本样式设置04 文本阴影
text-shadow属性在CSS2.0中出现，但迟迟未被各大浏览器所支持，因此在
CSS2.1中被废弃，如今在CSS3中得到了各大浏览器的支持
格式：
text-shadow：color（阴影颜色）x-offset(阴影水平位移) y-offset(阴影垂直位移) blur-radius(阴影模糊半径)
程序示例
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>Title</title><style>/*用后代选择器给基础代码添加字体样式和文本样式*/.demo a{float: left; /*设置浮动*/display: block;/*设置元素的显示属性 block 元素会被显示为块级元素*/height: 50px;/*设置元素高度*/width: 50px;/*设置元素宽度*/border-radius: 10px;/*设置圆角边框*/background: antiquewhite;/*设置背景颜色*/color: white;/*设置文本颜色*/text-align: center;/*设置文本居中*/line-height: 50px;/*设置文本行高*/text-decoration: aliceblue;/*设置文本装饰*/margin: 5px;/*设置外边距*/font-family: "Courier New";/*设置字体类型*/}</style></head><body><p class="demo"><a href="" >1</a><a href="" >2</a><a href="" >3</a><a href="" >4</a><a href="" >5</a><a href="" >6</a><a href="" >7</a><a href="" >8</a><a href="" >9</a></p></body></html>
运行结果
