《HTML常用标签》

183 阅读3分钟

a 标签的用法

1 页面跳转

    href 属性,"引号引起来的是属性值"
   写法:<a href = "路径" target="属性值"> &emsp;&emsp;&emsp;&emsp;这个路径在这指的是需要跳转的页面的网址</a>
target属性,英文单词含义对象。即后面的属性值对前面的属性进行处理,对象的处理方式为:
_blank:target="_blank" 含义:在一个新的窗口打开被连接文档
_self:target="_self" 含义:在当前页面打开被链接文档   _parent:target="_parent" 含义:在父框架集中打开被链接文档
_top:target="_top" 含义:在首个窗口页面打开被链接文档   2 定位   设定锚点: 在要定位到的位置找一个标签给他加id属性,属性值就是锚点名称 例如: <a href="#">内容</a> <!--#的意思是跳转到本页-->  定位锚点: 跳转到指定锚点   3 下载 or其他   a 标签跳转到的文件 浏览器打不开,然后会选择提供下载 例如RAR文件(即href路径为rar文件) <a href = "../../狗子.rar">内容</a>

img 标签的用法

展示图片链接如: <img src="./imgs/狗子.jpg"> img下有许多属性可以选择: 1、alt 表示图片加载的显示内容,方便访问者知道该图片的用途。 如: <img src="./imgs/狗子.jpg" alt="一只狗子"> 表示这张图片是一张狗图。 2、align 表示图片在文字中对齐的位置 top顶部对齐,bottom底部对齐,middle居中对齐。默认为底部对齐。 两个悬浮效果 left图片浮动到文字左侧,right图片浮动到文字右侧。 3、通过width和height改变图片的大小 2和3的代码演示如下 <p>狗子<img src="./imgs/狗子.jpg" align="bottom" width="100"></p> 一般高和宽只定义一个另一个可默认,这样图片不会变形 其中图片都是相对路径下的本地图片 4、点击图片,打开另一个链接 <p>点击图片打开链接 <a href="page1.html" title="点击进入page1界面"> <img src="./imgs/狗子.jpg" alt="logo" width="200px" align="middle"/></a></p> 其中 page1.html为另外一个html文档,代码如下:

<head>
<title>page1界面</title>
</head>
<body>
<p>我是page1</p>
</body>
</html>

点击图片就会打开page1.html。

table 标签的用法

简单的表格由table元素以及一个或多个tr(行标签)、th(表头单元格标签)、td(普通单元格标签)等标签所组成,当然复杂的表格还包括caption(表格标题)、col(定义列)、colgroup(对表格中的列进行组合)、thead(组合表头的内容)tbody(组合表格的主题内容)、tfoot(组合表格的脚注内容)等这里我们先简单了解下即可。 定义表格:<table></table> 创建表行:<tr></tr> 创建列(单元格):<th></th>(表头)、<td></td>(表格单元) 默认情况下,每行中的列数是统一的 比如我们想创建一个姓名、年龄、分数和日期的数据表格,并设置border为1,我们可以使用table来制作。具体的表格代码如下图所示:

在网页中呈现的效果就如下图所示:
可以删除表格间隙,美化表格:table{ border :1px solid black; border -collapse :collapse; }

其他感想

知道了一些HTML的常用标签