关闭

初识html5之基本html结构

标签: html5
219人阅读 评论(0) 收藏 举报
分类:

先上代码再说说学习的一点疑问

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8"/>
</head>
<body>
<header role="banner">
<nav>
<ul>
<li><a href="#girl1">the first girl</a></li>
<li lang="es"><a href="#girl2">the second girl </a></li>
<li><a href="#girl3">the third girl</a></li>
</ul>
</nav>
<header>
</body>
</html>

这段代码就是复习了以下之前学习的li 记得是列表项 至于这个ul百度了以下说是无序列表感觉就和java里面的set 一样,应该也有一个有序的把,好吧这不是重点。

body里面的主体是<header>,这个就是一个顶部的标题栏(书上说是一个页眉)还有一个对应的footer与之相呼应。role是它的属性role="banner"书上说它显示的指出该页眉

为页面级的页眉,我去,感觉像没说一样,据说可以提高访问性,反正我是一脸蒙蔽。这个地方暂时先忽略把

 

<nav>是一个导航栏,上一篇里面的header,nav,article ,footer四大部分是分开的,没想到这里面header里面嵌套了一个nav,可想而知里面有很多的东西都是可以嵌套的。

补充一点<nav>这个元素不是随便乱用的,只有重要的连接群才会放在<nav>元素里面,在网站建设中应该将一组可以到达网站内部其他页面的链接加上nav,对就是这样的。                                      

<a href="#girl1">以前只是 见过这种写法<a  href=http://www.baidu.com></a> 里面是一个url 大家都知道,可是很显然这个#gril明显不是一个url 看了一下书籍后面的内容

有这样一组代码

<article id="girl1">the first girl is beatiful and clever ,but she don't like you .you like her</article>
<article id="girl2">the second girl is not so beautiful but you has many words say to her ,she like you ,but you like the first girl</article>
<article id="girl3">the third girl is not so beatiful ,and  you don't has the same words with her ,she is your wife.</article>

 

article里面的东西引用了上面的href里面的值,可以看出当点击链接的时候会跳转到这里,应该是文章内的一种内部链接把,这里再来详细说说<article>这个元素把,在我的理解中article就是一个网站的主体部分,内容部分,书上说:article 元素表示文档,页面,应用,或网站中一个独立的容器(它说是一个容器不就是div吗,是不是什么都可以放)原则上是可以独立分配或者再使用的,它就像聚合内容的各部分,它可以是一篇论文帖子,一篇杂志,或者一个交互式的小部件或者小工具(还可以是一个交互式的工具有点神啊)刚刚学习的时候还是有很多不明白的地方,不过不能专牛角尖,很多东西学到后面就能明白了。

后面还有一个<main>元素,不能将main 放置在article,aside,header,nav这些元素中,也就说它是独立存在的,是不能够被嵌套的。而且每一个页面只能显示一个main元素,类似Java的main函数一样,唯一性。                                         

后面还讲了一个section 元素我就不上代码了这些都是一些简单的语法 就是用于分类的。

还有一个<aside>元素是一个附注 栏,什么意思呢,就是与主题内容联系不大的,类似广告的那些东西把 aside元素一般都是在article元素的外面,提供一些附加的信息,不过也是可以放在artilce里面的,不过一般用的比较少,但是有一点aside元素是不可以不嵌套在address的元素中的,好了今天就写到这里面了,时间不早了,bye!                                                                                                                                                                                                                                                                                                                                                             

0
0

查看评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
    个人资料
    • 访问:9131次
    • 积分:282
    • 等级:
    • 排名:千里之外
    • 原创:14篇
    • 转载:15篇
    • 译文:0篇
    • 评论:2条
    最新评论