⚝ ATP Web Creation


CSS Tutorials

 

What is CSS? | Use of CSS | Role of CSS in Web Design

CSS Introduction | What is CSS? | Use of CSS | Role of CSS in Web Design ATP Web Creation is a best place to develop your websites and various types of applications. We offer design and application development services for every stage of your mobile project.

CSS Introduction

Topics Covered: What is CSS? | Use of CSS | Role of CSS in Web Design

What is CSS? 

CSS is a programming language for styling the web application documents. CSS stands for Cascading Style Sheets. CSS is widely used in website elements such as layout, color, text and other layout elements design.   

CSS design does not only fulfill the colour, shape, beauty and desired design but also It makes your website responsive for all media. If you learn css you can able to give shape, the size of text, spacing between html elements and different color to the laid elements. You have to learm some basic steps of writing css codes. Lets learn css coding.

Sample format of CSS Style for HTML Elements. 

<!DOCTYPE html>
<html lang="en">
<head>
<title>Page Title</title>

<meta name="" content=""/>

<style type="text/css">

H1{

font-size:24px;

line-height:30px;

font-weight:bold;

padding:10px 20px;

}

div {

width:200px;

height:400px;

padding:10px;

border:1px solid #000000;

background:#C0C0C0;

}

</style>
</head>
<body>

<div>
<h1>Heading 1</h1>
<p>My first paragraph.</p>

<div>
</body>
</html>

You can see the inbuilt css style coding in html document. You should learn about HTML tag which have to style and you can also create it by class name or id name.

Example of Class Name CSS style: Class Name Start with (.) dot; 

<style type="text/css">

.my-first-class{

font-size:24px;

line-height:30px;

font-weight:bold;

padding:10px 20px;

}

.my-div-container{

width:200px;

height:400px;

padding:10px;

border:1px solid #000000;

background:#C0C0C0;

}

</style>

Example of id Name CSS style: Id Name Start with (#) hash; 

<style type="text/css">

.my-first-class{

font-size:24px;

line-height:30px;

font-weight:bold;

padding:10px 20px;

}

.my-div-container{

width:200px;

height:400px;

padding:10px;

border:1px solid #000000;

background:#C0C0C0;

}

</style>

In learning CSS Style major thing is to know about it css properties and it's values for beginners.

Example: Look the css declaration-

h2 {width : 400px; font-size : 26px; margin: 10px 20px;}

Here, h2 is selector 

width, font-size, margin are properties and 400px, 26px and 10px 20px are properties value respectively. 

Uses of CSS in html:

The question rises here that - Why we use css?

CSS is used for following functionality in web design or html:

  • We use css for easy maintenance and compatibility.
  • Perform on wide range of devices. 
  • It provides responsive layout to webpages and gives attractive looks. 
  • faster webpages loading.
  • Any web alements or selector can be styled using css. 
  • Manageing dyanamic web templates. 
  • Avaibility of open source css library like bootstrap.

These are the above reason that why we use css in html. CSS Style sheet easy and faster loading in document in any browser. At last answer has been come up with a solution for question - what is the use of css in html? 

 

Your Comment