页面一：

<!DOCTYPE html>

<html>

    <head>

        <meta charset="utf-8" />

        <title></title>

    </head>

    <body>

        <p style="text-align: center;">

            <a href="page01.html">

            <img src="img/html5.jpg" border="5px" title="Html5图片"/>

            </a>

        </p>

    </body>

</html>

效果图：

页面二：

<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title></title>

    </head>

    <body>

        <h1 align="center">HTML百科</h1>

        <img src="img/a.jpg" style="float: left;" hspace="10px" vspace="0px"/>

        <hr color="darkgray"/>

        <div id="">

            <li>

                <strong>HTML5</strong>是<strong>HTML</strong>即超文本标记语言或超文本链接标示语言的第五个版本.目前广泛使用的是<strong>HTML4.01</strong>。

            </li>

            <li>

                <strong>HTML5</strong>草案的前身名为<strong>Web Applications 1.0</strong>。

            </li>

            <li>

                <em>2004年</em>被<strong>WHATWG</strong>提出。

            </li>

            <li>

                <em>2007年</em>被<strong>W3C</strong>接纳，并成立了新的<strong>HTML</strong>工作团队。

            </li>

            <li>

                <em>2008年1月22日</em>，第一份正式草案公布。

            </li>

        </div>

        <hr color="darkgray"/>

        <a href="page02.html"><img src="img/down.png"/></a>

        <a href="page.html"><img src="img/return.png"  style="float: right;" href="page.html"/></a>

    </body>

</html>

效果图：

页面三：

<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title></title>

    </head>

    <body>

        <h1 align="center">HTML百科</h1>

        <img src="img/b.jpg" style="float: left;" hspace="10px" vspace="0px"/>

        <hr />

        <img src="img/pic01.jpg" />

        <img src="img/pic02.jpg" />

        <hr />

        <a href="page01.html"><img src="img/up.png"  href="page01.html"/></a>

        <a href="page.html"><img src="img/return.png" style="float: right;" href="page.html"/></a>        

    </body>

</html>

效果图：

页面四：

!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title></title>

    </head>

    <body>

        <div>

            <h1 align="center">传播智客学院简介</h1>

            <h3 align="center">

                更新时间：2015年7月28日14时08分  来源：

                <a href="http:\\www.itcast.cn" target="_blank">传播智客</a>

            </h3>

            <hr color="darkgray"/>

            <img src="img/designer.jpg" align="left" hspace="40px" vspace="5px" width="350px"/>

            <p>&nbsp;&nbsp; &nbsp;&nbsp;<strong>传智播客设计学院</strong>专注于平面设计师、网页设计师、UI设计师的培养。我们拥有专业的师资团队，清晰合理的课程架构，4个月的学习循序渐进、充实饱满，结合大量的案例和实战项目，毕业后相当于两年工作经验。</p>

            <p>&nbsp;&nbsp; &nbsp;&nbsp;<strong>传智播客设计学院</strong>教给你的远远不止如何作图，在这里你将学到真正的设计素养和理念，成为平面、网页、UI设计都精通的全能设计师。</p>

            <p>&nbsp;&nbsp; &nbsp;&nbsp;迄今为止<strong>传智播客设计学院</strong>已经培养出了上万名设计师，遍布于各个大中型企业，同时，从传智播客走出去的学员也得到了各个企业的一致认可和好评。</p>

        </div>

        <hr color="darkgray"/>    

    </body>

</html>

效果图：　

　　内容所涉及的程序及图片链接：https://i.cnblogs.com/Files.aspx

