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的书略读,后记录了标签 ...
随机推荐
- springboot集成mybatis(逆向工程),热部署以及整合Swagger2
本文是作者原创,版权归作者所有.若要转载,请注明出处. springboot集成mybatis和mybatis-generator插件 1.新建Springboot项目(略) 2.导入相关依赖 < ...
- Go语言json编码驼峰转下划线、下划线转驼峰
目录 一.需求 二.实现 三.使用 JsonSnakeCase统一转下划线json JsonSnakeCase统一转驼峰json 一.需求 golang默认的结构体json转码出来,都是大写驼峰的,并 ...
- [原创][开源] SunnyUI.Net 更新日志
SunnyUI.Net, 基于 C# .Net WinForm 开源控件库.工具类库.扩展类库.多页面开发框架 Blog: https://www.cnblogs.com/yhuse Gitee: h ...
- 小技巧：如何用 Chrome 将 SVG 转成 PNG
怎么把 SVG 转成 PNG ?用 Chrome 吧,非常好用,还能设定自己想要的尺寸. 什么是 SVG ? SVG (Scalable Vector Graphics,可缩放矢量图形) 是基于 XM ...
- numpy.random.randn()与numpy.random.rand()的区别
numpy中有一些常用的用来产生随机数的函数,randn()和rand()就属于这其中. numpy.random.randn(d0, d1, …, dn)是从标准正态分布中返回一个或多个样本值. n ...
- 03.Java的前世今生
C&C++ 1972年C诞生 ◆贴近硬件,运行极快,效率极高. ◆操作系统,编译器,数据库,网络系统等 ◆指针和内存管理 1982年C++诞生 ◆面向对象 ◆兼容C ◆图形领域.游戏等 背景 ...
- css布局中的垂直水平居中对齐
前言 我们都知道,固定高宽的div在网页中垂直居中很简单,相信大家也很容易的写出来,但是不是固定高宽的div如何垂直居中呢?我们在网页布局,特别是手机等web端网页经常是不固定高宽的div,那么这些d ...
- Spring：扫描组件
<context:component-scan>:扫描组件,对设置的包下面的类进行扫描,会讲加上注解的类作为Spring的组件进行加载 组件:指Spring中管理的bean 作为Spr ...
- 附020.Nginx-ingress部署及使用
一 手动部署-官网版 1.1 获取资源 [root@master01 ~]# mkdir ingress [root@master01 ~]# cd ingress/ [root@master01 i ...
- C#数据结构与算法系列（二）：稀疏数组（SparseArray）
1.介绍 当一个数组中大部分元素为0,或者为同一个值的数组时,可以使用稀疏数组来保存该数组. 稀疏数组的处理方法是: 1.记录数组一共有几行几列,有多少个不同的值 2.把具有不同值的元素的 ...