Web前端の誓师(完结)

学了好久的 PHP 想伸手试试前端的开发弥补一下…

在 腾讯课堂 搜到点web前端开发的视频【妹子学院(麦子学院)】,先这样看着。最近新认识的菊苣们也有好多搞前端开发的OAQ,有问题直接会去扒他们((*^__^*) 嘻嘻……)。
web前端の誓师

反正呢~先开始学了。

HTML是一个灰常简单的解释型文档,他不做任何处理,只是解析。HTML5是HTML第五次更新的一个产品。

用简洁的代码实现更多的功能,增加了很多语义化等。

为开发人员节省时间,为开发人员叠被子(兼容性强!)

有着国际化的标准,结构清晰。

抛弃了上一代不符合实际的功能。一切以符合人类习惯为主。

新增加的元素(基础哦!)

<!DOCTYPE html>
<!--注释,HTML5新的结构如下-->
<html>
<head lang="en">
<meta charset = "utf-8">
<title></title>
</head>
<body>
<header></header>
<nav>导航栏<nav>
<article></article>
<section></section>
<aside></aside>
<footer></footer>
</body>
</html>

<article> 标签定义外部的内容。

外部内容可以是来自一个外部的新闻提供者的一篇新的文章,或者来自 blog 的文本,或者是来自论坛的文本。亦或是来自其他外部源内容。独立的完整的内容用这个

 

<section> 标签定义一个块

标签定义文档中的节(section、区段)。比如章节、页眉、页脚或文档中的其他部分。并非是简单的容器元素,当需要被直接定义样式更推荐<div>元素!对页面上的内容进行分块不要和<article>混淆。文章分段也可以用的!

最后不要为没有标题的区块、需要直接定义样式的用这个元素!

另附个HTML5的验证工具 传送口到 https://gsnedders.html5.org/outliner/
<article>
<header>
<h1></h1>
<p></p>
</header>
<section>
<h2></h2>
<p></p>
</section>
<section>
<h2></h2>
<article>
<p>
<dl>
<dt>计算机</dt>
<dd>用来计算的仪器 ... ...</dd>
<dt>显示器</dt>
<dd>以视觉方式显示信息的装置 ... ...</dd>
</dl>
</p>
</article>
</section>
<article>

之后

<aside>包含和主题内容相关的元素

<aside> 标签定义 article 以外的内容。aside 的内容应该与 article 的内容相关。eg.与文章有关的参考资料,资料卡等…也可以在网站上面写个公告什么的。(页面附属信息系列!)

 

<nav>做导航栏元素

<nav>用作页面上面的导航栏!<nav> 标签定义导航链接的部分。!不过用来做<nav>子项建议使用有/无序列表!<ul><li></li></ul>。适用场合:传统的导航条、侧边导航栏、页内导航、翻页操作。

 

pubdate 作为 <time>的一个元素用来描述这个页面、文章或博客데文章不是时间

<header>作为非主题元素!不限制出现次数,也可以作为一个区块的标题!可以至少包含一个标题元素 h1 header hgroup nav等。

关于<hgroup>元素将标题进行分组!单个文章的标题是不需要的!

<adsress>用来呈现页面中的地址联系信息

 &lt;footer&gt;
  &lt;address&gt;
    ShellV
    2015.2.12
  &lt;/address&gt;
&lt;/footer&gt;

figure 元素

<figure> 标签规定独立的流内容(图像、图表、照片、代码等等)。

figure 元素的内容应该与主内容相关,但如果被删除,则不应对文档流产生影响。

请使用 <figcaption> 元素为 figure 添加标题(caption)。

<figcaption> 标签定义 figure 元素的标题(caption)。

“figcaption” 元素应该被置于 “figure” 元素的第一个或最后一个子元素的位置。

<mark>元素(用来高亮的显示)

这是高亮的 和 <em>元素还有<strong>无关,只是与原作无关的!!!

<progess>元素,代表一个任务的完成进度(进度条),value元素(完成数)max(最大数)

发布者

ShellV

高中狗、喜欢前端、运维、AcgBag 动漫社区创始站长

《Web前端の誓师(完结)》有10个想法

发表评论

电子邮件地址不会被公开。