STYLING CSS LINK AND CSS LIST

Tweet

As we discussed before in html tutorial that the links are the soul of the webpage. WebPages are containing of links without links webpage is nothing. Links allow us to jump from one page to another page or on same page. Some times we create very large document in order to help the visitor we make links on the same page. Today our topic styling links in css. What is the links? Links are the way by which you can jump from one page to another page. STYLING LINKS Link should be change by its surrounding such its background-color, color should be change from surrounding text. There are four types of links property given below; a:link unvisited link. a:visited visited link a:hover mouse over a link. a:active user has clicked link. Note The sequence is important you have to write first link then visited then hover and finally active. You can add the text decoration, background color, text size, font style, font weight etc to the links. a:link this is unvisited link a:link{ color:red; } a:visited this is the visited link a:visited{ color:green; } a:hover when users take mouse over link. a:hover{ color:blue; } a:active when users clicked the link. a:active{ color:yellow; } CSS STYLING LISTS. Many times we need lists . in html we make lists in css we design them you can add numbering, dot, circle and also you can add images to the lists lets discusse about the styling lists. There are two types of lists in html unordered list or ordered lists. UNORDERED LISTS; Unordered lists contain of bullets. ADDING CIRCLE; ul {list-style-type:circle;} ADDING SQUARE; ul {list-style-type:square.} How to add the image as list item marker? Yes you can add the image to the list item marker. ul{ list-style-type:url(bullet.png) } FINAL WORDS; Friend now you can edit the list item according to your wish. Keep working and remember in your prayers and don’t forget to share our post with your friend.THANKS

As we discussed before in html tutorial that the links are the soul of the webpage.

WebPages are containing of links without links webpage is nothing. Links allow us to jump from one page to another page or on same page. Some times we create very large document in order to help the visitor we make links on the same page. Today our topic styling links in css.

What is the links?

Links are the way by which you can jump from one page to another page.

STYLING LINKS

Link should be change by its surrounding such its background-color, color should be change from surrounding text.

There are four types of links property given below;

a:link unvisited link.

a:visited visited link

a:hover mouse over a link.

a:active user has clicked link.

Note

The sequence is important you have to write first link then visited then hover and finally active. You can add the text decoration, background color, text size, font style, font weight etc to the links.

a:link

this is unvisited link

a:link{

color:red;

}

a:visited

this is the visited link

a:visited{

color:green;

}

a:hover

when users take mouse over link.

a:hover{

color:blue;

}

a:active

when users clicked the link.

a:active{

color:yellow;

}

CSS STYLING LISTS.

Many times we need lists . in html we make lists in css we design them you can add numbering, dot, circle and also you can add images to the lists lets discusse about the styling lists. There are two types of lists in html unordered list or ordered lists.

UNORDERED LISTS;

Unordered lists contain of bullets.

ADDING CIRCLE;

ul {list-style-type:circle;}

ADDING SQUARE;

ul {list-style-type:square.}

How to add the image as list item marker?

Yes you can add the image to the list item marker.

ul{

list-style-type:url(bullet.png)

}

FINAL WORDS;

Friend now you can edit the list item according to your wish. Keep working and remember in your prayers and don’t forget to share our post with your friend.THANKS