place your ad here

HTML Styles and Formatting || Bcis Notes

HTML Styles and Formatting

HTML Styles and Formatting

HTML Styles:

Styles in HTML are basically rules that describe how a document will be presented in a browser. Style information can be either attached as a separate document or embedded in the HTML document.

1. Background Color
The CSS background-color property defines the background color for an HTML element. This example sets the background color for a page to grey:

CODE:

Background Color

 

Result:

Result

 

2. Text Color:
The CSS color property defines the text color for an HTML element:

CODE:

Text Color

 

Result:

Result

 

3. Fonts:

The CSS font-family property defines the font to be used for an HTML element. To define the fonts of words. For example, Verdana, italics, classic, courier, etc.

CODE:

Fonts

 

Result:

TEXTRES

4.Text Size:
The CSS font-size property defines the text size for an HTML element:

CODE:

Text Size

 

Result:sizeres

 

5. Text Alignment:
The CSS text-align property defines the horizontal text alignment for an HTML element:

CODE:

Text Alignment

 

Result:

ALIRE

HTML Formatting:

HTML Formatting is a process of formatting text for a better look and feel. There are many formatting tags in HTML. These tags are used to make text bold, italicized, or underlined. There are almost 14 options available that how text appears in HTML and XHTML.

Formatting elements were designed to display special types of text:

–   <b> –   Bold text
–  <strong> –   Important text
–  <i> –   Italic text
–  <em> –   Emphasized text
–  <mark> –   Marked text
–  <small> –   Small text
–  <del> –   Deleted text
–  <ins> –   Inserted text
–  <sub> –  Subscript text
–  <sup> –  Superscript text

 

1.Bold Text :
Anything that appears within <b>…</b> element is displayed in bold as shown below

CODE:
Bold Text

 

Result:

BOLD

 

2. Important text:

The HTML <strong> element defines strong text, with added semantic “strong” importance.

CODE:

STRONG

Result:

STRONH

3. Italic Text
The HTML <i> element is a physical element, which displays the enclosed content in italic font, without any added importance. If you write anything within <i>…………</i> element, it is shown in italic letters.

CODE:

ITALICH

 

Result:

ITALICS

4. Emphasized text:

The HTML <em> tag is a logical element, which will display the enclosed content in italic font, with added semantics importance.

CODE:

EMPHASIZEDH

 

Result:

EMPHASIZED

5. HTML Marked formatting:

It is also possible to highlight a text in HTML using the <mark> tag. It has an opening tag <mark> and a closing tag </mark>.

CODE:

MARK

 

Result:

MARKH

6. Making text smaller :

The <small> element is used to make the text smaller. The text that needs to be displayed smaller should be written inside <small> and </small> tag.

CODE:

SMALLH

 

Result:

SMALL

7. Striking through the text :

The <del> element is used to strike through the text marking the part as deleted. It also has an opening and a closing tag.

CODE:

del

 

Result:

delh

8. Adding a text: 
The <ins> element is used to underline a text marking the part as inserted or added. It also has an opening and a closing tag

CODE:

INSERTEDH

 

Result:

INSERTED

9. Subscripted :

The content of a <sub>…</sub> element is written in subscript; the font size used is the same as the characters surrounding it but is displayed half a character’s height beneath the other characters.

CODE:

SUBSCRIPTH

Result:

SUBSCRIPT

10. Superscripted :

The content of a <sup>…</sup> element is written in superscript; the font size used is the same size as the characters surrounding it but is displayed half a character’s height above the other characters.

CODE:

SUPCRIPTED

Result:SUPRICPTED

If you liked our content HTML Styles and Formatting, then please don’t forget to check our other content
HTML Comments and Colors.

advertise here
webtrickshome