index.css 786 B

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960
  1. @charset "UTF-8";
  2. * {
  3. margin: 0;
  4. padding: 0;
  5. list-style: none;
  6. text-decoration: none;
  7. box-sizing: border-box;
  8. }
  9. body, html {
  10. font-size: 30px;
  11. }
  12. /* 你好 */
  13. .windy, ul {
  14. color: #ff0;
  15. background-color: #f00;
  16. }
  17. h1 {
  18. width: 400px;
  19. height: 100px;
  20. font-size: 50px;
  21. background: yellow;
  22. }
  23. ul {
  24. width: 400px;
  25. height: 400px;
  26. background: #ff0;
  27. list-style: none;
  28. width: 200px;
  29. height: 300px;
  30. margin: 10px;
  31. border: 3px solid #00f;
  32. }
  33. ul li {
  34. padding: 10px;
  35. }
  36. ul li a {
  37. text-decoration: none;
  38. color: #00f;
  39. font-size: 40px;
  40. font-weight: bold;
  41. }
  42. ul li a:hover {
  43. color: #f00;
  44. }
  45. /*
  46. 混合宏
  47. @mixin 允许定义一个可以再整个样式表复制的样式
  48. @include 可以将mixin混入到整个样式表中
  49. */
  50. p {
  51. color: #00f;
  52. }