Skip to main content

Advantages of using CSS

 

o Time Saver- Writing CSS code saves our time as we can do global changes easily .

o Page loads faster- We are not considered to write HTML tag attributes every time, if we are using CSS. So, less code means our page will load faster.

o Superior styles to HTML- Array of attributes in CSS are wider than HTML, that gives a better look to the page.

 oMaintenance becomes easy- If you want to make a change globally, just change the style and changes will be done in all the web pages.

o Multiple device permittance- CSS allow content to be optimize for various types of devices. It make the pages compatible to different devices and browsers.

 

o How we write code in CSS/Use-

External Style Sheet-   is used when we want to apply style to multiple pages. Each of the pages must link to style sheet by using <link> tag.

Internal Style Sheet- It should be used when we want to style single document. They are defined in head section.

Inline Style Sheet- means style sheets inside the HTML element. It has the highest priority, means it overrides the style attribute written inside the <head> tag.

CSS syntax- is divided into 3 parts i.e. selector, property and value. Selector is basically the HTML element/tag that we want to style and property is the attribute that we want to change.

And the property is given value. The property and value are surrounded by curly braces and separated by a colon (:).

      selector {property:value}

            body {color:yellow}

            h1 {font-family: “Arial”}

 

Different types of selectors-

 

The type selector-

 

h1{

        color #36CFFF;

}

The universal selector

*{

       color #000000;

}

The class selector

.black {

        color #000000;

}

The ID selector

#black {

          color #000000;

}

The child selector

body>p {

    color #000000;

}

The attribute selector

Input[type= “text”]{

    color #000000;

}

 

CSS links- Links can be styled using CSS. Here we have four different link stages -

Ø Link (unvisited )

Ø Visited

Ø Hover

Ø Active ( on which text user is clicking)

Above stages must come in this order as shown above.

<style type= “text/css”>

      a:link{color:blue}

      a:visited{color:green}

      a:hover{color:puple}

      a:active{color:red}

</style>

Comments

Popular posts from this blog

Other Tool in Web Development

JavaScript- JavaScript is a lightweight, interpreted, dynamic programming language that is used to make dynamic web pages and applications. It was came out in 1995 with the name LiveScript but afterwards its name is changed into JavaScript as it is integrated with Java. Bootstrap- It is the most popular framework for faster and easier web-development. The reason why we use bootstrap is that it is supported by almost all popular browsers, easily get started ( anyone who has knowledge of just HTML & CSS can start with it ), its responsive design, it also contains JavaScript plugins. AJAX ( Asynchronous JavaScript and XML )- It is a group of coherent client-side & server-side technologies by using which we can update a part of a webpage instead of reloading the whole webpage. We can take the examples of sites like YouTube, Gmail, Google-maps, tabs within Facebook etc. It increases the speed and usability of web pages and application. JQuery- It is JavaScript library whic

Tools used in Front-End development

  3.1     HTML ( The organizer )- Hyper Text Markup Language - to develop web-pages. The web-documents are being written in a language called HTML. Hence, we can say that HTML is a language used to create websites. These websites can then be accessed by anyone connected to the internet on various browsers such as chrome, Firefox, safari etc.      When we save an HTML file, extention .htm or .html is used. o Hyper Text - It is a way by which you move around on the web by just clicking on special text called hyperlinks. Hyper just means that you can go to anywhere on the internet by just clicking on links whenever you want. o Markup- is the method what happens to the text inside HTML tags. It is marked as a particular type of text (as italic text). Also visit ExploringBits .It is clear from the name itself that it is a markup language which means HTML is used to simply “Markup” a text document with tags that tell a browser how it should be structured it to display.

History and versions

  - HTML was created by Tim Berners Lee in 1991. He considered it to be an application of SGML (Standard Generalized Markup Language).”HTML 2.0” was published in 1995. “HTML 4.01” was published in 1999. Although “HTML 4.01” version is widely used yet currently “HTML 5” is used more commonly and it was published in 2014.    HTML was originally developed with the intention of evaluating the structure of document like headings, lists, paragraphs etc. to give the facility of sharing information between scholars.   But now, it is being   commonly used for format web-pages .   o How we write code in HTML/Use- HTML is specified as TAGS in an HTML document. HTML Tags- It is basically word or group of words enclosed between Angle Brackets as <html>. Usually, These Tags comes in pair as <h1>   &   </h1> , that are wrapped around some text. They are called Container tags. 1st tag in the pair is opening tag and the 2nd one is End/closing tag . On the other hand,