Learn the basics of Web making (2) typography labels

Tutorials | Getting Started | Web page

Related articles:

　　Learn the basics of Web Authoring Tutorial (1) Web authoring

　　Delimited labels on text

1. How to: Force break-through labels <BR>, force segmentation tags <P>

2. Label Commentary : We are writing articles, sometimes in a specific place will be forced to break (<BR>), or write a paragraph of the time will be segmented (<P>), make the same page, but also the need for break-through and segmentation of the function, So that the whole page looks messy.

3. Examples of Use :

Raw code	Show results
This is a break-through example <BR> see it? Web Teaching Network	This is an example of breaking the break Did you see it? Web Teaching Network
This is an example of a segmented <P> see it? Web Teaching Network	This is an example of a segmented Did you see it? Web Teaching Network

　　Text left, middle, right

1. How to use : To be honest, we have just learned that segmented tags <P> plus some simple attribute settings, you can put the entire text paragraph left, in place or right, as shown in the following table:

2. Label narration : The secret lies in "align= alignment position" just! " ALIGN is one of the attributes of the segmented label <P>, this property will often be seen in different tags, its function is to set the "Horizontal alignment position", its common setting value of three, that is, left (align= "Ieft"), in the Middle (align= "CENTER") , align= right.

3. Examples of Use :

Raw code	Show results
<p align= "Left" > Text </P>	Text on the left
<p align= "CENTER" > Text placement </P>	In text placement
<p align= "Right" > Text </P>	Text on the right

　　Placed in the label

1. Use method :<center> This is the </CENTER>

2. Label Commentary : This label is the most commonly used tags, in addition to text, for pictures, tables, any can be displayed on the Web page can be placed in the content!

3. Examples of Use :

Raw code	Show results
<CENTER> This is the middle </CENTER>	This is the middle

　　Indent Labels to the right

1. Use the method :<blockquote> text to indent </BLOCKQUOTE>

2. label narration : Use <BLOCKQUOTE></BLOCKQUOTE> this label can wrap up the text, all to the right indent. and add a group of labels, to the right indent a unit, add two sets of labels, to the right indent two units, and so on.

3. Examples of Use :

Raw code	Show results
<BLOCKQUOTE> Indent 1 Units </BLOCKQUOTE>	Indent 1 units
<BLOCKQUOTE><BLOCKQUOTE> indent 2 units </BLOCKQUOTE></BLOCKQUOTE>	Indent 2 units

Save the original format label　　

1. use method :< pre> text content </PRE>

2. Label commentary : Use <PRE></PRE> This tag can be wrapped in the text layout, format, displayed intact. One of the most useful labels.

3. Examples of Use :

Raw code	Show results
<PRE> Text Format </PRE>

　　Separator Line Label

1. How to use : Previous paragraph content <HR> the next paragraph of text content

2. Label Commentary : Using the <HR> tag, you can create a horizontal divider line. In addition, some of its attributes are described as follows:

3. Examples of Use :

General usage	No attributes have been added.
Raw code	General Separation <HR>
Show results	Normal divider Line

Color Properties	Usage:
Raw code	Orange Divider Line
Show results	Orange Separator Line

Width Property	Usage:
Raw code	Divider width 300px
Show results	Normal divider Line

Thickness properties	Usage:
Raw code	Thickness of 10 Divider < HR size= "ten" >
Show results	Dividing line with thickness 10

Location Properties	Usage:
Raw code	On the right divider line
Show results	On the right divider line

Shadow Properties	Usage:
Raw code	Solid Separator Line (no shadow)
Show results	Solid Separator Line (no shadow)