CSS PROGRAMMING LANGAUGE disadvantages CSS full form is cascade style sheets , which we call it says about how you should display the HTML elements on the screen. CSS tells us the style of the webpage let us take a simple example, if we build a home first we lay out the design that is known as the HTML language. Where the CSS means layout which means giving instructions on how the furniture should be nothing but the CSS. For example if we take PayPal we can see that the background color blue says the CSS background-color property. Netflix is also the best way of saying CSS property, but if we remove it will be a normal webpage but with the red color and the black plus symbols it looks like the best webpage. Versions of CSS There are different versions available now in case it is developed by Wium we have three versions that are css1, css2, and css3. Currently we are using this css3 version this is the best version fo
WHAT IS CSS
 |
| Css |
- CSS is Cascading style sheets which is a programming language, that is used to make the website more presentable to the audience.
- To make the website good we should apply all these CSS styles to it so that it could reach a greater audience.
- In CSS we can add margins, and colors to the text, height, width, and tables, these are some of the things we can do through CSS.
- There are different software used for CSS Bootstrap, Visual Studio Code, and Notepad++ in each of these there are different ways of saving the code.
- Easily if I say that difference between HTML and CSS is that, HTML makes the outer appearance of the home, CSS tells which color we need to add or what furniture is what.
BENEFITS USING CSS
- Helps the page load fast:- HTML takes more time to load the test whereas the css takes less time less time because the code will be in less total.
- Maintain:- HTML if you want to make any setting you need to change the whole code whereas in CSS just change code at a particular place.
- Combination of styles:- Provides a number of styles to enhance your webpage.
- Adjustment of devices- Is a combination of HTML to give better results in mobiles, and tabs.
- Position changing:- CSS has the advantage of changing the position of the elements in the code.
TYPES OF CSS
- Inline CSS:- Inline CSS is the style in which we apply it to a particular element we can apply this style by using <style>.
<html>
<head>
<body>
<h2 style="color:green";>this is</h2>
<p style="color:red";>hi</p>
- As we can see in the above code we are applying the inline to the h2 tag, which appears this be green in color.
- Internal CSS:- Internal CSS style is that if you want to apply it to a particular document, the style then you can use the internal CSS style.
<head>
<style>
body{background-color:violet;}
h1{color:red}
</style>
</head>
</body>
- Applies violet colour to the background red the h1 tag compulsory close the style tag.
- External CSS:- This is a type of style in which we want to apply it for multiple sheets this is similar to the other types of styles.
<html>
<head>
<link rel="stylesheet" source="style.css">
</head>
<body>
<h1>laptop</h1>
</body>
</html>
COMMENTS
- Comments are the part of the code we generally write to explain the user the things more in detail
These are which ignored by the people there are several ways through we can do comments in CSS.
- Single line commenting:- it is a type of commenting in which we comment to the particular we do it by /* and end it by */.
<html>
<head>
<style>
p{
color: blue;
}
</style>
<body>
/*<h1>this is a bag</h1>*/
</body>
</html>
- Multiline comment:- Commenting through a comment in multiple lines through the code we do it through /* and */.
<html>
<head>
<style>
/*h2{
color: red;
}*/
<body>
<h2>clock</h2>
</body>
</html>
- If you want to explain the code in a clear manner what this line of code is you use the comments.
- Avoid adding too many comments this may lead to a lower level of output.
BORDERS IN CSS
- Borders are one of the most important features of the CSS programming language, adding borders to the elements is one of the main objectives as it gives the audience a chance to notice it.
- In order to apply borders we have a specific syntax that is border-style this is the major part but under it, we have further classification.
- Want the dark border then use a border-style: solid; want a dotted line then replace solid with dotted.
<html>
<head>
<style>
h1.solid{border-style:solid;}
h2.ridge{border-style:ridge;}
</style>
<body>
<h1 class="solid">this is a new line</h2>
<h2 class="ridge">u</h2>
</body>
</html>
- We can change the width of the borders as we change the color border-width:6px;
<html>
<head>
<style>
h1.box{
border-width:9px;
}
</style>
<body>
<h1 class="box">this is the 9 pix</h2>
</body>
</html>
Comments
Post a Comment