CSS的三种方式

  • 内联样式
  • 行内样式表

  • 外部样式表(推荐)

    1. <!-- 
    2.   1.内联式 （行内式）
    3.   2.嵌入式
    4.   3.外部式
    5. -->
    6. <!DOCTYPE html>
    7. <html>
    8. <head>
    9.    <title></title>
    10.    <!-- 嵌入式 -->
    11.    <style type="text/css">
    12.        h3{
    13.            color: green;
    14.        }
    15.    </style>
    16.    <!-- 外部式 -->
    17.    <link rel="stylesheet" type="text/css" href="css/index.css">
    18. </head>
    19. <body>
    20.    <!-- 内联式 -->
    21.    <p style="color: red;">
    22.        文本颜色为什么颜色？
    23.    </p>
    24.    <h3>
    25.        沐风
    26.    </h3>
    27.    <h4>
    28.        ecithy
    29.    </h4>
    31. </body>
    32. </html>

css/index.css css目录下的index.css

  1. p{
  2.     color: orange;
  3.     font-size: 14px;
  4.     font-weight: bold;
  5. }
  6. #peiqi{
  7.     color: green;
  8. }
  9. #jj{
  10.     color: red;
  11. }
  12. .active{
  13.     color: gray;
  14. }
  15. .title{
  16.     font-size: 30px;
  17. }
  18. /*
  20.  #id选择器名称{
  21.     样式;
  22.  }
  23. */

三种引入方式的优先级

内联式 > 嵌入式 > 外部式