CSS
At present, the structure of the web page is created with HTML, the design is created by CSS, and the text is stored in the database. Therefore, CSS's role is very important to make the page attractive as well as to make it more useful. CSS can be added in three ways on the page created by HTML.
1. External Style Sheet
2. Internal Style Sheet
3. Inline Style Sheet
External Style Seat
In this process, HTML files and CSS style seats are placed in two separate seats. And in the following way the link between HTML's <head> </ head> tag is created.
<Head>
<Link rel = "stylesheet" type = "text / css" href = "http://tutohost.com/bangla/style.css">
</ Head>
Internal Style Seat
In this method HTML and CSS styles are placed in the <head> </ head> tag in the same seat. This is why the <style> </ style> tag is used in the following way.
<Head>
<Style type = "text / css">
Body {background-color: red;}
P {margin-left: 20px;
Font-weight: bold;
Color: # 006; }
</ Style>
</ Head>
Inline Style Seat
In this process, CSS style is included in each HTML tag. For this reason, style attributes are used in the following ways.
<P style = "margin-left: 120px; font-weight: bold; color: # 060;">
Example Programs
<Html>
<Head>
<Title> www.tutohost.com </ title>
<Link rel = "stylesheet" type = "text / css" href = "http://tutohost.com/bangla/style.css">
<Style>
Body {background: green; Font-family: verdana; Font-size: 15px;}
H3 {font-size: 25px; Font-family: Tahoma; Color: red;}
</ Style>
</ Head>
<Body>
This is a paragraph
<br />
<H3>
Bangladesh is a beautiful country
</ H3>
<P style = "color: # 600">
This is a paragraph This is a paragraph. <br />
This is a paragraph This is a paragraph. <br />
This is a paragraph This is a paragraph. <br />
This is a paragraph This is a paragraph. <br />
This is a paragraph This is a paragraph. <br />
</ P>
</ Body>
</ Html>
Open a Notepad and by typing the code above and clicking Save as from the file menu, save as file name: index.html, Save as type: All files, open the index.html file with Mozilla Firefox and look like the image shown below.
At present, the structure of the web page is created with HTML, the design is created by CSS, and the text is stored in the database. Therefore, CSS's role is very important to make the page attractive as well as to make it more useful. CSS can be added in three ways on the page created by HTML.
1. External Style Sheet
2. Internal Style Sheet
3. Inline Style Sheet
External Style Seat
In this process, HTML files and CSS style seats are placed in two separate seats. And in the following way the link between HTML's <head> </ head> tag is created.
<Head>
<Link rel = "stylesheet" type = "text / css" href = "http://tutohost.com/bangla/style.css">
</ Head>
Internal Style Seat
In this method HTML and CSS styles are placed in the <head> </ head> tag in the same seat. This is why the <style> </ style> tag is used in the following way.
<Head>
<Style type = "text / css">
Body {background-color: red;}
P {margin-left: 20px;
Font-weight: bold;
Color: # 006; }
</ Style>
</ Head>
Inline Style Seat
In this process, CSS style is included in each HTML tag. For this reason, style attributes are used in the following ways.
<P style = "margin-left: 120px; font-weight: bold; color: # 060;">
Example Programs
<Html>
<Head>
<Title> www.tutohost.com </ title>
<Link rel = "stylesheet" type = "text / css" href = "http://tutohost.com/bangla/style.css">
<Style>
Body {background: green; Font-family: verdana; Font-size: 15px;}
H3 {font-size: 25px; Font-family: Tahoma; Color: red;}
</ Style>
</ Head>
<Body>
This is a paragraph
<br />
<H3>
Bangladesh is a beautiful country
</ H3>
<P style = "color: # 600">
This is a paragraph This is a paragraph. <br />
This is a paragraph This is a paragraph. <br />
This is a paragraph This is a paragraph. <br />
This is a paragraph This is a paragraph. <br />
This is a paragraph This is a paragraph. <br />
</ P>
</ Body>
</ Html>
Open a Notepad and by typing the code above and clicking Save as from the file menu, save as file name: index.html, Save as type: All files, open the index.html file with Mozilla Firefox and look like the image shown below.
No comments:
Post a Comment