<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <style> p{ /*字体颜色*/ color: darkmagenta; /*字体的修改,前面是字体族名称,最后一个是类族名称,浏览器在实现字体的时候,会依次判断 是否支持当前的字体,直到最后的字体系列。*/ font-family: 仿宋,宋体,黑体,sans-serif; /*复合属性:font:12px/1.5,仿宋,宋体,sans-serif 也是字体的实现, 其中12px/1.5是字体所占的行高是12px*1.5即18px。*/ /*字体大小,取值:1:具体的px值。2:百分比%(默认字体大小16px)*/ font-size: 40px; /*bold加粗,bolder深度加粗,lighter细体,100-900*/ font-weight: bolder; /*字体显示格式,斜体和正常*/ font-style: italic; /*字体透明度,1是默认的颜色,0是全透明。*/ opacity: 0.5; /*行高 单行字体占用的高度, 也可以用百分比%,100%就是跟字体大小一样的高度,字紧挨着。*/ line-height: 100px;/*如果想让文本上下居中,设置行高和外部容器的高度一直就可以。*/ /*text-align是自己的位置,justify是两端对其,left或者start:左对齐(默认) right或者end:右对齐,center居中*/ text-align: justify; /*字符间距*/ letter-spacing: normal; /*文本修饰 上划线(overline),下划线(underline),删除线(line-through)*/ text-decoration: none; /*自动处理数字、英文的文本长度。 auto自动给溢出的加上滚动条,紧挨着字体的部分。拖拽只是溢出的文本移动。 hidden超出的部分自动切断,inherit和visible是自动加上滚动条, 在网页的最下方,拖拽整个网页都移动。 scroll是给所有的文本内容不管溢出不溢出都加上滚动条。 */ overflow: visible; /*text-overflow是显示单行文本超出的时候如何显示,ellipsis是‘...’显示*/ text-overflow: ellipsis; /* /!*下面是三行配合写法是让溢出的地方用‘...’来显示*!/ overflow: hidden; white-space: nowrap;/!*不换行*!/ text-overflow: ellipsis;/!*‘.....’显示*!/ */ /*文本阴影,第一个是x轴方向投影,第二个是y轴方向投影。第三个是颜色。*/ text-shadow: 1px 1px yellow; /*文本描边,第一个是边的宽度,第二个是颜色。*/ -webkit-text-stroke: 1px red; /*缩进两倍的字符大小,无论字体大笑怎么变化,都会缩进两个字符。*/ text-indent: 2em; } </style> <title>字体属性</title> </head> <body> <p id="p1"> 下载这个东西之后,就可以安装到电脑上,然后就可以尽情的玩乐啦。 下载这个东西之后,就可以安装到电脑上,然后就可以尽情的玩乐啦。 下载这个东西之后,就可以安装到电脑上,然后就可以尽情的玩乐啦。 下载这个东西之后,就可以安装到电脑上,然后就可以尽情的玩乐啦。 </p> <p> qqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqqq </p> </body> </html>
HTML5第五课时,背景图片
最新推荐文章于 2021-10-12 21:30:53 发布