HTML、CSS和JavaScript入门经典 学习笔记(01)

110 阅读2分钟

引入

Day 1

系统学习一下网页开发的基本知识,查缺补漏

在此贴出需要注意的知识点,方便查阅。

知识点记录

HTML必须包含的元素

每个Web页面都必须包括一个<!DOCTYPE>声明,还有<html></html>、<head></head>、<title></title>、<body></body>标签对。(不要忘记重要的title标签)

<!DOCTYPE html>就是HTML5的声明

标签知识

开始标签,比如<html>

封闭标签,比如<html/>

空标签,比如<img/> 在H5标准下,空标签的/可以省略,但习惯上保留

HTML代码中额外的空格会被缩减为1个空格,换行符同样无效

若有需要换行可以使用<br/>或css格式

H5的语义元素

HTML5包括一些标签,它们可让你增强在标记过的文本中所提供信息的语义。

<header>

应该用作介绍性信息的容器,因此在页面中只可能出现一次(很可能位于顶部),但是如果把页面内容分成多个区域,那么也可能多次使用它(作为某个容器的介绍信息)。

可以包含流式内容类别中的其他元素。

但不能包含<header>,也不能包含或被包含<footer>

<footer>

用于包含关于其包含元素(页面或区域)的额外信息,比如版权和作者信息。

<nav>

导航元素应当放置于<nav>标签中,<nav>标签也常置于顶部的<header>标签内。

<section>

标签定义文档中的节(section、区段)。比如章节、页眉、页脚或文档中的其他部分。所以可以用来包含<footer>标签等。(用于对网站或应用程序中页面上的内容进行分块)

<article>

和上个标签相似。但<article>是一个独立的作品体系,而<section>则是一个主题信息组。(代表文档、页面或应用程序中独立的、完整的、可以独自被外界引用的内容)

<aside>

使用<aside>标签指示次级信息。有时候可以作为页面的侧栏容器,或者<section>中的次级信息。(或者说某个容器内需要一个PS:xxx就可以用此标签)


多个语义化元素可以嵌套使用,表达更加丰富的语义。

某个参考结构如图(不必拘泥于此结构):

image.png