What is CSS ?
CSS is the style sheet type documents, CSS stands for Cascading Style Sheet. By CSS we can style our html page , CSS describe how our html page are displayed in the screen or other media.By css we can do many work ,it controls the Layouts of multiple web pages.
How Write CSS ?
CSS is so simple to write. Mainly it targets the the HTML elements by using the Html Class and Html Id. At first it targets the HTML elements then it writes the according its Styles. CSS we can write two ways, those are
ii) External CSS File
The other written type CSS is the External CSS File when the HTML file is so much bigger and the CSS code also so many then for the CSS coding we make a External CSS File and Link with the HTML file. The Link will attached between the <head> </head> Tag. The Link looks like
Example :
Html code :
External CSS code
Out Put :
How Target HTML Elements for CSS ?
CSS work by targeting the HTML elements . At first the CSS targets one or more elements of HTML then Styles the element or elements. The Html can targets in two ways that's are
i) By Id
ii) By Class
i) By Id
In this type targeting we give every HTML elements a Unique Id
then we target the element in CSS using the Unique Id and then
we style the element.When write Css by the Id the we must have to write the hashtag (#) symbol before the Id, Like as Apply CSS in HTML page #example1{ }
Example:
html code :
CSS code :
Out Put :
Apply CSS in HTML page .example1{ }
CSS is the style sheet type documents, CSS stands for Cascading Style Sheet. By CSS we can style our html page , CSS describe how our html page are displayed in the screen or other media.By css we can do many work ,it controls the Layouts of multiple web pages.
How Write CSS ?
CSS is so simple to write. Mainly it targets the the HTML elements by using the Html Class and Html Id. At first it targets the HTML elements then it writes the according its Styles. CSS we can write two ways, those are
i) In HTML Page
In this type Html we write the CSS code within the HTML code by using the <style> <style> Tag below the <head> </head> Tag in Html Page . If the html pages are so small or Don't have many CSS code then we write this type of in build CSS code. This types of CSS codes are do simple apply CSS in HTML page .
Example :
<style>
#example
{
color:red ;
font-size: 50px;
}
</style>
<body><h1 id="example">Hello World</h1><body>
Out Put : Hello World
ii) External CSS File
The other written type CSS is the External CSS File when the HTML file is so much bigger and the CSS code also so many then for the CSS coding we make a External CSS File and Link with the HTML file. The Link will attached between the <head> </head> Tag. The Link looks like
<link rel="stylesheet" type="text/css" href="example.css">
here rel is the relation with the documents and type means which type of documents is that ,here the CSS Text type documents and href is the location and name of the documents apply CSS in HTML page .Example :
Html code :
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="css/Log_in_Sign_Up.css">
</head>
<body><button id="btn_1">Click Me</button></body>
</html>
#btn_1
{
width:120px;
height: 40px;
background-color: green;
color:rgb(255, 255, 255);
border-radius: 5px;
border: white 1px solid;
font-size: large;
}
How Target HTML Elements for CSS ?
CSS work by targeting the HTML elements . At first the CSS targets one or more elements of HTML then Styles the element or elements. The Html can targets in two ways that's are
i) By Id
ii) By Class
i) By Id
In this type targeting we give every HTML elements a Unique Id
then we target the element in CSS using the Unique Id and then
we style the element.When write Css by the Id the we must have to write the hashtag (#) symbol before the Id, Like as Apply CSS in HTML page #example1{ }
Example:
html code :
<h1 id="head_1">Hello World</h1>
<p id="para_1">I am a student i am learning how to Terget the Html Elements in CSS
</p>
#head_1
{
color:green;
font-size: 40px;
}
#para_1{
color: red;
font-size: 20px;
}
Out Put :
Hello World
I am a student i am learning how to Terget the Html Elements in CSS
ii) By Class
In this type targeting we give every HTML elements a Unique class Id then we target the element in CSS using the Unique class Id and then we style the element.When write Css by the Id the we must have to write the Dot (.) symbol before the Id, Like asApply CSS in HTML page .example1{ }
Example:
html code :
<h1 class="head_1">Hello World</h1>
<p class="para_1">I am a student i am learning how to Terget the Html Elements in CSS
</p>
Css Code:
.head_1
{
color:green;
font-size: 40px;
}
.para_1{
color: red;
font-size: 20px;
}
Out Put :
Hello World
I am a student i am learning how to Terget the Html Elements in CSS
Out Put remains same by using Id or Class . This is so simple to write HTML with Css. Apply css in HTML is so simple, use css in your html page and make your page attractive.
Comments
Post a Comment
Comment Here