SHARE
TWEET

Untitled

a guest Feb 27th, 2020 101 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <html>
  2.    
  3.     <head>
  4.        
  5.         <meta charset="utf-8"> <title>Przejścia</title> <link rel="stylesheet" type="text/css" href="przejscia.css">
  6.        
  7.     </head>
  8.    
  9.     <body>
  10.     <div> ZSP numer 2</div>
  11.    
  12.    
  13.     </body>
  14.    
  15. </html>
  16.  
  17. --------------------------------------------------------------------------
  18.  
  19.  
  20. div {
  21.  
  22.     width: 270px;
  23.     height: 60px;
  24.     text-align: center;
  25.     margin: 0 auto;
  26.     background-color: black;
  27.     color: red;
  28.     font-size: 15;
  29.     border: solid 2px blue;
  30.    
  31.     transition-property: background-color, font-size, border-width, border-color;
  32.     transition-duration: 4s, 2s, 3s, 3s;
  33.     transition-timing-function: steps(5, start) linear, linear;
  34.     transition-delay: 1s, 250ms, 0s, 0s;
  35.    
  36.     /* transition: background-color 4s steps(5, start) 1s, font-size 2s linear 250ms; */
  37.  
  38. --------------------------------------------------------------------------
  39.  
  40. }
  41.  
  42. div:hover {
  43.     background-color: silver;
  44.     font-size: 45px;
  45.     border-width: 10px;
  46.     border-color: yellow;
  47. }
  48.  
  49. body { background-color: green
  50. }
  51.  
  52.  
  53.  
  54. div {
  55.  
  56.     width: 270px;
  57.     height: 60px;
  58.     text-align: center;
  59.     margin: 0 auto;
  60.     background-color: black;
  61.     color: red;
  62.     font-size: 15;
  63.     border: solid 2px blue;
  64.    
  65.     transition-property: background-color, font-size, border-width, border-color;
  66.     transition-duration: 4s, 2s, 3s, 3s;
  67.     transition-timing-function: steps(5, start) linear, linear;
  68.     transition-delay: 1s, 250ms, 0s, 0s;
  69.    
  70.     /* transition: background-color 4s steps(5, start) 1s, font-size 2s linear 250ms; */
  71.    
  72.    
  73. }
  74.  
  75. div:hover {
  76.     background-color: silver;
  77.     font-size: 45px;
  78.     border-width: 10px;
  79.     border-color: yellow;
  80. }
  81.  
  82. body { background-color: green
  83. }
  84.  
  85.  
  86.  
  87.  body {
  88.     background-color: gray;
  89. }  
  90.  
  91. div {
  92.     margin: 0 auto;
  93.     width: 200px;
  94.     height: 50px;
  95.     background-color: green;
  96.     color: red;
  97.     font-size: 45px;
  98.     text-align: center;
  99.     border: solid 2px blue;
  100. }  
  101.  
  102. #d2_1 {
  103.     transform: rotate(30deg);
  104. }  
  105.  
  106. #d2_2 {
  107.     /*transform-origin: px px lub % % lub słowa kluczowe: left, right, bottom, top, center */
  108.     transform-origin: left top;
  109.     transform: rotate(-60deg);
  110. }  
  111.  
  112. #d2_3 {
  113.     transform-origin: 100% 100%;
  114.     transform: rotate(20deg);
  115. }  
  116.  
  117. #d2_4 {
  118.     /*przesunięcie w poziomie i pionie*/
  119.     transform: translateX(20px) translateY(-30%);
  120. }  
  121.  
  122. #d2_5 {
  123.     transform: translate(-50%, 50px);
  124. }  
  125.  
  126. #d2_6 {
  127.     transform: scaleX(2) scaleY(0.5);
  128. }  
  129.  
  130. #d2_7 {
  131.     transform: scale(0.5, 3);
  132. }
  133.  
  134. #d2_8 {
  135.     transform: scale(-1, -1);
  136.     /* "-" powoduje lustrzane odbicie */
  137. }  
  138.  
  139. --------------------------------------------------------------------------
  140.  
  141. #gradienty {
  142.     background-image: linear-gradient(to left, blue, green, yellow)
  143. }
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
Top