CSS Tutorial
Our CSS tutorial, suitable for both beginners and professionals, covers fundamental and advanced CSS concepts. It includes key points on CSS technology, ranging from basic to advanced topics.
What is CSS
CSS stands for Cascading Style Sheets.CSS is utilized to style HTML elements.CSS is a commonly used language for web design.Together with HTML and JavaScript, CSS enables web designers to apply visual styles to HTML tags.
Selectors:
Target HTML elements to apply styles. For example, p { color: red; } changes all paragraph text to red.
Box Model:
Elements have margins, borders, padding, and content areas. Adjust these with properties like margin, border, padding.
Colors and Fonts:
Use color for text and background-color for backgrounds. Define fonts with font-family, font-size.
Layout:
Use properties like display, position, flex, and grid to arrange elements.
Responsive Design:
Use media queries like @media (max-width: 600px) { ... } to adapt styles for different screen sizes.
Example :
<!DOCTYPE
html>
<html>
<html>
<head>
<style>
h1 {
color:
white;
background-color:
red;
padding:
5px;
}
p {
color:
blue;
}
</style>
</head>
<body>
<h1>Hello Friends</h1>
<p>This is a
paragraph.</p>
</body>
</html>
Output :
CSS three properties
CSS provides three properties to design the box model, apply opacity, and
set border radius, among other features.
All CSS properties
CSS includes properties like background, border, font, float, display,
margin, opacity, padding, text-align, vertical-align, position, and color,
among others.