Css reference

Developer
Jonathan De Jesús
Size
2,022 Kb
Views
16,192
  1. Css reference Previews
  2. Css reference HTML Codes
  3. Css reference CSS Codes

How do I make an css reference?

What is a css reference? How do you make a css reference? This script and codes were developed by Jonathan De Jesús on 24 November 2022, Thursday.

Css reference Previews
IQ Test

Css reference - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Css reference</title> <link href="https://fonts.googleapis.com/css?family=Open+Sans:300,400,700" rel="stylesheet"> <link rel="stylesheet" href="css/style.css">
</head>
<body> <div class="heading"> <h2>CSS PROPERTIES</h2> <hr />
</div><!--heading-->
<div class="content"> <h5>Z-INDEX</h5> <div class="boxcontainer"> <div class="zindex"> <ul> <li></li> <li></li> <li></li> </ul> </div><!--zindex--> </div><!--box-container--><br> <h5>FONT WEIGHT</h5> <div class="boxcontainer"> <h2 class=fontweight>Aa <span>Bb</span></h2> </div><!--boxcontainer-->
</div><!--content-->
</body>
</html>

Css reference - Script Codes CSS Codes

body{ font-family: 'Open Sans', sans-serif;/*300 400 700*/
}
h2{ font-weight:300; text-align:center;
}
h5{ font-size:14px;
}
.heading{ padding-bottom:2em;
}
.heading,.content{ width:50%; margin:0px auto;
}
.boxcontainer{ background-color:#E8EAF6; width:100%; height:300px; padding-top:2em;
}
.boxcontainer ul{ margin-left:15em;
}
.zindex ul li{ list-style-type:none; padding:12px; width:100px; height:100px; background-color: #ddd; display:inline-block; margin:0; position:relative; vertical-align:middle;
}
.zindex ul li:nth-child(1){ background:#0D47A1; margin-right:-115px; z-index:50; box-shadow:2px 5px 10px rgba(0,0,0,0.53);width:150px;
}
.zindex ul li:nth-child(2){ background:#1565C0; margin-right:-75px;z-index:25; height:200px;box-shadow:2px 5px 10px rgba(0,0,0,0.23)
}
.zindex ul li:nth-child(3){ background:#448AFF;z-index:50;box-shadow:-7px 1px 10px rgba(0,0,0,0.4);height:130px;
}
.fontweight{ text-align:center; font-size:68px; padding-top:.55em; font-weight:300;
}
.fontweight span{ font-weight:700;
}
Css reference - Script Codes
Css reference - Script Codes
Home Page Home
Developer Jonathan De Jesús
Username JonathanDeJesus
Uploaded November 24, 2022
Rating 3
Size 2,022 Kb
Views 16,192
Do you need developer help for Css reference?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Jonathan De Jesús (JonathanDeJesus) Script Codes
Name
Daily UI Sign Up
Responsive modal window
Blog design idea
Case Studies
Personal site
My first pen
JS
Enveer
CodeCamp Tribute Page
Color
Create amazing SEO content with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!