html5--1.8超链接下

下面演示链接打开新网友不关闭原网页。


外部网站: 百度

这是用a标签的target属性实现的,用的target="_blank"
这样新出现的页面会另外再开一个页面
target属性的四个值:
_self:当前位置;默认的,没有效果
_blank:新窗口;
_top(最顶层框架),_parent(父框架),这两个属性咱不做讲解,后边的章节再说;

下面演示网页内部锚点


锚点1
锚点2
锚点3

锚点1

这里是用a标签的id属性来实现网页内部锚点的。
通过id链接到a标签引用位置的地址href
引用id的时候有#号。

代码:

<a href="#1">锚点1</a>

<a id="1">锚点1
网页内部使用锚点的方法:

1、设置目的位置a标签的id

2、将引用位置a标签的href设置为引用id

一个锚点需要用两个a标签实现

锚点2

html中的id和name属性的区别:
id属性:通用属性,可以理解为元素的身份证,一个html里面id不重复
name属性:可以理解为元素的名字,名字可重复,可同名

锚点3


学习要点:

target属性
id或name属性和创建文档内链接

1.target属性的四个值:
_self:当前位置(默认,加上不会有效果)
_blank:新窗口;
_top(最顶层框架),_parent(父框架),这两个属性咱不做讲解,后边的章节再说;

2.id属性:通用属性,可以理解为元素的身份证;name属性:可以理解为元素的名字

 <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>链接演示下</title>
</head>
<body bgcolor="Beige">
<h1 align="center">下面演示<mark>链接</mark>打开新网友不关闭原网页。</h1>
<hr>
外部网站: <a href="https://www.baidu.com" target="_blank">百度</a><br> <h5>
<p>
这是用a标签的target属性实现的,用的target="_blank"<br>
这样新出现的页面会另外再开一个页面<br>
target属性的四个值:<br>
_self:当前位置;默认的,没有效果<br>
_blank:新窗口; <br>
_top(最顶层框架),_parent(父框架),这两个属性咱不做讲解,后边的章节再说;
</p>
</h5> <h1 align="center">下面演示网页<mark>内部锚点</mark></h1>
<hr> <a href="#1">锚点1</a>
<a href="#2">锚点2</a>
<a href="#3">锚点3</a>
<br><br>
<a id="1">锚点1
<h5>
<p>
这里是用a标签的id属性来实现网页内部锚点的。<br>
通过id链接到a标签引用位置的地址href。<br>
引用id的时候有#号。<br>
</p>
</h5>
<br><br><br><br>
<a id="2">锚点2
<h5>
<p>
html中的id和name属性的区别:<br>
id属性:通用属性,可以理解为元素的身份证,一个html里面id不重复;<br>
name属性:可以理解为元素的名字,名字可重复<br>
</p>
</h5>
<br><br><br><br>
<a id="3">锚点3<br><br><br><br><br><br>
<br><br><br><br><br><br>
<br><br><br><br><br><br>
<br><br><br><br><br><br>
<br><br><br><br><br><br>
<br><br><br><br><br><br>
<br><br><br><br><br><br>
<br><br><br><br><br><br>
</body>
</html>

