Strona główna Odkrywaj Pomoc
Zaloguj się
lovecoding
/
VIP20
6
0
Forkuj 0
Pliki Problemy 0 Oczekujące zmiany 0 Wiki
Drzewo: be673c86e1
Gałęzie Tagi
VIP20
/
2_css
/
20_复习.html

20_复习.html 1.8 KB
Historia Czysty

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697 
  1. <!DOCTYPE html>
    2. 

  2. <html lang="en">
    3. 

  3. <head>
    4. 

  4.     <meta charset="UTF-8">
    5. 

  5.     <meta http-equiv="X-UA-Compatible" content="IE=edge">
    6. 

  6.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
    7. 

  7.     <title>Document</title>
    8. 

  8.     <style>
    9. 

  9.         #div1{
    10. 

  10. 

  11.         }
    12. 

  12.         p{
    13. 

  13. 

  14.         }
    15. 

  15.         .aa{
    16. 

  16. 

  17.         }
    18. 

  18. 

  19.         #ul1 li{
    20. 

  20. 

  21.         }
    22. 

  22.         /* 子代 */
    23. 

  23.         #ul1 > li{
    24. 

  24. 

  25.         }
    26. 

  26. 

  27.         a:hover{
    28. 

  28. 

  29.         }
    30. 

  30. 

  31.         *{
    32. 

  32. 

  33.         }
    34. 

  34. 

  35.         /* style > id >class > 标签 */
    36. 

  36. 

  37.         /* 基础样式 */
    38. 

  38.         div{
    39. 

  39.             width:200px;
    40. 

  40.             height:200px;
    41. 

  41. 

  42.             background: red url(xx.jpg) no-repeat 0 0;
    43. 

  43. 

  44.             /* 字体 */
    45. 

  45.             font-size: 16px;
    46. 

  46.             font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
    47. 

  47.             font-weight: 400;
    48. 

  48.             font-style: italic;
    49. 

  49.             color:green;
    50. 

  50. 

  51.             /* 文本 */
    52. 

  52.             /* 1水平对齐 */
    53. 

  53.             text-align: left;
    54. 

  54.             height: 50px;
    55. 

  55.             /* 2单行文本垂直对齐 */
    56. 

  56.             line-height:50px ;
    57. 

  57. 

  58.             /* 文本修饰 underline none line-through  */
    59. 

  59.             text-decoration: none;
    60. 

  60. 

  61.         }
    62. 

  62. 

  63.         ul{
    64. 

  64.             list-style: none;
    65. 

  65.         }
    66. 

  66. 

  67. 

  68.         /* display */
    69. 

  69.         /* display:
    70. 

  70.             inline   行级元素   多个占一行  不能设置宽高
    71. 

  71.                 span a strong i 
    72. 

  72.             block    块级元素   自己占一行  可以设置宽高
    73. 

  73.                 div p ul li h1-h6
    74. 

  74.             inline-block 行级块元素  多个占一行  可以设置宽高
    75. 

  75.             
    76. 

  76.             none 隐藏
    77. 

  77.         */
    78. 

  78. 

  79. 

  80.         /* 浮动 */
    81. 

  81.         /* float:left |right |none */
    82. 

  82. 

  83.         
    84. 

  84. 

  85. 

  86. 

  87.         /* 盒模型 */
    88. 

  88. 

  89. 

  90.     </style>
    91. 

  91. </head>
    92. 

  92. <body>
    93. 

  93. 

  94. 

  95.     
    96. 

  96. </body>
    97. 

  97. </html>
    98.