当前位置:首页 > Web开发 > 正文

CSS基本样式

2024-03-31 Web开发

标签:

字体属性

文本属性呢,自我认为就是写文档的一些格式属性,,例如:字体颜色,字体加粗,字体大小,字体类型等,而且我们在输出测试用例报告的时候也可以用到这些属性,对测试报告进行优化。

<html> <head lang="en"> <meta charset="UTF-8"> <title>字体属性</title> <style> .box{ /*字体颜色*/ color: red; /*字体加粗*/ font-weight:bold ; /*font-weight: normal;*/ /*font-weight: 700;*/ /*font-weight: bolder;*/ /*font-weight: lighter;*/ /*字体大小*/ font-size: 20px; /*字体类型*/ font-style: italic; /*字体*/ font-family: 幼圆,楷体,微软雅黑; } h1{ /*font-weight: normal;*/ } </style> </head> <body> <div class="box">小测试</div> <h1>一号标题</h1> </body> </html> text属性 <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title>text属性</title> <style> .box{ /*内容水平对齐方式*/ /*text-align: right;*/ text-align: center; /*加下划线*/ text-decoration: underline; } a{ font-size: 26px; /*去下划线*/ /*text-decoration: none;*/ /*了解*/ /*删除线*/ /*text-decoration: line-through;*/ /*text-decoration: overline;*/ } p{ /*全部转换为大写*/ /*text-transform: uppercase;*/ /*全部转换为小写*/ /*text-transform: lowercase;*/ /*每个单词首字母大写*/ /*text-transform: capitalize;*/ } .two{ font-size: 20px; /*首行缩进*/ text-indent: 40px; } </style> </head> <body> <div class="box"> 今天不加班 <br/> <img src=http://www.mamicode.com/"images/pic2.jpeg" alt=""/> </div> <a href="#">超链接</a> <p> Lorem ipsum dolor sit amet, consectetur adipisicing elit. Autem cum deserunt dignissimos, hic officiis praesentium ullam! Ab dolorem doloribus ea et harum mollitia neque optio suscipit tempora temporibus, vel voluptas! </p> <div class="two"> 学习强国 小测试 接口自动化 APP自动化 </div> </body> </html>

CSS基本样式-文本属性

温馨提示: 本文由Jm博客推荐,转载请保留链接: https://www.jmwww.net/file/web/39706.html