6_文本字体相关.html 1.3 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647
  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. #div1 {
  10. width: 200px;
  11. height: 200px;
  12. background: #f00;
  13. /* 文本 对齐方式*/
  14. /* 水平对齐 left|center|right */
  15. text-align: right;
  16. /* 垂直对齐 单行文本垂直对齐 line-height=height*/
  17. line-height: 200px;
  18. /* 字体 默认大小16px 浏览器支持的最小字体 12px*/
  19. font-size:16px ;
  20. /* 字体 */
  21. font-family:Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
  22. /* 字粗细 100-900 没有单位 默认值400|normal 700|bold 900|bolder*/
  23. font-weight: 700;
  24. /* 字体样式风格italic |normal */
  25. font-style: italic;
  26. /* 设置文字颜色 */
  27. color:rgb(255,0,0);
  28. /* #f00 */
  29. }
  30. </style>
  31. </head>
  32. <body>
  33. 哈哈哈哈哈 你好啊
  34. <div id="div1">
  35. 哈哈哈哈哈 你好啊
  36. </div>
  37. </body>
  38. </html>