Study Notes Chapter 4 Design webpage text, Study Notes Chapter 4
Key points:
1. Familiar with HTML 4 formatted text labels;
2. Master the text labels added to HTML5;
3. correctly select tags to design webpage text information.
4.1 Use text label 4.1.1 Title text
<H1> ~ <H6> defines the title.
<H1> defines the largest title, indicating the most important information.
<H1> only once, and 4.1.2 paragraph text
<P> the label is used to define the paragraph text. A gap is created before and after the text.
4.1.3 reference text
<Q> when the tag definition is short, quotation marks are added around the referenced content. <blockquote> when the tag definition is block reference, the included text is separated from the regular text, indent on the left and right.
A piece of text cannot be directly placed in <blockquote> and should be contained in a block element.
<Q> and <blockquote> both contain a cite attribute and define the reference source. <Cite> tags also provide the ability to automatically extract bibliography from documents.
4.1.4 emphasized text
<Em> it is used to emphasize text. The text contained in the statement is displayed in italic. <strong> the emphasis is higher, and the text contained in the statement is displayed in bold.
4.1.5 format text
<B> defines bold text, which is similar to the default Effect of <strong>.
<I> defines italic text, which is similar to the default Effect of <em>.
<Big> defines the large font size, which can be nested for use until the upper limit is 7.
<Small> defines the small font.
<Sup> defines the upper-level text.
<Sub> define subscript text.
4.1.6 output text
<Code> indicates the font of the code, that is, the source code is displayed.
<Pre> indicates the source code in a predefined format, with spaces in the source code retained.
<Tt> Printer Font.
<Kbd> keyboard font.
<Dfn> defined term.
<Var> variable font.
<Samp> sample code.
4.1.7 abbreviations
<Abbr> short name or abbreviation.
<Acronym> defines the abbreviation. (Not supported by HTML5)
4.1.8 insert and delete text
<Ins> defines the text inserted into the document.
<Del> defines the deleted text in the document.
4.1.9 text direction
<Bdo> you can change the direction of a text stream, including the dir attribute. The optional values include ltr (from left to right) and rtl (from right to left ).
For example, <bdo dir = "rtl"> moonlight in front of the bed is suspected of being frost on the ground. <Bdo>
4.2 HTML5 new text tag 4.2.1 text tag
<Mark> defines text with a mark, indicating the information to be highlighted or highlighted on the page.
4.2.2 progress information
<Progress> identifies the task progress. It can be uncertain, indicating that the progress is in progress. It can also be expressed by a number ranging from 0 to a number (such as 100.
The progress element contains two attributes: max and value, indicating the current progress.
Example: <p> 100 progress: <progress id = "progress" max = ""> <span> 0 </span >%</progress> </p>
4.2.3 scale information
<Meter> defines the scalar and progress within a known range or number. Such as disk usage and query result relevance.
The meter element contains seven attributes:
- The actual value identified by the value in the element. The default value is 0.
- Min: specifies the minimum value that can be used when the specified range is set. The default value is 0.
- Max: the maximum value that can be used when the specified range is set. The default value is 1.
- The maximum value of the low setting range. If low is smaller than min, the min value is regarded as the low value.
- The upper limit of the high setting range. If the value is greater than max, the value of max is regarded as the value of high.
- Optimum is the best value.
- Form sets one or more forms to which the meter element belongs.
Example: <meter value = "3" min = "0" max = "10"> three in ten minutes </meter>
4.2.4 time information
<Time> defines the time (in 24-hour format) or date of the Gregorian calendar. The time and time zone offset are optional.
Example 1: <time datetime = "2017-11-17T20: 00 + 9: 00"> my birthday at AM in the United States </time>
The <time> element has two attributes:
Datetime defines the date and time;
Pubdate defines the date and time when the document is published in the time element.
4.2.5 contact text
<Address> defines the contact information of the author and owner of a document or article. The text is usually italic.
4.2.6 isolate text
<Bdi> you can set a text segment to remove it from the text direction of the parent element.
4.2.7 line break
<Wbr> defines where to add line breaks in the text.
Example: <p> the old address of this site is https: <wbr> // <wbr> www. old_site.com/. The new address is https: <wbr> // <wbr> www. new_site.com /. <P>
4.2.8 text comments
<Ruby> define Chinese phonetic symbols or characters. <Ruby> must be used together with <rt> or <rp>.
- <Rt> define the interpretation or pronunciation of characters;
- <Rp> defines that the browser does not support the display of ruby elements.
Example: <ruby>
Less <rt> shao </rt> strong <rt> zhuang </rt> NO <rt> bu </rt> nu </rt> force <rt> li </rt>
</Ruby>