Skip to main content

CSS Colors and Font Sizes

Let us take small steps and then create complex pages.

The font sizes can be altered using the font-size attribute. The font-size attribute can be defined in various forms. The simplest is using pixels in short px.

Here is an example showcasing the font-size using px.


1:  <?xml version = "1.0" encoding="utf-8"?>   
2:  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">   
3:  <html xmlns = "http://www.w3.org/1999/xhtml">   
4:  <head>  
5:  <title>CSS Styling</title>  
6:  </head>  
7:  <body>  
8:  <p class="red">  
9:  Red  
10:  </p>  
11:  <p class="blue">  
12:  Blue  
13:  </p>  
14:  <p class="green">  
15:  Green  
16:  </p>  
17:  <style>  
18:  p.red  
19:  {  
20:  color:red;  
21:  font-size:20px;  
22:  }  
23:  p.blue  
24:  {  
25:  color:blue;  
26:  font-size:40px;  
27:  }  
28:  p.green  
29:  {  
30:  color:green;  
31:  font-size:60px;  
32:  }  
33:  </body>  
34:  </html>
Labels:

Comments

Post a Comment

Popular posts from this blog

JavaScript Variables-Storage & Declaration

Now we have understood how simple scripting in JavaScript is written. Let us take in some input from the user using the prompt(); function. prompt(); function: The prompt function prompts the user to input data into it by providing a textbox.You also get two buttons to input your reaction.Hence the interactivity. Now the website has asked the input data, now let it process it and act upon it. You have entered the data asked by the webpage prompt, now let us store it in a variable. STORING OF VARIABLES USING prompt(); Storing the data directly upon entering is done using the variable declaration along with the prompt input function separated by a "=" sign. var num = prompt("Enter a number"); DECLARING OF VARIABLES In JavaScript variables are declared using the "var" keyword. Any variable can be created using this keyword, irrespective of the type of data it stores viz.textual,numerical,symbolical,patterns. Sample variable...
Post a Comment
Read more

CSS Font Weight

In the earlier post, we looked at the font-style attribute. It gives some styles like italic,normal,oblique. But what about the bold. The bold style is defined under the font-weight attribute. The font weight attribute can be defined in many different ways, let us have a look at some basic ways like normal,bold,bolder,lighter. 1: <?xml version = "1.0" encoding="utf-8"?> 2: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 3: <html xmlns = "http://www.w3.org/1999/xhtml"> 4: <head> 5: <title>CSS Styling</title> 6: </head> 7: <body> 8: <p class="red"> 9: Red 10: </p> 11: <p class="blue"> 12: Blue 13: </p> 14: <p class="green"> 15: Green 16: </p> 17: <style> 18: p.red 19: { 20: color:red; 21: ...
Post a Comment
Read more

Simple XHTML 1.0 Strict program with 5 tags (html,head,title,body,p)

This program below shows the usage of basic 5 tags/XHTML elements html | head | title | body | p 1: <?xml version = "1.0" encoding="utf-8"?> 2: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 3: <html xmlns = "http://www.w3.org/1999/xhtml"> 4: <head> 5: <title> This is the title of the page</title> 6: </head> 7: <body> 8: <p> 9: Hello Web! 10: </p> 11: </body> 12: </html>
Post a Comment
Read more