html5--1.8超链接下的更多相关文章

  1. PowerPoint超链接字体颜色修改、怎么去掉超链接下划线

    经常在做PPT幻灯片时会遇到这样一个问题,给文字加超链接后发现链接的颜色是蓝色的,而且还带有下划线,这种效果与主题的色彩搭配简直是太影响美观效果了.有没有什么办法可以去掉PPT中的超链接下划线?再将超 ...

  2. html5实现移动端下拉刷新(原理和代码)

    这篇文章给大家介绍的内容是关于html5实现移动端下拉刷新(原理和代码),有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助. 移动端的下拉刷新是一个很常见的功能,也有许多开源库实现了这个功 ...

  3. 轻松实现HTML5时钟(分享下自己对canvas的理解,原来没你想像的那么难哦)

    Hey,guys! 让我们一起用HTML5实现一下简易时钟吧! 接触canvas时, 我突然有一种非常熟悉的感觉------canvas的部分的功能其实和Photoshop中的 钢笔工具 是一样的.所 ...

  4. HTML5的一个写下拉文本框标签

    新的HTML5有个标签,能够下拉的文本框 代码如下 <input list="browsers"> <datalist id="browsers&quo ...

  5. html5+css3实现手机下拉和下拉刷新

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  6. 来吧,HTML5之基础标签(下)

    <dialog> 标签 定义对话框或窗口. <dialog> 标签是 HTML 5 的新标签.目前只有 Chrome 和 Safari 6 支持 <dialog>  ...

  7. 移动端(html5)微信公众号下用keyup实时监控input值的变化无效

    搜索框依据用户输入的值实时检索,一开始自然而然想到keyup,在拼音状态时,啥问题也没有, 问题1:切换到中文输入法,问题出来了,keyup事件不灵便了,后来在网上搜了下,找到了思路, 问题2:微信公 ...

  8. 解决<a>文本本身带下划线和超链接下划线重合的问题

    <a style="padding-bottom: 1PX;border-bottom: 1PX #254fc5 solid;text-decoration: none;"& ...

  9. html5 标签在 IE 下使用

    (function(){if(!/*@cc_on!@*/0)return;var e = "abbr,article,aside,audio,bb,canvas,datagrid,datal ...

随机推荐

  1. vue2 axios 接口函数封装

    封装 axios 工具,编辑 src/api/index.js 文件 首先,我们要使用 axios 工具,就必须先安装 axios 工具.执行下面的命令进行安装 npm install axios - ...

  2. javascript 关于弹出新页面始终在正中央方法

    记录一个关于弹出新页面始终在正中央方法 function openwindow(url, name, iWidth, iHeight) { var url;                       ...

  3. robotframework使用之元素定位动态ID方法

    转自: http://blog.csdn.net/u011757108/article/details/53418671 一个弹出框所有元素ID竟然的动态的,关闭后再打开,里面的ID又变! 如下图:  ...

  4. redis远程登录

    #redis-cli -h 202.96.126.37 -p 6379 #auth 'd6d72fa9b2ff458e:GRjZmQ3MTN'

  5. win10 1709正式版iso镜像下载|windows10 1709秋季创意者更新官方下载地址

    win10 1709正式版iso镜像下载|windows10 1709秋季创意者更新官方下载地址 发布时间:2017-10-18 14:27发布者:系统城-xtcjh浏览数:74458 win10 1 ...

  6. anaconda2下面安装opencv2.4.13.4完成----解决默认安装的问题----Thefunction is not implemented. Rebuild the library with Windows, GTK+ 2.x orCarbon support. If you are on Ubuntu or Debian, install libgtk2.0‑dev and pkg

    转载自:http://blog.csdn.net/qingyanyichen/article/details/73550924 本人下载编译安装了opencv2.4.9,oppencv2.4.10,o ...

  7. 查看mysql 的存储过程定义

    查询数据库中的存储过程 方法一: select `name` from mysql.proc where db = 'your_db_name' and `type` = 'PROCEDURE' 方法 ...

  8. uboot之bootm以及go命令的实现

    本文档简单介绍了uboot中用于引导内核的命令bootm的实现,同时分析了uImage文件的格式,还简单看了一下uboot下go命令的实现 作者: 彭东林 邮箱: pengdonglin137@163 ...

  9. linux支持的machine-types

    在内核文件中arch/arm/tools/mach-types定义目前内核支持的板卡.芯片等: ##machine_is_xxx  CONFIG_xxxx  MACH_TYPE_xxx  number ...

  10. 史上最浅显易懂的Git教程2 github

    Git是分布式版本控制系统,同一个Git仓库,可以分布到不同的机器上.怎么分布呢?最早,肯定只有一台机器有一个原始版本库,此后,别的机器可以“克隆”这个原始版本库,而且每台机器的版本库其实都是一样的, ...