style.css 2.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081
  1. /* После каждого уровня сделал отступ, чтобы скажем так
  2. выделить уровни, думаю вам так будет легче проверять */
  3. body {
  4. margin: 0;
  5. }
  6. /* 1.Первый уровень */
  7. blockquote {
  8. color: green;
  9. }
  10. /* 2.Второй уровень */
  11. .holder{
  12. margin-top: 100px;
  13. }
  14. /*1) обратился только к тем ссылкам, значение атрибута href
  15. которых начинается с https и сделал их красным цветом */
  16. a[href^="https"] {
  17. color: red;
  18. }
  19. /* 2) применил только для последней ссылки в первом писке
  20. (list6), задал ей синий фоновый цвет и изменил цвет текста
  21. на белый, чтобы был виден текст */
  22. .list > li + li > a[href^="#"] {
  23. background: blue;
  24. color: white;
  25. }
  26. /* 3) будет действовать только для <p>, который идет после
  27. <ul> и задал размер шрифта 26px */
  28. .list + p {
  29. font-size: 26px;
  30. }
  31. /* 3.Третий уровень */
  32. h3:nth-child(odd) {
  33. color: pink;
  34. margin-top: 100px;
  35. }
  36. #greycol {
  37. color: grey;
  38. }
  39. div:nth-child(odd) {
  40. color: red;
  41. }
  42. h3 + p:nth-child(odd) {
  43. color: green;
  44. }
  45. .yellow {
  46. color: yellow;
  47. }
  48. /* 4.Четвертый уровень */
  49. .bg-box {
  50. margin-top: 100px;
  51. border: 3px white solid; /* Надо поменять цвет, чтобы увидеть бордер */
  52. border-left: 0;
  53. border-bottom: 0;
  54. width: 1162px;
  55. height: 658px;
  56. background-color: #007000;
  57. background-image:
  58. url(images/lamp.png),
  59. url(images/zel.png),
  60. url(images/ёжик.png),
  61. url(images/pon.png),
  62. url(images/hous.jpg);
  63. background-position: top, bottom, left, right, center;
  64. background-size: 47px 78px, 267px 148px, 33px 27px, 35px 33px, auto;
  65. background-repeat: repeat-x, repeat-x, repeat-y, repeat-y, no-repeat;
  66. }