CSS Header

✦ CSS Introduction ✦

When a website is opened in a web browser, the design in which the website is displayed after opening is executed with CSS language. The color, size, design of the font written in the web page, size of images, margin between elements, etc. are controlled with the help of CSS language. The full form of CSS is Cascading Style Sheets. Before the advent of CSS, web developers had to do a lot of work to design a webpage. As a way to avoid such extra effort, Hakon Wium Lie offered to create a new programming language via a mail to W3C. Through this mail he talked about how to easily manage the design of a webpage created with the help of HTML by using CSS language.

Hakon William Lee demonstrated through his Arena web browser how to use a different KASS language for the design of a webpage and what the results would be after using it. W3C tells Haakon Wiam Lee We welcome requests for a new programming language to simplify the design of HTML webpages. Haakon Wiam Lee then started working on the CSS language with Tim Berners-Lee and Robert Caillieu. Ultimately the first version of CSS was launched in 1996. After this, the CSS team started taking feedback from people about the CSS language and new versions started coming with necessary changes.

Although CSS is also a programming language, it is unable to work independently because it forms its existence together with HTML. CSS language works together with HTML and there are mainly three ways to incorporate CSS language into HTML.
1. External CSS
2. Internal CSS
3. In-line CSS

✦ Syntax of CSS ✦

selector { property : value ;

In HTML, internal CSS is used with the help of style tags and style attributes and external CSS files are used with the help of link tags. The structure of CSS language is very simple in which its design is edited by targeting the HTML element. Any HTML element is targeted in CSS in 4 ways which include tag name, tag ID, tag class name and the entire HTML file.

In CSS, to target an HTML element by its tag name, the tag name itself is used directly, while to target a tag by its ID, its ID is prefixed with "#" . Similarly, to target an HTML element by its class name, a "." is used before the class name. If the effect of a style is to be applied to the entire webpage, then (*) is used in CSS.

In short, you target an HTML element or tag using a selector and design the content of that element or tag & Next, use the CSS properties to choose what changes you want to make to it. First let's take an example of Internal CSS

✤ Internal CSS Example ✤
<!DOCTYPE html>
<html>
<head>
<title>Web Page Title</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<style>
body{
background-color:Yellow;
}

h1{
color:Red;
text-align:center;
}

p{
line-height:1.5;
text-align:right;
}
</style>

</head>
<body>

<h1>Normal CSS Style</h1>
<p>
I have also learned how to create a simple website now that I have the help of Orexn World. I am studying CSS right now. i hope i learn it
</p>

</body>
</html>
✩ Result of above Code ✩
Normal CSS Style
I have also learned how to create a simple website now that I have the help of Orexn World. I am studying CSS right now. i hope i learn it

✦ Detailed Discussion ✦

In an HTML file, Internal CSS codes are usually written inside the head tag, although they are not mandatory but are required as a rule. Internal CSS in HTML files is used with the help of tags. As per the above example we have changed the background color of the main part of the web page with the help of CSS. Along with this, the text align of the heading tag and the text align and line height of the <p></p> tag have also been changed.

X Help by donating Donet
Dark Mode Donet