HTML5实现锚点时请使用id取代name

HTML5已经去掉name属性,实现锚点时请使用id,实例效果:http://keleyi.com/keleyi/phtml/html5/9.htm

支持Chrome,火狐,IE8以上等浏览器。

以下是完整代码:
 

复制代码
代码如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>HTML5锚点实例--柯乐义</title><base target="_blank" />
<style>
body{margin:0px;}
</style>
</head>
<body>
<div id="keleyihead"><a href="http://keleyi.com">柯乐义</a> <a href="http://keleyi.com/a/bjac/hwqa4oex.htm">HTML5锚点</a> keleyi.com
<script type="text/javascript" src="http://keleyi.com/kineryi/js/gggg728x90a.js"></script></div>
<div style="height:30px;width:100%;text-align:center"><a href="#keleyifoot" target="_self">转到底部</a></div>
<div style="background-color:#959822; width:100%;height:150px;">请滚动鼠标使页面向下</div>
<div style="background-color:Green; width:100%;height:150px;">www.keleyi.com</div>
<div style="background-color:Red; width:100%;height:150px;">欢迎</div>
<div style="background-color:Yellow; width:100%;height:150px;">hi</div>
<div style="background-color:Silver; width:100%;height:150px;">
<a href="http://keleyi.com/dev/94fb5964c80ee829.htm" target="_blank">绿色箭头图片返回顶部效果</a>
<a href="http://keleyi.com/a/bjac/7cc2358ac924ebc5.htm" target="_blank">蓝色方块返回顶部</a>
<a href="http://keleyi.com/a/bjac/6f008786225269ac.htm" target="_blank">纯文本返回顶部</a>
<a href="http://keleyi.com/a/bjac/8aa32432160f9aa4.htm" target="_blank">漂亮的返回顶部、底部和留言</a></div>
<div style="background-color:Aqua; width:100%;height:150px;">keleyi.com</div>
<div style="background-color:Fuchsia; width:100%;height:150px;">keleyi</div>
<div style="background-color:Green; width:100%;height:150px;">keleyi.com</div>
<div style="background-color:Blue; width:100%;height:150px;">柯乐义</div>
<div style="background-color:Olive; width:100%;height:150px;">柯乐义 监视下滚像素</div>
<div style="background-color:Green; width:100%;height:150px;">keleyi.com</div>
<div style="background-color:Purple; width:100%;height:150px;">jquery</div>
<div style="background-color:Green; width:100%;height:150px;"><a href="http://keleyi.com/a/bjac/f4a6f78d74a251c5.htm" target="_blank">原文</a></div>
<div style="background-color:Lime; width:100%;height:150px;">keleyi.com</div>
<div style="background-color:Orange; width:100%;height:150px;">完整代码</div>
<div style="height:200px;width:100%;">HTML5已经去掉name属性,实现锚点时请使用id</div>
<div id="keleyifoot" style="width:100%;height:276px;background: url(footerimg.jpg); background-position:center top; background-repeat:no-repeat;text-align:center;"><a href="#keleyihead" target="_self">回到顶部</a></div>
</body>
</html>

直接转到页底示例:
http://keleyi.com/keleyi/phtml/html5/9.htm#keleyifoot

时间: 2024-10-06 19:18:27

HTML5实现锚点时请使用id取代name的相关文章

网站做锚文本时需要注意的事项(上)

与三年前相比,现在做网站优化的给网站做锚文本的越来越多,而此前却是少之又少,甚至连锚文本的作用是什么都很少有人知道.对于文章中出现的一些关键词和某段语句大家都知道要做锚文本,但同时很多新朋友可能会有这样的疑虑:锚文本该怎样做,同时需要注意哪些事项? 锚文本可分为站内锚文本和站外锚文本两种.在总结个人和他人相关经验的基础上,在此小编就给大家简单的介绍一下这两个概念,以便新朋友们对锚文本有所了解,以利于自己在为网站做锚文本的时候做出合理且最大效果的优化. 一.站内锚文本 顾名思义,站内锚文本是针对网

网站做锚文本时需要注意的事项(下)

