基础
day01
1-认识网页:
- 结构(html) 毛坯房
- 表现(css) 装修
- 行为(javascript) 智能家居
- html(hyper text markup language):超文本标记语言
- 超文本：加了超链接的文本
- 标记：能够让浏览器识别的一种标识
2-认识结构
- doctype 声明文档类型为html5,一般放在第一行
- html根元素,只有一个,lang是告诉浏览器当前的开发语言是什么，可以设置也可以不设置，因为浏览器可以识别到的
- head 头部，只有一个
- charset="UTF-8": 应该让浏览器按照UTF-8的编码格式去解析，存的时候是utf-8，让浏览器解析的时候也得是utf-8,不然就对不上号的话，就会出现乱码
- charset:设置字符
- title 网页的标题
- body主体，只有一个，一般将文字和图都放到该单词中间
- 只要是个网页-都会有结构文件(.html)-只要是个结构文件都会有最基本的结构
- html注释：在编辑器能看到，但是浏览器上看不到 ctrl+/ 可以注释的内容
3-html语法
- 标记/标签/元素：尖括号中的第一个单词
1.双标签：成对出现的标签，第一个出现的叫做开始标签，后面的叫做结束标签结束标签前面一定要带/
2.单标签：单独出现的标签，也是可以带标签的，/可带可不带
- 属性：放在开始标签里面，标签后面用空格隔开的单词
1.属性名和属性值之间用=连接，属性值一般用引号引起来
2.一个标签可以有多个属性，多个属性之间是没有顺序的
- html标签不区分大小写，但是推荐小写
4-文本类的标签
- 文章标题 h1-h6
特点：双标签/字体加粗且逐渐变小/独占一行
- 段落 p
特点；双标签/独占一行
- 加粗 b/strong
语义上有区别，strong表强调
- 倾斜 i/em
语义上有区别，em表强调
- 下划线 u/ins
语义上有区别，ins表强调
- 删除 del
- 上标 sup
- 下标 sub
- 强制换行 br:单标签
用tab键来换 br（带尖括号）+tab
- 水平线 hr:单标签
5-特殊字符
- 一个英文的空格
- 一个汉字的距离
6-图片标签
- src:图片路径/地址
1.绝对路径:在线图片地址
2.相对路径
- alt:图片未加载成功的提示文字，成功则不提示
- title:当鼠标悬停在图片时候的提示文字
- width:图片宽
宽度发生改变，高度等比缩放
- height:图片高
高度发生改变，宽度等比缩放
7-图片的相对路径
- 当你和你要找的图 是同级的情况下，直接写图片名.后缀
- 当你和你要找的文件夹是同级，先进到同级的文件夹里面，再找图片
- 当你所处的文件夹和图片的文件是同级的时候，先出去../出到同级文件下，再进去找
8-超链接标签
- 超链接标签a
href:跳转地址
target:窗口打开方式
day02
1-超链接的功能
- 点击文字跳转在线网页
- 点击文字跳转本地网页
- 点击图片跳转网页
- 下载文件：如果浏览器不能执行或者跳转，就会执行下载操作
下载压缩包
下载安装包
- 不写地址：执行刷新页面操作
- 写#，会执行回到顶部的操作
2-列表标签
- 无序列表 ul li
应用场景：新闻列表、网页导航
- 有序列表 ol li
ol的属性 type="1/a/A/i/I"排序方式
start="数字" 排序起始位置
- 自定义列表 dl dt dd
注：dt dd 是同级
应用场景：上面是图片，下面是文字
- 快捷生成列表键
- ul>li*数字 回车
- ul>li*数量{内容}
- ul>li*数量>a{内容}
3-表格标签
- border="数字" 边框粗细
- bordercolor="颜色" 边框颜色
- width="数字" 表格宽
- height="数字" 表格高
- bgcolor="颜色" 背景色
- align="left/center/right" 表格水平位置
- cellspacing="数字" 单元格的间距
- align="left/center/right" 整行文字水平位置
- valign="top/bottom" 整行文字垂直位置
- 列标签 td
1.align="left/center/right" 该单元格内文字水平位置
2.valign="top/bottom" 该单元格内文字垂直位置
- 3行3列表格
table>tr*（占位）3 > td*3
- 表格标签
- 表格标题标签 caption
- 表格列标题标签
th 注：居中且加粗
- 表格行分组标签
thead表头
tbody表体
tfoot表尾
默认不分组都在表体里面
4-表格的合并
