html onclick 打开嵌入网页_《HTML常用标签》

a 标签的用法：

1、href="#"的作用：页面中有滚动，可以直接回到顶部。

<a href="#">回到最顶端</a>

2、href="url"的作用

1）url为绝对路径

//跳转到百度页面 <a href="http://baidu.com">超链接</a> //下载文件 <a href="http://baidu.com/i.img">超链接</a>

2）URL为相对路径

//下载图片
<a href="/Home/i.img">超链接</a>

3）锚点

页内跳转

//点击此处会跳到标记1 <a href="#1">锚点1</a> //点击此处会跳到标记2 <a href="#2">锚点1</a> <div id="1">标记1</div> <div id="2">标记2</div>

页外跳转

假如有1.html，2.html

1.html
//此时就会跳转到2.html的标记1处 <a href="2.html/#1">锚点1</a> <div id="1">标记1</div> 2.html <div id="1">标记1</div>

3、href="JavaScript:;"（javascript:是伪协议，它可以让我们通过一个链接来调用javascript函数.而采用这个方式 javascript:;可以实现A标签的点击事件运行时，如果页面内容很多，有滚动条时，页面不会乱跳，用户体验更好）

//void是一个操作符，void(0)返回undefined，地址不发生跳转，会执行onclick里面的方法 <a href="javascript:void(0)" οnclick="sub();">方法</a> //#是标签内置的一个方法，代表top的作用。点击网页后返回到页面的最顶端。 <a href="#" οnclick="sub();">方法</a> //js函数后return false，页面不发生跳转，执行后还是在页面的当前位置 <a href="#" οnclick="sub();return false;">方法</a>

img 标签的用法：

img 元素向网页中嵌入一幅图像。

请注意，从技术上讲，<img> 标签并不会在网页中插入图像，而是从网页上链接图像。<img> 标签创建的是被引用图像的占位空间。

<img> 标签有两个必需的属性：src 属性 和 alt 属性。

alt：规定图像的替代文本。

src：规定显示图像的 URL。

实例

在下面的例子中，我们在页面中插入一幅 在上海鲜花港拍摄的郁金香照片：

src="/i/eg_tulip.jpg"

以上代码的效果：

table 标签的用法：

<table> 标签定义 HTML 表格。

简单的 HTML 表格由 table 元素以及一个或多个 tr、th 或 td 元素组成。

tr 元素定义表格行，th 元素定义表头，td 元素定义表格单元。

更复杂的 HTML 表格也可能包括 caption、col、colgroup、thead、tfoot 以及 tbody 元素。

实例

一个简单的 HTML 表格，包含两行两列：

<table border="1">
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td>January</td>
    <td>$100</td>
  </tr>
</table>

以上代码的效果：

其他感想

前端的常用标签要在实践中去学习，每天都要做到练习，代码敲得多了自然也就会了懂了，把基础打牢固，才会在未来的代码之路上越走越远。

附送学HTML标签讲解的小网站，可以在里面查找你不会不太明白的标签，很方便：

w3school 在线教程​www.w3school.com.cn