HTML Zero Basic Introduction (1)

1. HTML common tags

1. The h1-h6 title tags are decremented one by one, and each tag occupies a line.

2, <p>paragraph tag, word wrap</p>

3. Forcibly break newlines< br />

4, body content tag, head header, title page title content

5. html represents structure, css represents appearance, and JavaScript represents behavior

2. Text formatting tags

semantics Label illustrate
bold < strong>< /strong>或< b>< /b> The first one is more semantically strong!
tilt < en>< /en>或< i>< /i> The first one is more semantically strong!
strikethrough < del>< /del>或< s>< /s> The first one is more semantically strong!
underscore < ins>< /ins>或< u>< /u> The first one is more semantically strong!

3. <div> and <span> tags

Div and span have no semantics, they are a box for holding content

Features: div tags are used for layout, only one div can be placed on a line, a large box

The span tag is used for layout, there can be multiple spans on a line, small boxes

4. Image tags

<img> tags are used to define images in HTML pages

<img src="图像url" />

src is a required attribute of the <img> tag, it is used to specify the path and filename of the image file

alt replace text with text when the image cannot be displayed

<img src="img1.jpg" alt="不存在的图片"/>

title prompt text mouse over the image, prompt text

<img src="img.jpg" alt="不存在的图片" title="存在图片"/>

The picture needs to set the width width, height height, border thickness border

5. Image tags and paths

Relative path: The directory path established based on the location of the referenced file.

In simple terms, the position of the image relative to the HTML page

Relative path classification symbol illustrate
same level path The image file is at the same level as the HTML file<img src="img.jpg"/>
next level path / Image files are located one level below the HTML file<img src="images/img.jpg">
upper level path …/ The image file is one level above the HTML file<img src="../img.jpg">

Absolute path: It refers to the absolute position in the directory, directly reaching the target position, usually the path starting from the drive letter.

6. Hyperlink tags (emphasis)

1. External links:

<a href="跳转目标" target="目标窗口的弹出方式">文本或图像</a>
<a href="http://www.qq.com" target="_blank">腾讯</a>

The way target opens the window The default value is _self the current window opens the page _blank the new window opens the page

2. Internal link: the mutual link between the internal pages of the website, just link the name of the internal page directly

<a href="img.html">首页</a>

3. Empty link: If the link target is not determined at that time

<a href="#">首页</a>

Download link: If the address in href is a file or a compressed package, the file will be downloaded

<a href="img.zip">下载文件</a>

The address link is in the form of a file.exe or a compressed package such as zip

5. Web page element links: various web page elements in the web page, such as text, images, tables, audio, video, etc., can add hyperlinks

<a href="http://www.baidu.com"><img src="img.jpg"/></a>

6. Anchor link: Click on the link to quickly locate a certain position on the page.

In the href attribute of the link text, set the attribute value to the form of #name,

<a href="#冠军">中国好声音第一季</a>

Contents of the first season

<h3 id="冠军"></h3>

7. Special characters

space character

&nbsp;

Less than sign

&lt;

greater than sign

 &gt;

insert image description here

Guess you like

Origin blog.csdn.net/A6_107/article/details/123759321