html5基础 a标签+id 进行锚点跳跃

礼悟:
     公恒学思合行悟,尊师重道存感恩。叶见寻根三返一,江河湖海同一体。
          虚怀若谷良心主,愿行无悔给最苦。读书锻炼养身心,诚劝且行且珍惜。


               ide:visual studio 2017  
            browser:Chrome / Firefox
                     os:win7

学习链接:http://www.xuecaijie.com/htmlcss/113.html

代码

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="author" content="https://www.cnblogs.com/jizuiku"/>
    <title></title>
    <style type="text/css">
        :target{
            color:dodgerblue;
            font-size:larger;
        }
    </style>
</head>
<body>
    <!-- a标签还可以配合id进行网页内 锚点跳转。。。 -->
    <a href="#website-name">网站名称</a><br />
    <a href="#blog-name">博客名称</a><br />
    <hr />
    <h1 id="website-name">博客园</h1>
    <h2 id="blog-name">给最苦</h2>
</body>
</html>

效果

  点击 网站名称 超链接后,



HTML5优秀,值得学习。
学习资源: 参考链接 + www.w3cschool.cn + itcast和itheima视频库 + 清净的心地。
如果您有公开的资源,可以分享给我的话,用您的资源学习也可以。
博文是观看视频后,融入思考写成的。博文好,是老师讲得好。博文坏,是 给最苦 没认真。

原文地址:https://www.cnblogs.com/jizuiku/p/8439643.html

时间: 2024-11-05 11:32:48

html5基础 a标签+id 进行锚点跳跃的相关文章

HTML5基础-新增标签+新增属性+布局案例

html5中常用的结构标签 article 文章 header 头部 nav 导航 section 区域 aside 侧边栏 hgroup 区块的相关信息 figure 定义一组内容及标题 figcaption 定义figure元素的标题 footer 底部 dialog 对话框 使用习惯: header/section/footer > aside/article/figure/hgroup/nav > div embed可插入flash文件,但flash已经逐渐被淘汰,不建议使用 mete

HTML5基础-Mark标签高亮显示文本

1.mark标签使用 <mark></mark> 2.mark作用 使用mark标签元素,可以高亮显示文档中的文字以达到醒目的效果. 3.mark使用代码 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset=utf-8"/> 5 <style> 6 mark { 7 background-color:#00ff90; font-weight:bold; 8 }

p标签-HTML5精讲 课时ID:6.6 【表严肃】#HTML教程 #HTML5教程 #&lt;p&gt;标签

6.6 <p>标签-HTML5精讲 课时ID:6.6 [表严肃]#HTML教程 #HTML5教程 #p标签 是什么 <p>是段落标签(paragraph的缩写),用于给文字划分段落,一组<p>元素为一个段落 怎么用 比如一篇文章,如果需要三个段落可以这样写: <html> <body> <p> 很久以前,那还是我用win98的时候有次我系统崩溃了,因为我是电脑白痴,我朋友给我介绍了一个高手来帮我修电脑. 他看了一下电脑,问我有没有98

div标签-HTML5精讲 课时ID:6.7 【表严肃】#HTML教程 #HTML5教程 #div标签#

6.7 <div>标签-HTML5精讲 课时ID:6.7 [表严肃]#HTML教程 #HTML5教程 #div标签 是什么 <div>是用于在网页中划分区域的(division的缩写),通常作为容器而存在,用于包含网页中的内容,是最常用的网页元素之一. 怎么用 <html> <body> <div>你好,我是序员.</div> <div> <div> <div> <div> <di

html标签-HTML5精讲 课时ID:6.1 【表严肃】#HTML教程 #HTML5教程 #html标签

6.1 <html>标签-HTML5精讲 课时ID:6.1 [表严肃]#HTML教程 #HTML5教程 #html标签 是什么 如果把网页比作洋葱,一层包一层,那<html>标签就是洋葱最外层的皮,<html> 元素是一张网页的根元素,所以其他所有元素都是是此元素的后代. 怎么用 很简单,在写任何网页之前先将<html>写在最外面: <html> ... </html> 教程视频地址:表严肃HTML5精讲 短小! 活好! 链接:bia

body标签-HTML5精讲 课时ID:6.2 【表严肃】#HTML教程 #HTML5教程 #body标签

6.2 <body>标签-HTML5精讲 课时ID:6.2 [表严肃]#HTML教程 #HTML5教程 #body标签 是什么 把一张网页比作一个人<body>标签就表示一个人所有的可见部分,如五官.四肢.痔疮... 对于真实存在的但是肉眼不可见的部分,如思想.人格.性取向等<body>标签是管不着的.<body>包含着页面中所有的可见元素,比如链接.段落.图片... <body>是所有的可见元素的先人. 怎么用 <html> <

HTML5语义化标签总结

1.语义化标签总结 基础布局标签 <header></header> <nav></nav> <main></main> <aside></aside> <article></article> <footer></footer> 注意:IE8以后不兼容H5标签,如果需要兼容IE8一下的浏览器,则需要如下操作: 如果在sublime,或者WebStrom使用 可是使

HTML5 基础语法

HTML5 基础语法 HTML 概述 超文本 Web 是一个超文本文件的集合,超文本文件是 Web 的基本组成单元,也被称为网页或 HTML 文档.Web 页等,通常是以 .html 或 .htm 为后缀的文件.Web 页之间通过超文本中的超级链接组织在一起. 什么是 HTML? HTML(HyperText Markup Language):超文本标记语言,一种纯文本类型的语言,由浏览器解释执行.使用带有尖括号的"标记"将网页中的内容逐一标识出来.HTML 的主要作用是用来设计网页,

HTML5基础知识学习笔记

1.Html5基础讲解 1.1HTML5基础标签: head:头标签,一般会将一些网页的基本配置和文件引用在head中设置: body:内容标签,里面是整个网页要展示内容部分: 1.2HTML5标题: h1-h6等,后面跟的数字越大,对应的标题的字体大小就越小: 1.3HTML5段落 p标签表示段落,在p标签中可以编写文字段落: 1.4HTML5连接 a标签表示连接,可以在里面设置点击之后跳转到其他url: 1.5HTML5图像 img标签表示图像标签,可以通过其设置图片展示: 1.6HTML5