此文接上文"网站做锚文本时需要注意的事项(上) " 站外锚文本需注意事项 在网站排名优化工作中站外锚文本优化比站内优化更具举足轻重的地位.在不做站内优化,只做站外优化的情况下,网站排名仍可达到良好效果,反之则优化难度相对大很多.一名SEOER每天大部分的工作时间都是投入在网站外部优化中.这里简要提几个需要注意的事项. 1.锚文本多样化 在网站外部锚文本制作过程中,核心关键词锚文本要多样化.要怎样多样化呢?例如我们在跟朋友交换链接时,可以做上:武汉网站优化 .武汉做网站优化.武汉做优化等

微信转发时获取用户ID(或加密后的ID)

问题描述 微信转发时获取用户ID(或加密后的ID) 如题 我是想统计: 1.微信转发时,是哪个用户进行了转发操作,即取得用户ID,甚至包括用户的一些基本信息? 2.如果不能取得用户ID,加密后的ID(或类似的信息)能不能取到? 最好直接取到用户ID 解决方案 关注此问题,求各位大神能给出提示.

《Vim实用技巧(第2版)》——第2章 普通模式 2.1停顿时请移开画笔

第一部分 模式 Vim提供一个区分模式的用户界面,就是说在Vim中按键盘上的任意键所产生的结果可能会不一样,而这取决于当前处于哪种模式(mode).知道当前正处于哪种模式,以及如何在各模式间切换,是极其重要的.在本书的这一部分,我们将学习每种模式的工作方式及其用途. 第2章 普通模式 普通模式是Vim的自然放松状态,如果本章看起来出奇的短,那是因为几乎整本书都在讲如何利用普通模式,而本章只涉及其中的一些核心概念以及通用技巧. 其他文本编辑器大部分时间都处于类似Vim插入模式的状态中,因此对Vim

[非常感人的]当你嫌弃你的父母时 请你读读这段话_经典网摘

我的孩子: 哪天 如果你看到我日渐老去 反映慢慢迟钝 身体也渐渐不行时 请耐着性子试着了解我,理解我---- 当我吃的脏兮兮 甚至已不会穿衣服时 不要嘲笑我 耐心一点儿 记得我曾经花了多少时间教你这些事吗? 如何好好地吃,好好的穿, 如何面对你的生命中的第一次: 当我一再重复 说着同样的事情时 请你不要打断我 听我说 小时候 我必须一遍又一遍地读着同样的故事 直到你静静地睡着: 当与我交谈时 忽然不知道该说什么了 给我一些时间想想 如果我还是无能为力 不要紧张 对我而言重要的不是说话 而是能跟你

SQL插入数据时返回最新ID方法

SQL插入数据时返回最新ID方法 SELECT LAST_INSERT_ID().SELECT @@IDENTITY接可.但到下午那兄弟还没搞定.因为不知道怎么运行..项目都是三层的.基本是写在DBHELPER中.原因是其写入了: cmd.ExecuteNonQuery(); ---这是执行非查询语句返回受影响的行数. 其实是应该写入: cmd.ExecuteScalar(); 返回首行首列.可能是因为helper里面注释为:        /// <summary>         ///

为什么打开时前置请求id为空

配置文件中明明有前置请求id,   但是打开工具时,没有设置上   为什么呢? 有问题的代码: Java代码   for(int i=0;i<size;i++){                  RequestPanel requestPanel=this.allRequestPanelList.get(i);               //设置前置请求下拉框               requestPanel.requestIDDispache();               Requ

seo推广时请注意URL结构对seo优化的影响

中介交易 http://www.aliyun.com/zixun/aggregation/6858.html">SEO诊断 淘宝客 云主机 技术大厅 关于URL的结构对SEO的影响,下面是几个常见问题: URL要什么样是结构比较好? URL要几层才有利于SEO优化? URL一定要静态化吗? 什么样的域名有利于SEO? 下面主要结合上面就个问题对URL结构与SEO的关系做下分析: 1.什么样的域名对有利于SEO? 当我们在准备做SEO的时候,选择域名最好包括我们要做的关键词,这样对SEO有一

Nginx服务器在使用HTML5 Manifest离线缓存时无法及时更新的问题

问题描述 使用HTML5Manifest离线缓存机制,在服务器端都配置了mine,但是:在apache服务器上,可以正确表现离线缓存的能力:更新manifest文件后浏览器自动更新线上最新的网页和资源:同样的web网站代码,在nginx服务器上却无法更新网页资源,调试发现浏览器请求的.manifest文件也始终是旧的.猜想可能是nginx服务器配置有问题,但是不知哪个配置会造成这个问题?