HTML study notes one-HTML Tutorial-php.cn

HTML study notes one

不言

Release： 2018-04-19 14:29:40

Original

1630 people have browsed it

The content of this article is about HTML learning notes 1, which has a certain reference value. Now I share it with everyone. Friends in need can refer to

Click to open the link to learn the summary.

Commonly used HTML tags and explanations

1. Basic format framework

<html>
<body>
<h1>标题</h1>
<p>段落</p>
</body>
</html>

Copy after login

2. Text formatting tags

<b>粗体</b>
<big>大号字</big>
<em>着重字（粗）</em>
<i>斜体字</i>
<strong>加强语气（粗）</strong>
<sub>下标</sub>
<sup>上标</sup>
<ins>插入字</ins>
<del>删除字</del>

Copy after login

3. Link

<a href="URL" target="_blank"> this is a link </a>

Copy after login

Among them, href=hyperlink, target="_blank" means in Open the file in a new window.

Note that there is a space between the two.

There is a special case where the name attribute is used, which can jump to the anchor defined by the name attribute.

<a name="tips">基本的注意事项 - 有用的提示</a>
.
.
.
<a href="#tips">跳转到tips标签处</a>

Copy after login

Note that when citing anchors, add # in front of the name.

4. Image

<img src="boat.gif" alt="Big Boat" width="104" height="102" />

Copy after login

Among them, src stores the address of the image;

alt attribute Represents replacement text, that is, the text description displayed when the image cannot be loaded;

width and height are used to set the length and width of the image;

In addition, the image also has an attribute border for Specifies the width of the image border.

5. General method of changing attributes - style

<body style="background-color:yellow">
<h2 style="font-family:arial;color:red;font-size:20px;text-align:center;">
标题
</h2>
</body>

Copy after login

Among them, background-color is used Used to set the background color;

font-family is used to set the font;

color is used to set the (title) font color;

font-size is used to set Font size;

text-align: center.

6. Quote

The first type: is equivalent to "".

<q>所要引用的话</q>

Copy after login

The second type: long quotation, automatic indentation, cite indicates the source address (can be omitted).

<blockquote cite="URL">......</blockquote>

Copy after login

The third type: abbreviation. Putting the mouse on the abbreviation will display the complete content, that is, title.

<abbr title="world health organization">WHO</abbr>

Copy after login

The fourth type: address (contact information), automatically italicized, and automatically added line breaks before and after.

<br/>

Copy after login

<address>我是地址</address>

Copy after login

The fifth type: the title of the work, automatic italics.

<cite>老人与海</cite>

Copy after login

Special, two-way rewriting, dir="rtl" means writing from right to left

<bdo dir="rtl">从右向左</bdo>

Copy after login

7. Computer code

<kbd>键盘输入</kbd>
<samp>计算机输出示例</samp>
<code>代码</code>
<pre class="brush:php;toolbar:false">文本

数学公式

Copy after login

Among them, the first three do not retain spaces and line breaks. If you want to keep For the original format of the text, please use the fourth format,

to retain line breaks.

8. Create an image map

请点击图像上的星球，把它们放大。

Copy after login

Among them, defines the image map, including The id and name attributes generally need to be defined;

defines the clickable area of the image map, including attributes:
Shape specifies the shape of the area

coords Specify the (x,y) coordinates of the area, the upper left corner is (0,0); for example (x,y,z), xy represents the center of the circle, z represents the radius

The usemap attribute in

## refers to the id or name attribute in the map.

9. Others

# # -------Line break

-------Horizontal line

---------Comments

The above is the detailed content of HTML study notes one. For more information, please follow other related articles on the PHP Chinese website!