5_基础样式-文本字体.html 1.6 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  7. <title>Document</title>
  8. <style>
  9. div{
  10. width: 300px;
  11. height: 50px;
  12. background: #ccc;
  13. /* 字体相关属性 */
  14. font-family:Microsoft YaHei,Heiti SC,tahoma,arial,Hiragino Sans GB,"\5B8B\4F53",sans-serif;
  15. /* 字体大小 浏览器默认字体大小是16px 浏览器能支持的最小 12px */
  16. font-size: 16px;
  17. /* 字体粗细 100-900 没有单位 400|normal 默认值 700|bold 900|bolder */
  18. font-weight:900 ;
  19. /* 字体风格 italic 斜体|normal 正常 默认值*/
  20. font-style: italic;
  21. color:red;
  22. /* 文本相关属性 */
  23. /* 文本水平对齐 left 左|center中|right右 */
  24. text-align: center;
  25. /* 垂直对齐方式 行高=高 */
  26. line-height: 50px;
  27. /* 文本修饰 underline下划线 | line-through中划线|none没有 默认值 */
  28. text-decoration: none;
  29. /* 文本缩进 */
  30. text-indent: 20px;
  31. }
  32. /* a标签 自带下划线 ; 可以通过 text-decoration: none 去掉*/
  33. a{
  34. text-decoration: none;
  35. }
  36. </style>
  37. </head>
  38. <body>
  39. <div>
  40. 我是一个div 哈哈哈
  41. </div>
  42. 我是一个div 哈哈哈
  43. <a href="#">amjahhaj</a>
  44. </body>
  45. </html>