字体属性
字体大小
字体粗细
字体颜色
文字排布
文字行高
文字阴影
<head><meta charset="utf-8" /><title></title><style type="text/css">.d1{width:600px;height: 200px;/* background-color:darkcyan; */margin: 0 auto;font-size: 50px;/* 设置字体：设置的字体必须在系统里面是存在的，如果没有这个字体，就会默认按照系统字体样式显示 */font-family: 宋体;/* 设置字体的粗细，100-900，默认正常的字体粗细，但是比如设置900，最粗的字体，但是系统没有这样粗的字体，依然会按照系统默认的显示*/font-weight:100; /* 字体颜色 */color: aqua;/* 设置字体排布，默认向左排布 center right*/text-align: center;/* 文字行高：两行文字中间的举例 */line-height: 200px;/* 文字阴影 text-shadow:水平偏移举例，垂直的偏移距离，模糊度，阴影的颜色*/text-shadow: 10px 5px 5px black ;}.d2{width:600px;height: 200px;/* background-color:darkcyan; */margin: 0 auto;font-size: 50px;/* 设置字体：设置的字体必须在系统里面是存在的，如果没有这个字体，就会默认按照系统字体样式显示 */font-family: 宋体;/* 设置字体的粗细，100-900，默认正常的字体粗细，但是比如设置900，最粗的字体，但是系统没有这样粗的字体，依然会按照系统默认的显示*/font-weight:100; /* 字体颜色 */color: #fff;/* 设置字体排布，默认向左排布 center right*/text-align: center;/* 文字行高：两行文字中间的举例 */line-height: 200px;/* 文字阴影 text-shadow:水平偏移举例，垂直的偏移距离，模糊度，阴影的颜色*//* 镂空效果 */text-shadow: 0px 0px 10px black ;}.d3{width:600px;height: 200px;/* background-color:darkcyan; */margin: 0 auto;font-size: 50px;/* 设置字体：设置的字体必须在系统里面是存在的，如果没有这个字体，就会默认按照系统字体样式显示 */font-family: 宋体;/* 设置字体的粗细，100-900，默认正常的字体粗细，但是比如设置900，最粗的字体，但是系统没有这样粗的字体，依然会按照系统默认的显示*/font-weight:normal; /* 字体颜色 */color: #fff;/* 设置字体排布，默认向左排布 center right*/text-align: center;/* 文字行高：两行文字中间的举例 */line-height: 200px;/* 文字阴影 text-shadow:水平偏移举例，垂直的偏移距离，模糊度，阴影的颜色*//* 字体发光，一个字体可以设置多个阴影，不是写多哥text-shadow，而是在里面加逗号，阴影的模糊度不断缩小，形成一层一层的效果，外加动画效果*/text-shadow: 0px 0px 20px yellow,0px 0px 10px orange,0px 0px 10px orangered,0px 0px 10px red;animation: donghua 3s infinite alternate;}@keyframes donghua{from{text-shadow: 0px 0px 20px yellow,0px 0px 10px orange,0px 0px 10px orangered,0px 0px 10px red;}to{text-shadow: 0px 0px 0px yellow,0px 0px 0px orange,0px 0px 0px orangered,0px 0px 0px red;}}.d4{width:600px;height: 200px;/* background-color:darkcyan; */margin: 0 auto;font-size: 100px;/* 设置字体：设置的字体必须在系统里面是存在的，如果没有这个字体，就会默认按照系统字体样式显示 */font-family: 宋体;/* 设置字体的粗细，100-900，默认正常的字体粗细，但是比如设置900，最粗的字体，但是系统没有这样粗的字体，依然会按照系统默认的显示*/font-weight:normal; /* 字体颜色 */color: #fff;/* 设置字体排布，默认向左排布 center right*/text-align: center;/* 文字行高：两行文字中间的举例 */line-height: 200px;/* 文字阴影 text-shadow:水平偏移举例，垂直的偏移距离，模糊度，阴影的颜色*//* 3D字体，不用设置模糊度*/text-shadow: 2px 2px 0px yellow,4px 4px 0px orange,6px 6px 0px orangered,8px 8px 0px red;}</style></head><body><div class="d1">hello world</div><div class="d2">hello world</div><div class="d3">hello world</div><div class="d4">hello world</div></body>