Decorating text

text-align

It decides the way, I wanna show my text of any particular part of the document. Lets see with an example

		
		
text-decoration

It determines whether a particular text is to be underlined or not.We use this to emphasize some part of the line or text.

		
text-transform

It is used to change the case of the text. Many a times, we wish user to input only capital letters, so , instead of imposing this burden on them , we can change the text-transform and user need not worry about the case then.

		
Fonts

Font decides a lot about the visiblity of a content or text. We use different type of fonts according to the theme of the webpage. Font of a text is decided by font-family. We prefer to give a number of fonts acccording to the preference sequence. This is to ensure that our text is not shown by the default font of the browser in case if the provided font-family is not supported by that browser.

	
font-size, font-weight, font-style

As the name of the above attributes suggest, they are used to set the size of the font used, their weight(bold or normal) and style(italic or not) in a particular part of webpage(id people).


Margin and Padding

Margin and padding are two properties ,in which beginners are often confused. Lets us explain it through an example. Suppose, we have an elastic bag containing some breakable elements like glass. Now for keeping them safe, we wish to maintain some space between container and bag wall(padding) and also we will keep all other things outside the bag at some safe distance(margin). So, space between inner wall and content is defined by padding and space between outer wall and other document elements is decided by margin. Hope i am making some sense.

So, as discussed we can make our page elements at proper distance using margin attribute and keep all the contents of a particular div or container at a proper space from border by padding.


Border

Many a times we require a border to distinguish the content of a div with others. This can be done by setting border using simple css attributes. Lets see some examples


This will wrap all of our paragraphs present on the webpage with a dashed border of width 3 px and red color.

Now we have learnt how to apply a basic CSS to our contents, but we always need to be specific in applying designs. We never want lets say that all the paragraphs of our webpage gets bordered , so we need to select out some out of the total page and apply the attributes to them.

Member Login

Member Login




Not a Member? Sign Up!




Login to comment

Be the first to comment on this topic







  


<<< Wanna review

Continue >>>