暑期学习记录05

html

基本格式

<!DOCTYPE html>
<html lang="en">#lang 属性规定元素内容的语言。
<head>
     <meta charster="UTF-8"/>#声明文档对应的字符编码,UTF-8适用面最广很少需要其他编码
     <title></title>
</head>
<body>


</body>
</html>

HTML lang 属性
HTML 全局属性 所有浏览器均支持 lang 属性。
定义和用法

lang 属性规定元素内容的语言。

注释:lang 属性在以下标签中无效:

<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>

理解html5的文档大纲

推荐使用如下方法:

<!DOCTYPE html>
<html lang="language-code">
<head>
     <meta charster="UTF-8"/>
     <title></title>
</head>
<body>
<article>
    <h1>product user guide</h1>
    <section>
         <h2>setting it up</h2>
    </section>

    <section>
         <h2>basic feature</h2>
         <section>
             <h3>video playback</h3>
         </section>
     </section>

     <section>
         <h2>advanced feature</h2>
     </section>
</body>
</html>

查看html大纲

这里写图片描述

nav标签:

<!DOCTYPE html>
<html lang="en">
<head>
     <meta charster="UTF-8"/>
     <title></title>
</head>
<body>
<header>
     <nav>
       <ul>
          <li><a href="#gaudi">Barelona's Architect</a></li>
          <li lang="es"><a href="#sagrada-familia">La Sagrada Familia</a></li>
          <li><a href="#park-guell">Park Guell</a></li>
       </ul>
     </nav>
</header> 
</body>
</html>

这里写图片描述
ui标记为无序列表,如果链接顺序比较重要,标记为ol结构。

article标签:
内容可以包含任意数量的元素,类型包括段落,列表,音频,视频,图像,图形等
article是四个分块内容元素中的一个,其他三个是nav(将一组连接指定为重要导航),section,aside。
article不能嵌套在address元素中。

aside标签
输入侧栏的内容,尽管用法标记侧栏内容,但元素本身并不影响页面的布局。
如果在侧栏中使用一个或多个aside,在html中将他们放在主要内容的后面。
html5中不允许aside嵌套在address中。

footer标签
footer元素代表嵌套它的最近的元素的页脚,只有当它最近的祖先是body时,它才是整个页面的页脚。

title元素与title属性

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8" />
    <title>Adding the Title Attribute to Elements</title>   
</head>
<body>
    <header role="banner">
        <nav role="navigation">
            <ul id="toc" title="Table of Contents">
                <li><a href="#gaudi" title="Learn about Antoni Gaudí">Barcelona's Architect</a></li>
                <li><a href="#sagrada-familia" lang="es">La Sagrada Família</a></li>
                <li><a href="#park-guell">Park Guell</a></li>
            </ul>
        </nav>
    </header>

    <p>... [rest of page] ...</p>
</body> 
</html>

title元素为网页标题,title属性加上提示标签

learn about Antonic Gaudi为Barcelona’s Architect的标签内容
这里写图片描述

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值