What is CSS? Cascading StyleSheet With Full Details and Examples
CSS stands for Cascading StyleSheet, and it is a language which uses with HTML. it gives style to HTML tag. we can’t design website or web pages only with HTML but besides that, we have CSS which is the most important and popular language. CSS gives style or design your page in the way you want, you can style your content or section in any way like for example we have a building a new building without style and design which is simple so now we want to give style so we use a different material that it looks beautiful, so web pages is the same we build web page with HTML and we give style with Cascading StyleSheet.
Cascading StyleSheet is the first technology after HTML, you need to learn CSS after you learned HTML because HTML is used to define the structure of your content and CSS is used to style your content. for example, in we have some HTML tag like h1, p, font, img and many more so what we will do that we will give style to tag with help of CSS, the Cascading StyleSheet give style to your HTML tag.
What is HTML5? With full Definition, Tags, and Example 5 Best HTML Editor in 2019
How many usage CSS have?
In Cascading StyleSheet we have 3 usages like.
- Inline CSS
- Internal CSS
- External CSS
1. Inline StyleSheet:
An inline style may be used to apply a unique style for a single element. for example.
<h1 style=”color:green”>Hello Viewer</h1>
look to the bold text it is an inline style we have an h1 tag and now let’s give a green color to the tag first write style then give the equal = sign and start double colon or single colon and then give property name then semicolon and then give property value and close double colon or single colon. this is the way to use inline style and give style to your content.
2. Internal StyleSheet:
An internal style sheet may be used if one single page has a unique style.
Internal styles are defined within the <style> element, inside the <head> section of an HTML page:
for example:
3. External StyleSheet:
with an external stylesheet, you can change your entire website design. with only including one file in your project, every project has one CSS file that every coding of CSS is code in that file. you can simply give style to your content by using Cascading StyleSheet. you have to give <link> to your CSS file inside <head> tag like.
<head>
<link rel=”stylesheet” type=”text/css” href=”style.css”>
</head>
an external StyleSheet can be written in any editor . but it won’t contain html extension, the StyleSheet must be saved a .css extension.
here are some coding of the style.css file
margin-left: 20 px;). The correct way is: margin-left: 20px;StyleSheet Property and Value:
here are some stylesheet property name and property value that given as an example. each property has there own value it is not interchangeable.
| background-color | it will give a background color to the content |
| color | it will give color to the content |
| font-size | it will increase and decrease the text size |
| margin | it will give a position to the content |
| padding | it will give space to the content from its parent |
| font-family | it will give font style to the content |
| width | it will give width to the content |
| height | it will give height to the content |
| border | it will give a border to the content |
| top, left, right, bottom | these are used to set a position of the content |