H5+CSS复习笔记（全）
1.自结束标签和注释
通常标签都是成对出现，如<h1></h1>,<div></div>等等。但是又些标签是没有结束标签的，成为自结束标签，如<img>,<input>
<img>和<img />两种写法都正确。
注释是在代码中对代码进行解释说明的文字，注释中的内容会被浏览器忽略，在网页中看不到注释内容。（注释不能嵌套）
2.标签中的属性
可以在标签（开始标签或自结束标签）中设置属性，不能再结束标签内设置;
属性是键值对，形式为x=”Y”，一个标签可以有多个属性;
标签内属性要和标签名隔开，属性之间也要用空格隔开;
属性用来设置标签中的内容如何显示（大小，位置，色彩等都是属性）；
属性是官方规定标准的，不能随意编造，其值也不能乱写；
有些属性有值，二有的属性无值，只有属性键名。
3.文档声明
迭代——网页的版本：
HTML4-------->XHTML2.0-------->HTML5
文档声明（doctype）：用来告诉浏览器当前网页的版本，放在代码第一行，大小写无影响
<!doctype html>默认为HTML5版本
<!Doctype html> , <!doctype HTML >都对
通常的编辑器可以使用 !---->tab 快捷键快速生成网页结构代码
4.进制
10进制（日常使用），
2进制（计算机底层机制）：所有数据在计算机底层都会以二进制形式保存，可以将内存想象为由很多个小格子组成的容器，每一个小格子可以存储一个1或者0，这一个小格子在内存中被称为1位（bit）
8bit = 1byte（字节）
1024byte = 1kb（千字节）
1204kb = 1mb（兆字节）
1204mb = 1gb（吉字节）
1204gb = 1tb（特字节）
1204tb = 1pb
8进制（很少用），
16进制（一般在显示2进制数字时会转换成16进制）
5.字符编码
<meta/>自结束标签
所有数据在计算机底层都是以二进制形式保存，文字也不例外。所以一段文字在存储到内存中时都需要转化成二进制编码，当我们读取这段文字时，计算机会将编码转化为字符供我们阅读
编码：将字符转化为二进制编码
解码：将二进制编码转化为字符
字符集（charset）：编码与解码遵循的规则
乱码问题：编码与解码采用的字符集不同时会产生乱码
常见字符集：ASCII（美国） ISO88591（欧洲） GB2312(中国) GBK（中国扩展） UTF-8（万国码，在开发时使用的标准）
<meta charset=”utf-8” />设置网页字符集，避免乱码，只需要解析，不用显示，所以放在<head>标签内。Charset属性值在设定时必须与编辑器的编码格式一致
6.文档的使用
使用zeal进行离线文档查看
7.实体
在网页中，编写的多个空格会被浏览器解析成一个空格；
在HTML中有些时候不能直接书写一些特殊符号，会被浏览器错误解析，比如连续多个空格，字母两侧小于号大于号……
如果我们需要在网页中书写这些特殊符号，需要使用HTML中的实体（转义字符）；
转义字符用法：
&实体的名字;
例如： 表示一个空格
>表示大于号
<表示小于号
©表示版权符号
8.meta标签
作用就是设置网页的元信息，元信息是给浏览器看的。
常用属性有：
Charset ：指定网页的字符集
Name ： 指定数据的名称
Keywords:表示网站的关键字，可以同时使用多个关键字，关键字之间使用逗号隔开
Description:用于指定网站的描述，网站的描述会显示在搜索引擎的搜索结果中
title标签的内容会作为搜索结果的超链接上的文字显示
Content ： 指定数据的内容
http-equiv : 服务器在向浏览器发送文档之前会发送一些键值对信息提示卢兰其将要接受的文档信息，在使用带有http-equiv属性的meta标签时，服务器会把该键值对添加到要发送给浏览器的提示信息头部。
特殊情况：
<meta http-equiv="refresh" content="5;url=https:www.baidu.com"/>
<!-- http-equiv的值为refresh表示网页重定向，content里的5表示5秒后重定向，url为重定向的目标地址 -->
9.语义化标签
在网页中，HTML专门负责网页的结构，使用HTML时应该关注标签的语义，而不是样式。
h1 ~ h6：一共6级标题，重要性逐级递减，一般情况下一个页面中只会有一个h1，一般情况下只会使用h1 ~ h3
hgroup标签：给h标签分组，可以将相关的h标题放到一组
P标签：表示一个段落
Blockquote标签：表示长引用
块元素：在页面中会独占一行的元素，h1 ~ h6都是块元素，p元素也是块元素
Em标签：表示语音语调语气的加重
Strong标签：表示强调重要的内容
Q标签：表示短引用
行内元素（内联元素）：在页面中不会独占一行的元素，如em元素和strong元素
Br标签：表示换行
10.块元素（block）和行内元素/内联元素（inline）
Block：网页中通常使用块元素进行布局
Inline：主要用来包裹文字
块元素中什么都能放，行内元素中不能放块元素
P元素中不能放块元素
浏览器在解析网页时会自动对不符合规矩的内容进行修正：
比如：标签写在根标签外面
p元素中嵌套了块元素
根元素中出现了head和body以外的子元素
……
11.布局标签（结构化语义标签）
Header标签：网页的头部
Main标签：网页的主体部分，一个页面中只会有一个main
Footer标签：网页的底部
Nav标签：网页中的导航
Aside标签：和主体相关的其他内容
Article标签：一个独立的文章
Section标签：表示一个独立的区块
Div：块元素，没有语义，用来表示一个区块，目前是主要的布局元素
Span：行内元素，没有语义，一般用于在网页中选中文字
12.列表
HTML中列表一共有三种：
（1）有序列表
ol标签：创建有序列表
（2）无序列表（常用）
ul标签：创建无序列表
li标签：表示列表项
（3）定义列表
dl标签：创建定义列表
dt标签：定义的目标
dd标签：对目标解释的内容
列表之间可以互相嵌套
13.超链接
超链接可以帮我们从一个页面跳转到另一个页面
a标签（行内元素）：定义超链接
href属性：指定跳转的目标路径，属性值可以是外部网站的地址，也可以是内部页面的地址（目标文件的相对路径）
a标签中可以嵌套除了自身外的任何元素
14.
H5+CSS复习笔记（全）的更多相关文章
- css复习笔记
margin: 1. 当有三个值时第一个值为上,第二个值为左右,第三个值为下. 2.margin外边距折叠,水平没有,垂直会折叠,且折叠后以两者最大值为准.另外,当一个元素包裹另一元素时也会发生折叠. ...
- HTML+CSS学习笔记 (6) - 开始学习CSS
HTML+CSS学习笔记 (6) - 开始学习CSS 认识CSS样式 CSS全称为"层叠样式表 (Cascading Style Sheets)",它主要是用于定义HTML内容在浏 ...
- HTML+CSS学习笔记（5）- 与浏览者交互，表单标签
HTML+CSS学习笔记(5)- 与浏览者交互,表单标签 1.使用表单标签,与用户交互 网站怎样与用户进行交互?答案是使用HTML表单(form).表单是可以把浏览者输入的数据传送到服务器端,这样服务 ...
- HTML+CSS学习笔记（3）- 认识标签（2）
HTML+CSS学习笔记(3)- 认识标签(2) 1.使用ul,添加新闻信息列表 在浏览网页时,你会发现网页上有很多信息的列表,如新闻列表.图片列表, 这些列表就可以使用ul-li标签来完成.ul-l ...
- HTML+CSS学习笔记(2) - 认识标签（1）
HTML+CSS学习笔记(2) - 认识标签(1) 1.语义化,让你的网页更好的被搜索引擎理解 标签的用途: 我们学习网页制作时,常常会听到一个词,语义化.那么什么叫做语义化呢,说的通俗点就是:明白每 ...
- Html和Css学习笔记-html基础知识
我的邮箱地址:zytrenren@163.com欢迎大家交流学习纠错! 此篇博客是我的复习笔记,html和css学的时间太久了,忘得差不多了,最近要使用一下,所以重新打开html的书略读,后记录了标签 ...
- Html和Css学习笔记-html进阶-html5属性
我的邮箱地址:zytrenren@163.com欢迎大家交流学习纠错! 此篇博客是我的复习笔记,html和css学的时间太久了,忘得差不多了,最近要使用一下,所以重新打开html的书略读,后记录了标签 ...
- Html和Css学习笔记-html进阶-div与span
我的邮箱地址:zytrenren@163.com欢迎大家交流学习纠错! 此篇博客是我的复习笔记,html和css学的时间太久了,忘得差不多了,最近要使用一下,所以重新打开html的书略读,后记录了标签 ...
- Html和Css学习笔记-css进阶-盒模型
我的邮箱地址:zytrenren@163.com欢迎大家交流学习纠错! 此篇博客是我的复习笔记,html和css学的时间太久了,忘得差不多了,最近要使用一下,所以重新打开html的书略读,后记录了标签 ...
随机推荐
- UVIYN的基本设置
- HashMap解析（主要JDK1.8，附带1.7出现的问题以及区别）
按问题的形式来吧,这些大多是我自己总结的,如有错误请及时指正谢谢 1.你了解HashMap么,可以说说么? 首先,HashMap是一种数据结构,可以快速的帮我们存取数据.它的底层数据结构在1.7和1. ...
- IP 代理池
https://github.com/jhao104/proxy_pool 安装依赖 pip install -r requirements.txt 配置 Config/setting.py # Co ...
- 6、react中的交互
1.ajax 再react中使用ajax和直接使用ajax的用法是完全一样的,只要找好路径即可,但是也有不一样的地方,再react中是通过改变状态state来达到让组件重新渲染的效果,并且放ajax的 ...
- Idea创建Scala的Maven项目
Idea版本(2018.1.5) Scala版本(2.11.0) Java版本(1.8.0_151) 创建Scala的Maven项目 Idea新建项目如图,输入GroupId和ArtifactId之后 ...
- 02.DRF-认识RESTful
认识RESTful 在前后端分离的应用模式里,后端API接口如何定义? 例如对于后端数据库中保存了商品的信息,前端可能需要对商品数据进行增删改查,那相应的每个操作后端都需要提供一个API接口: POS ...
- UniRx精讲（二）：独立的 Update &UniRx 的基本语法格式
独立的 Update 在 UniRx 简介的时候,笔者讲了一种比较麻烦的情况:就是在 MonoBehaviour 的 Update 中掺杂了大量互相无关的逻辑,导致代码非常不容易阅读. 这种情况我们平 ...
- python基础内容整理（一）
基本数据类型 字符串 String 字符串是不可变类型 字符串的分割: s.split(sep)以给定的sep为分隔符对s进行分割. In [4]: s = "hello world&quo ...
- umi 调试
最近在umi. 设置一个layout字段, 结果左边菜单栏就出现了. 很神奇. 决定对这个库一探究竟. 我是一个喜欢看底层库的人,网上所有的启动方式都是yarn或者npm start 启动服务.然后 ...
- SQLserver 的分页存储过程
-- 1.建立修改学生数据的存储过程 -- 2.建立根据班级Id和学生姓名模糊查询的分页存储过程,要求正确输出总记录数,总页数-- (输入班学生姓名 计算总记录数 计算总页数) -- @name ...