一、HTML部分
1、网页结构:
<!DOCTYPE html> //文档声明 写在所有代码之前 按照html规范来编写内容,浏览器编译 也要按照规范来编译 免得出现乱码.
<html>
<head></head>
<body></body>
</html>均为网页标签//标签 又叫元素 单标签 双标签双标签是又开始有结束标签 写在标签内的内容 就在开始和结束标签内。
html标签又叫根标签 一个页面只有一个跟标签 所有标签都在根标签内
head标签 双标签 头部分 浏览器解析不到 辅助浏览器解析到代码
body标签 双标签 主体部分 书写网页主题内容 所有用户看到内容都在body标签内
html直接包含head和body 关系是父子关系
祖先关系 html包含所有标签 所以html就是所有标签的祖先关系
meta标签为单标签 两种写法 <mata> <meta /> 主要是配合属性以及对应的属性值来帮助浏览器解析页面和代码
属性:写在开始标签或者单标签内部。
属性值:写在属性后 双引号后面 charset="utf-8" charset 字符集属性 用来设置编码的语言 设置密码本 utf-8是万国码 字符集种类
GB 国标
GBK 国标拓展版
编码和解码过程
编码 将字符 图片 音频都转成二进制存起来
解码 将存起来二进制转回去
乱码 编码和解码用的不是一套 就会出现乱码
title 网页的标题 出现在网页标题栏中 更重要的是帮助浏览器检索我们的页面,帮助推广部门推广网站 推广部门sem主要做竞价推广 seo做搜索引擎优化 不花钱得推广。
2、实体部分
1、什么是实体
在浏览器中 有一些特殊的符号被征用了 不能直接去使用 如果非要用 需要用另外的字符去替代 这些字符就叫实体
2、实体语法;&+实体名字;
3、常用的实体
;空格
>; 大于号
<; 小于号
©;版权
3、常用html标签
1、标题标签 h1 --h6
语义:包裹内容
作用:帮助seo推广 语义作用仅次于title
而且h1-h6语义逐步降低 h1语义最重 一般情况下一个页面只有一个h1 我们常用的是h1 - h3
默认样式:字体有加粗 h1-h6 字体是逐步减小的 标题标签是独占一行的 还有行于行与较大间隔。
2、段落标签:p
语义:表示内容中的一个自然段
默认样式:独占一行 行于行有较大的间隔 特殊的标签 只能用来包裹文字或者图片。
3、hgroup标签 用来标题分组 可以将有关系的标签放在一起,样式上没有区别。
4、em标签:强调标签
语义:时表示一个加重 强调 语音语调的强调
默认样式:字符斜体 不会独占一行
5、strong标签 表示强调 表示内容强调 内容重要性的强调
默认样式 字符加粗 不会独占一行
6、blockquote 引用别人的话 长引用 会换行
7、q 短引用 默认样式 加了双引号
8、换行标签 br 强制换行
9、分割线 hr
10、del标签 删除内容
11、center标签 剧中小股票 块元素 独占一行
12、div 布局没有意义的快元素 独占一行
<div>
我是一个盒子
</div>
13、span 没有意义 用来包裹文字 不会独占一行
<span>我是一个盒子</span>
14、结构标签:
header 一般情况一个页面只能有一个header main footer
nav 网页导航区
aside和主体相关的内容 侧边栏
article 文章之类的
section 独立的区块 上面的标签都不适合就用这个 就相当于div 没有任何语义
banner 网页的版心
使用方法:
<header>网页头部
<div>顶部
<nav>左侧</nav>
<div>右侧</div>
</div>
<div>快速</div>
</header>
<main>主题</main>
<footer>底部</footer>