CSS Tutorial 2
CSS Tutorial 2

CSS Tutorial 2

Rate this post

CSS Tutorial 2

<!DOCTYPE html>
<html>
<head>
<title>css tutorial 2</title>
<link rel=”icon” href=”./icon/9.png”>
<link rel=”stylesheet” href=”./css/app.css”>
</head>
<body>

<h1>background </h1>
<h2>background color </h2>
<h3>background image </h3>
<h4>background repeat </h4>
<h5>background attachment </h5>
<h6>background position</h6>

</body>
</html>

app.css

body {
 background-color: gray;
}
 
*{
color: white;
height:150px;
margin:10px;
}
 
h1{
 
background: blue;
 
}
h2{
 
background-color: blue;
}
 
h3{
 
background-image: url(“../icon/9.png”);
}
h4{
background-image: url(“../icon/9.png”);
background-repeat:no-repeat;
background-attachment: fixed;  
background-position: center;   
 
}
h5{
 
background-color: blue;
}
h6{
 
background-color: blue;
}

CSS border/Background

CSS Background

1. background-color
2. background-image
3. background-repeat
4. background-attachment
5. background-position

CSS Border

1. border
2. border-style
3. border-color
4. border-width
5. border-radius

Border

1. border: 10px solid blue;
2. border-style: none/dotted/dashed/solid/double/groove/ridge/inset/outset /hidden;
3. border-color: Blue/red/green/ tomato;
4.border-width: 10px/5px/12px;
5.border-radius: 20px 20px 20px 20px;
6. border-block: 5px solid red;
7. border-inline: 5px solid red;
8. border-top: 5px solid red;
9. border-bottom: 5px solid red;
10. border-left: 5px solid red;
11. border-right: 5px solid red;

Background

1. background: blue;
2. background-size: auto/contain/cover/50%/30px;
3. background-color: blue/red/green/black;
4.background-image: url(“1.png”);
5. background-repeat: repeat/no-repeat/repeat-x/repeat-y/space/round;
6. background-attachment: fixed/local/initial/inherit/scroll;
7. background-position: left/right/top/bottom/center;
8. background-position-x:
9. background-position-y:
10. background-clip: border-box/padding-box/content-box;
11. background-origin: border-box/padding-box/content-box;
12. background-blend-mode: normal/multiply/screen/overlay/darken/lighten/color-dodge/ saturation/color/luminosity;
13. block-size: auto/10px/50px/100px;