Home Explore Help
Register Sign In
LenDoc
/
homework
Watch 1
Star 0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Browse Source

task at the end of the lecture on css #1

LenDoc 2 years ago
parent
e4e104b80e
commit
cd8ff703f5
7 changed files with 99 additions and 0 deletions
Split View Show Diff Stats
  1. BIN
      css1/img/1.jpg
  2. BIN
      css1/img/2.png
  3. BIN
      css1/img/3.png
  4. BIN
      css1/img/4.png
  5. BIN
      css1/img/5.png
  6. 38 0
      css1/index.html
  7. 61 0
      css1/style.css

BIN
css1/img/1.jpg
View File


BIN
css1/img/2.png
View File


BIN
css1/img/3.png
View File


BIN
css1/img/4.png
View File


BIN
css1/img/5.png
View File


+ 38 - 0
css1/index.html
View File 

@@ -0,0 +1,38 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+<head>
 
+    <meta charset="UTF-8">
 
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
 
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
+    <link rel="stylesheet" href="style.css">
 
+    <title>CSS PRACTISE #1</title>
 
+</head>
 
+<body>
 
+    <!-- <img src="img/camera2.png"/> -->
 
+    <!-- <img src="img/2.jpg"/>
 
+    <img src="img/3.jpg"/> -->
 
+    <!-- <img src="img/camera2.png"/> -->
 
+    <!-- <div class="holder">
 
+        <h1>Title</h1>
 
+        <ul class="list">
 
+          <li>
 
+            <a href="#">link1</a>
 
+            <ul>
 
+              <li><a href="#">link2</a></li>
 
+              <li><a href="#">link3</a></li>
 
+            </ul>
 
+          </li>
 
+          <li><a href="https://www.youtube.com/">link4</a></li>
 
+          <li><a href="https://validator.w3.org/">link5</a></li>
 
+          <li><a href="#">link6</a></li>
 
+        </ul>
 
+        <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Dolore, accusamus.</p>
 
+        <h1>Title</h1>
 
+        <p>Lorem ipsum dolor sit amet.</p>
 
+      </div> -->
 
+     
+
 
+      <div class="bg">
 
+      </div>
 
+</body>
 
+</html>

+ 61 - 0
css1/style.css
View File 

@@ -0,0 +1,61 @@
 
+ /*body{
 
+    /* background-color: aqua; */
 
+}
 
+img{
 
+    /* background-clip: padding-box;
 
+    background: #fff;
 
+    border: black;
 
+    border-width: 100px; 
+    border-style: dashed;
 
+    vertical-align:bottom;
 
+} */
 
+
 
+
 
+/* .col { 
+    background: #f0f0f0; /* Цвет фона */
 
+    width: 230px; /* Ширина блока */
 
+    padding: 10px; /* Поля */
 
+    font-size: 1.5em; /* Размер шрифта */
 
+    word-wrap: break-all; /* Перенос слов */ 
+    line-height: 10em;
 
+}
 
+blockquote {
 
+    margin: 0;
 
+}
 
+
 
+blockquote p {
 
+    padding: 15px;
 
+    background: #eee;
 
+    border-radius: 5px;
 
+}
 
+
 
+blockquote p::before {
 
+    content: '\201C';
 
+}
 
+
 
+blockquote p::after {
 
+    content: '\201D';
 
+}
 
+a[href^='https://'] {
 
+    color: red;
 
+    font-size: 30px;
 
+}*/
 
+
 
+.holder:last-of-type{
 
+color:black;
 
+} 
+
 
+.bg{
 
+    display:block;
 
+    text-align: center;
 
+    /* width: 500px;
 
+    height: 400px;
 
+    background-image: url("img/1.jpg") ; */
 
+    width: 500px;
 
+    height: 500px;
 
+    background-color: green;
 
+    background-image: url("img/1.jpg"),url("img/2.png"),url("img/3.png"),url("img/4.png"),url("img/5.png"); 
+    background-size:300px,150px,40px,40px,40px;
 
+    background-repeat: no-repeat,repeat-x, repeat-x,repeat-y, repeat-y;
 
+    background-position: center,bottom,top,left, right;
 
+}