Now we will be Adding Multiple CSS Styles to the ‘h1’ element in our webpage.
We will enlarge the text and centre the text with the ‘font-size’ attribute and the ‘text-align’ attribute.

This is our newly styled ‘h1’ element as it appears in the webpage.

Adding multiple css styles. Main heading centred and red.
Main heading styled with a ‘text-align: centre;’ and ‘color: red;’.

The syntax for html5 and css3 must be closely observed. Code must be spelt exactly as it appears in the examples. For instance the ‘color‘ attribute cannot be spelt ‘colour’ or it will not work. Each style rule must follow the correct spelling for it to work. Careful to include the hyphens for ‘font-size‘ and ‘text-align‘.

In the next example we will add a ‘letter-spacing’ attribute to the ‘h1’ element. We also add a ‘font-family‘ attribute to the ‘h1’ element. The ‘font-family’ attribute will is used in CSS to specify the type face of elements. The browser will by default specify a ‘serif’ typeface however we want a ‘sans-serif’ typeface. In particular Helvetica’.

Adding multiple css styles. Letter spacing and helvetica typeface added to a heading.
Main heading with Helvetica typeface and letter spacing.

CSS3 logo. Adding  Multiple CSS Styles

Share!Share on FacebookShare on Google+Tweet about this on TwitterShare on LinkedInPin on PinterestShare on RedditShare on Tumblr

Leave a Reply

Your email address will not be published. Required fields are marked *