码迷,mamicode.com
首页 > Web开发 > 详细

HTML-锚点

时间:2017-03-06 12:18:26      阅读:197      评论:0      收藏:0      [点我收藏+]

标签:标题   注册   -name   lang   input   写作   type   footer   entity   

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>锚点</title>
    <style>
        .box1,.box2{
            height: 600px;
            border:1px solid;
        }
    </style>
</head>
<body>
<a href="#box1">找到目标</a>
<a href="#box2">找到内容</a>

<div class="box1" id="box1">我就是目标</div>
<div class="box2" id="box2">我就是内容</div>

<label for="input1">aaa</label>
<input type="text" id="input1"/>

<a href="#">回到顶部</a>


<!--标准文档流-->
在没有 CSS 的干预下,块级元素独占一行,行内元素并排显示。

<!--结构化-->

<!--article标签装载显示一个独立的文章内容。例如一篇完整的论坛帖子,一则网站新闻,一篇博客文章,一个用户评论等等。-->
<!--artilce可以嵌套,则内层的artilce对外层的article标签有隶属的关系。例如,一个博客文章,可以用article显示,然后一些评论可以以article的形式嵌入其中。-->
<article>
    <h1>文章标题</h1>
    <p>这是一篇文章</p>
    <article>评论1...</article>
    <article>评论2...</article>
</article>

<!--定义一个节-->
<section>
    <h1>章节一</h1>
    <p>详细内容...</p>
</section>

<!--aside 装载非正文内容,侧边栏、广告栏-->
<aside>
    ...
</aside>

<!--导航-->
<nav>
    <a href="#">新闻</a>
    <a href="#">体育</a>
    <a href="#">娱乐</a>
    <a href="#">八卦</a>
</nav>

<nav>
    <ul>
        <li><a href="#">新闻</a></li>
        <li><a href="#">新闻</a></li>
        <li><a href="#">新闻</a></li>
        <li><a href="#">新闻</a></li>
    </ul>
</nav>

<footer>
    <!--定义作者信息-->
    <address>作者。。。。</address>
    <small>我们公司在2005年注册 2015-10-11&copy;</small>
</footer>

<!--文字高亮 提示-->
<p>别忘记<mark>写作业</mark></p>

<p>我是<sup>上标</sup></p>
<p>我是<sub>下标</sub></p>

<p>XX房子190m<sup>2</sup></p>
<h1>我是上标<sup>&reg;</sup></h1>

<p>我们在<time>9:00</time>上课</p>
<p><time>2.14</time>是情人节</p>
<p><time>7.7</time>也他妈是情人节</p>

</body>
</html>

HTML-锚点

标签:标题   注册   -name   lang   input   写作   type   footer   entity   

原文地址:http://www.cnblogs.com/wylbgp/p/6508633.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!