Advertisement
Baru_Berbagi

style.css

Oct 25th, 2020
2,905
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 2.17 KB | None | 0 0
  1. *{padding: 0; margin: 0; font-family: arial;}
  2.  
  3. .header{
  4.   width: 100%;
  5.   /* background-color: gray; */
  6.   background-image: url("latar.jpg");
  7.   background-size: cover;
  8. }
  9.  
  10. .container{
  11.   padding: 20px;
  12.   text-align: center;
  13. }
  14.  
  15. .container .text{
  16.   font-size: 35px;
  17.   color: white;
  18.   text-shadow: 2px 2px 2px black;
  19. }
  20.  
  21. .container .logo img{
  22.   width: 200px;
  23. }
  24.  
  25. /*Bagian Menu*/
  26.  
  27. .menu{
  28.   width: 100%;
  29.   float: left;
  30.   background-image: linear-gradient(#1f0A60,#21007f);
  31. }
  32.  
  33. .menuutama ul>li{
  34.   float: left;
  35.   list-style: none;
  36.   text-transform: capitalize;
  37.   font-size: 20px;
  38.   padding: 25px;
  39. }
  40.  
  41. .menuutama ul>li>a{
  42.   text-decoration: none;
  43.   color: white;
  44. }
  45.  
  46. .menuutama ul>li:hover{
  47.   background-color: #DD2121;
  48. }
  49.  
  50. /* kelas isi */
  51.  
  52. .isi{
  53.   width: 100%;
  54.   float: left;
  55. }
  56.  
  57. .isinya .col3{
  58.   box-sizing: border-box;
  59.   margin: 0.5%;
  60.   width: 32.33%;
  61.   float: left;
  62.   background-color: white;
  63.   border-radius: 10px;
  64.   box-shadow: 1px 1px 10px black;
  65. }
  66.  
  67. .gambar img{
  68.   width: 100%;
  69.   height: 30%;
  70.   box-sizing: border-box;
  71. }
  72.  
  73. .judul{
  74.   width: 100%;
  75.   box-sizing: border-box;
  76.   background-image: linear-gradient(#004A79,#00137f);
  77.   padding: 10px;
  78.   padding-bottom: 4px;
  79.   font-size: 20px;
  80.   font-weight: bold;
  81.   color: white;
  82.   border-top-left-radius: 10px;
  83.   border-top-right-radius: 10px;
  84. }
  85.  
  86. .tanggal{
  87.   color: white;
  88.   background-color: #17204E;
  89.   padding: 10px 0px 10px 10px;
  90. }
  91.  
  92. .isiberita{
  93.   padding: 10px;
  94.   text-align: justify;
  95. }
  96.  
  97. .tombol{
  98.   width: 100%;
  99.   text-align: right;
  100. }
  101.  
  102. .tombol a{
  103.   text-decoration: none;
  104.  
  105. }
  106.  
  107. .tombol .btn{
  108.   padding: 10px;
  109.   background-color: #17204E;
  110.   font-size: 15px;
  111.   color: white;
  112.   padding: 10px 20px 10px 20px;
  113. }
  114.  
  115. .tombol .btn:hover{
  116.   background-color: #DD2121;
  117. }
  118.  
  119. .tag{
  120.   clear: both;
  121.   padding: 5px 10px 5px 10px;
  122.   color: white;
  123.   background-color: #17204E;
  124.   border-bottom-left-radius: 10px;
  125.   border-bottom-right-radius: 10px;
  126.  
  127. }
  128.  
  129. /* ini adalah bagian footer */
  130.  
  131. .fot{
  132.   box-sizing: border-box;
  133.   width: 100%;
  134.   background-image: linear-gradient(#1f0A60,#21007f);
  135.   text-align: center;
  136.   clear: both;
  137.   color: white;
  138.   padding: 20px 20px 20px 10px;
  139. }
  140.  
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement