HTML tags

HTML tags

Label format:

<div id="gan">dudu</div>< tag attribute =" attribute Value "> Content </ tag >Copy the code

Element: Refers to all code from the start tag to the end tag.

The title

<h1></h1>
<h2></h2>
<h3></h3>.Copy the code

There are six levels of headings

The paragraph

<p></p>
Copy the code

box

<div></div>
Copy the code

The common name of the class

Escape character

<p>Escape character:&gt; &lt; &nbsp; &copy;</p>
Copy the code

The list of

<! -- Unordered list -->
<ul type="circle">
    <li>dudu</li>
    <li>gangan</li>
</ul>

<! -- Ordered list -->
<ol type="A" start="2" reversed>
    <li>dudu</li>
    <li>gangan</li>
    <li>gangbeng</li>
</ol>
<! -- Custom -->
<dl>
    <dt>A</dt>
    <dd>dudu</dd>

    <dt>B</dt>
    <dd>gangbeng</dd>

    <dt>C</dt>
    <dd>gangan</dd>
</dl>
Copy the code

image

Understand some common image formats:

For example:

<! -- Local image -->
<img src=".. /images/li06.jpg" alt="Wallpaper" width="50%">

<! -- Network image -->
<img src="Https://dss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=2590128318, & FM = 26 & gp = 0. 632998727 JPG" alt="Avatar" width="100px">
Copy the code

Where the Alt attribute represents what is displayed when it cannot be loaded

hyperlinks

<! -- Network link -->
<a href="https://www.baidu.com" title="Google it." target="_blank">The baidu</a>

<! -- Image link --> 
<a href="https://www.bilibili.com" title="B" stations target="_self">
    <img src="Https://img2.baidu.com/it/u=294573518, 3786263664 & FM = 26 & FMT = auto&gp = 0. JPG" alt="Avatar" width="100px">
</a>

<! -- Anchor link -->
<a href="#md1">Anchor point picture area 1</a>
<h3 id="md1">Anchor point picture area 1</h3>
Copy the code

audio

<p>
    <audio src=".. / Audios/Liu Leyao - Prose poem written by father. Mp3" controls autoplay loop></audio>
</p>

<p>
    <video src=".. / videos/dance. Mp4. "" width="70%" controls autoplay loop></video>
</p>
Copy the code

• Controls Progress bar display
• Autoplay Automatically plays
• Loop play

Block label

Semantic labels

<span>Inline tag, no line breaks</span>
<! - original -- -- >
<b>bold</b>
<i>italics</i>
<u>The underline</u>

<strong>It is particularly important</strong>
<em>important</em>
<mark>The highlighted</mark>

<! The element represents a single piece of content that is used as the image of the illustration in the document, with a title -->
<figure>
	<img  src="Https://ss1.bdstatic.com/70cFvXSh_Q1YnxGkpoWK1HF6hhy/it/u=3443714613, & FM = 26 & gp = 0. 873961460 JPG" alt="Wallpaper">
    <figcaption>The George Washington Bridge</figcaption>
</figure>
Copy the code

The form

<form action="" method="POST">
    <input type="text">
</form>
Copy the code

The input tag corresponds to the type table:

Custom drop-down box:

<input type="text" list="addr">
<datalist id="addr">
    <option value="Shanghai">Shanghai</option>
    <option value="Guangzhou">Guangzhou</option>
    <option value="Hangzhou">hangzhou</option>
    <option value="Jiangxi">jiangxi</option>
</datalist>
Copy the code