前端自学模块之HTML

自学Day1——文本修饰标签、标签属性属性和嵌套

————留着

自学Day2——其他标签、超链接

1. • P标签、div标签、span标签

看看区别

2. • 单标签及属性（水平、换行、格式化）

<hr/>水平线

举例子：<hr width="500" align="left" color="red"/>

<br/>换行

（遇到br就换行，多写几个br就多换几行）

<pre></pre>格式化

（代码中空格和回车没有意义哦，要在末尾加上pre）

3. • HTML 字符实体

更多的可以在W3school里找到：https://www.w3school.com.cn/html/html_entities.asp

4. • HTML的注释

<!-- 注释的内容--> 注释了就前端页面看不见了，但是代码里还是有的

不能注释里面又嵌套注释

5. • 超级链接标签

超链接语法格式

来，打开百度： <a href="" target="_blank">https://www.baidu.com/">百度一下</a>

新窗口打开百度： <a href="https://www.baidu.com target=_blank ">百度一下</a>

给个title属性 ： <a href="https://www.baidu.com" target="_blank" title="百度一下，你就知道">百度一下</a>

～～～day2结束啦～～～

自学Day3-锚记链接

6.锚记链接

a标签可以将长页面通过点击，直接定位到对应内容

<a href="#key"> 到锚记位置</a>

<a name="key"> </a>

7.图像标签/图片标签

图片标签的语法和属性

单标签

<img src="图片路径" alt="图片替代文本" title="提示文字" width="宽度" height="高度"/>

• src后面可以引入相对地址，绝对地址，网络地址

• alt是图片的描述信息

8. 图片热点地图usemap

<img src="图片地址" usemap="#Map"/>

<map name="Map">

<area shape="rect" coords="10,10,50,50" href="#">

^^^^^^^^^^^^^

</map>

shape属性规定了area元素的形状，3种：rect（矩形），circle（圆形），poly（多边形）

<img src="image1.jpg" alt="" usemap="#mymap" />

<map name="mymap">

<area shape="rect" coords="10,10,50,50" href="http://www.jd.com" alt="" target="_blank" />

<area shape="circle" coords="10,50,50" href="http://www.qq.com" alt="" />

自学Day4-表格（9-10-11）

9.表格标签的基本属性

<table border="1" width="50%" cellspacing="10" cellpadding="50" >

<tr>

<td>1</td>

<td>2</td>

<td>3</td>

</tr>

<tr>

<td>a</td>

<td>b</td>

<td>c</td>

</tr>

</table>

样式如下：

10. 表格标签和属性

align定义表格行的内容水平对齐方式：left，center，right

valign规定表格行中内容的垂直

<table border="1" width="500" cellspacing="0" cellpadding="0" align="center" bgcolor="#CCC">

<tr align="center" height="40" valign="top">

<td rowspan="2">1</td>

<td><font size="6">2</font></td>

<td>3</td>

</tr>

<tr>

这里删掉了a

<td>b</td>

<td>c</td>

</tr>

</table>

10.1 细线表格边框

通过border=""， bgcolor=""， cellspacing=""来实现——未来可以用CSS来写

自学DAY5-其他标签

11.表格的其他标签