Html学习之一（锚点链接的使用，页面间的跳转）的更多相关文章

  1. StoryBoard学习（5）：使用segue页面间传递数据

    StoryBoard学习(5):使用segue页面间传递数据 函数: - (void)prepareForSegue:(UIStoryboardSegue *)segue sender:(id)sen ...

  2. 微信公众平台回复链接可以直接访问,但不能是锚文字链接<a>标签

    最近在学习微信公众平台开发,由于编辑模式和开发模式不可同时开启,在开发模式下如果访客发送关键字过来暂时无法实现关键词自动回复,客服人员先用链接网址直接回复订阅用户,但请注意不能是文字链接,即<a ...

  3. jquery 监听所有锚点链接实现平滑移动

    jquery 监听所有锚点链接实现平滑移动,地址栏上不会改变链接地址 //监听所有锚点链接实现平滑移动 $('a[href*=#],area[href*=#]').click(function() { ...

  4. JQuery简单实现锚点链接的平滑滚动

    在平时的项目中,我们经常需要一些特效链接,如果使效果进一步加强,我们可以使点击锚点链接平滑滚动到锚点,下面就来给大家讲解下如何使用jQuery来实现.   一般使用锚点来跳转到页面指定位置的时候,会生 ...

  5. 锚点链接和hash属性

    相信大家挺经常见过这样一个效果.有一个很长很长的页面,分成好几部分,目录中一点击,就能定位到页面某个位置. 例如:有这样一个目录,例如你点击一下“HTML”,就会直接跳转到“HTML”的页面位置 这就 ...

  6. HTML学习（五）链接

    1.创建文本链接 <html> <body> <p> <a href="/index.html">本文本</a> 是一个 ...

  7. HTML基础--position 绝对定位 相对定位 锚点链接

    position 定位属性,检索对象的定位方式 一.语法:position:static /absolute/relative/fixed 取值: 1.static:默认值,无特殊定位,对象遵循HTM ...

  8. div锚点链接跳转

    a标签href可跳转到知道dom节点(通过id) 代码 <!DOCTYPE html> <html> <head> <meta name="view ...

  9. jquer导航锚点链接动画效果和返回顶部代码

    $(function(){ $(".index_nav li a").click(function(event){ //绑定按钮的单击事件 var index = this.tit ...

随机推荐

  1. Python—实现钉钉后台开发

    二.实现钉钉免登流程 免登流程分四步:1.前端获取钉钉免登授权码code:2.后端获取access_token:3.使用授权码code和access_token换取用户userid:4.通过acces ...

  2. Python语法速查： 3. 字符串格式化

    返回目录 (1)简易字符串格式化 字符串属于不可变序列,只能生成新的,不能改变旧的.“字符串格式化”有点像以前C语言的sprintf,可以将若干变量代入格式化的字符串,生成一个符合要求的新字符串. 转 ...

  3. postman---postman导出python脚本

    前面一直写关于postman的一些文章,大家现在都应该简单了解,其实postman还有许多的功能,这个要大家一点点的挖掘出来了,安静在给大家分享一个关于postman导出python脚本 Postma ...

  4. VIJOS-P1013 强墙

    JDOJ 1198: VIJOS-P1013 强墙 JDOJ传送门 Description ​ 在一个长宽均为10,入口出口分别为(0,5).(10,5)的房间里,有几堵墙,每堵墙上有两个缺口,求入口 ...

  5. 给用户提供就医帮助的安卓APP

    经过我们的小组的成员讨论,我们确定了我们小组的项目,即是一款给用户提供就医帮助的安卓APP. 项目计划及功能:计划两个月内团队成员共同开发完成此款APP,此款APP提供预约挂号,名医名院咨询, 就医导 ...

  6. openpyxl常用API

    worksheet.cell(self, row, column, value=None)描述:给指定位置的单元格赋值参数: row&column:必须参数,单元格的坐标 value:可选参数 ...

  7. IT兄弟连 Java语法教程 流程控制语句 分支结构语句3

    3  if-else if-else条件语句 if-else if-else的完整形式如下: if(判断条件A){ A语句块(判断条件A的值为true,执行) }else if(判断条件B){ B语句 ...

  8. python 操作zookeeper详解

    ZooKeeper 简介 ZooKeeper 是一个分布式的.开放源码的分布式应用程序协调服务,是 Google 的 Chubby 一个开源的实现,是 Hadoop 和 Hbase 的重要组件.它是一 ...

  9. vscode打开文件在同一个tab的问题

    当我们单击或者 cmd+鼠标左键单击打开文件时,有时候是在同一个窗口,有时候是新的窗口,这是啥样呢?   这是因为vscode有 "预览模式" , 当是预览模式时,打开的是当前窗口 ...

  10. WPF 使用EventTrigger时设置SouceName技巧

    使用情节触发器时,如果有触发源/触发源控件时可以将情节触发器放置最顶级的面板控件的触发器中. 通过blend这个神器真的是可以学到不少东西. 代码: //情节动画放置于顶级控制面板 <Widno ...