CSS stands for Cascading Style Sheets, and it is a language used to describe the presentation of HTML (Hypertext Markup Language) and XML (Extensible Markup Language) documents. CSS is used to control the layout, fonts, colors, and other visual aspects of web pages and user interfaces.
Inline Styles
Internal Style Sheets
External Style Sheets
This method allows you to apply styles directly to an HTML element using the style attribute. This method is useful for making quick, one-off style changes.
<h1 style="color: red;">This heading containt red color</h1>
This method allows you to define the styles within the section of your HTML document, using the <style> tag. This method is useful when you want to apply styles to a specific page only.
<head>
<style>
h1 {
color: red;
}
</style>
</head>
In this method, you can define the styles in a separate CSS file, which is then linked to your HTML document using the tag. This method allows you to maintain consistent styles across multiple pages.
<head>
<link rel="stylesheet" type="text/css" href="styles.css">
</head>
/* Element Selector */
h1 {
font-size: 24px;
}
/* Class Selector */
.myClass {
background-color: #fff;
}
/* ID Selector */
#myId {
border: 1px solid black;
}
CSS functions are built-in functions that allow you to perform calculations, manipulate values, and apply complex effects to your styles. CSS functions take one or more input values and return a modified value that can be used in your styles.
width: calc(50% - 20px);
--primary-color: #007bff;
color: var(--primary-color);
background-color: rgba(255, 0, 0, 0.5);
color: hsl(120, 100%, 50%);
background-image: url("background.png");
content: attr(title);
background-image: linear-gradient(to right, red, orange, yellow, green);
width: min(50%, 200px);
font-size: clamp(16px, 2.5vw, 24px);
-
css text property
-
create article using html css
-
text logo using css
-
css box layout
-
css window 8 start menu
-
nested box layout
-
css border
-
css position
-
css navigation
text-shadow and box-shadow
border-radius
border-image
background-image
css 2d and 3d
css animation
css flex layout
https://www.w3schools.com/cssref/playit.asp?filename=playcss_filter&preval=none
Back To Home Page
<style type="text/css"> h1 {color:royalblue;} p {color:#686e78; font-size:1.2rem;} </style>
okay