01. Introduction to CSS

4 minutes
Share the link to this page
Copied
  Completed
You need to have access to the item to view this lesson.
This is a free item
$0.00
د.إ0.00
Kz0.00
ARS$0.00
A$0.00
৳0.00
Лв0.00
Bs0.00
B$0.00
P0.00
CA$0.00
CHF 0.00
CLP$0.00
CN¥0.00
COP$0.00
₡0.00
Kč0.00
DKK kr0.00
RD$0.00
DA0.00
E£0.00
ብር0.00
€0.00
FJ$0.00
£0.00
Q0.00
GY$0.00
HK$0.00
L0.00
Ft0.00
₪0.00
₹0.00
ISK kr0.00
¥0.00
KSh0.00
₩0.00
DH0.00
L0.00
ден0.00
MOP$0.00
MX$0.00
RM0.00
N$0.00
₦0.00
C$0.00
NOK kr0.00
रु0.00
NZ$0.00
S/0.00
K0.00
₱0.00
₨0.00
zł0.00
₲0.00
L0.00
QR0.00
SAR0.00
SEK kr0.00
S$0.00
฿0.00
₺0.00
$U0.00
R0.00
ZK0.00
Already have an account? Log In

Transcript

Second, let us get an introduction to CSS, CSS, cascading style sheet. css takes care of the look and feel of your webpage. with CSS. You can change the background, the font style, the font size, that takes color, the letter spacing, the paragraph spacing, and many more. So CSS helps to add styling to your web page. css has got its own advantages.

Now, let us discuss about the advantages of content and style separation. Now you know already that HTML is going to take care of the content and the structure of a web page. When you want to add styling. That is if you want to give a background color for your paragraph, or if you want to give a nice border for your table are these can be done with the help of It says styling is done separately in CSS, and the content is delivered by HTML. So content and style separation is done with the help of CSS. Save time.

Assume that you are having multiple paragraph tags in your HTML page are across multiple HTML pages. If you want to add a background color to your paragraph, you can write it in one single CSS file. And it will be incorporated by all the paragraphs are all the P tags across multiple CSS files. So it says the time you don't have to provide styling for individual paragraph tags. Nice easy maintenance. If you want to change the size of few elements in HTML page, you can do it in a CSS file.

By making changes in a single CSS file. All the similar elements in HTML page will be updated automatically. So Consistency is maintained across the pages. Next, superior style to HTML. The HTML provides few presentation capabilities. css provides much more than that.

You can add opacity to images, you can add rounded corners to images, add gradients, do animation, and provide a nice margin and border. All these are possible with the help of CSS. Next, multi device compatibility with CSS your HTML document can be optimized and rendered in different types of devices. That is, your HTML web page can be rendered in a desktop in a laptop in a mobile device, or an iPhone or other kind of device. So these are the advantages of using CSS. Next, let us discuss the style and structure of CSS, your CSS and HTML page.

You need to follow the rule of CSS. The syntax of CSS goes like this selector, curly brace property colon value and ending it with curly brace. What is the selector It is nothing but the HTML element for which you want to apply the sizing, it can be a paragraph tab or h1 or table or do on any other HTML element. Next property, which property you want to apply to the HTML element, whether you want to change the background color or the font color or the font size or the text spacing, so these kinds of information can be given in property and the value is of course the corresponding value. I have given an example over here, I want to change the styling of h1 tag. So I have given h1 so h1 is my selector, curly brace, color colon blue.

I want to change the text color. So now My headshot will be changed from black color to blue color. What about the font style, it will be in italic format. Of course, you know that you can use it to convert it into atomic, but you have to do it for all h1 tags in HTML page. But if you are using this automatically all the h1 tags in the HTML page will be rendered in blue color in an italicized manner. So this is about the structure of the syntax of CSS.

So that's all about an introduction to CSS. Basically, CSS is used for giving a style to your web page. In the next session, let us learn about the different types of CSS. Thank you.

Sign Up

Share

Share with friends, get 20% off
Invite your friends to LearnDesk learning marketplace. For each purchase they make, you get 20% off (upto $10) on your next purchase.