day-21
html
1.认识标签
1.1标签的语法
(1)语法
- 双标签:<标签名 属性名1=属性值1 属性值2=属性值2 ...>标签内容</标签名>
- 单标签:<标签名 属性名1=属性值1 属性值2=属性值2 ...> 或者 <标签名 属性名1=属性值1 属性值2=属性值2 .../>
(2)说明
标签名
- 标签名不能自己命名,而是使用当前html版本提供的标签名;不同的内容对应的标签名不一样
- 哪些标签是单标签哪些标签是双标签,是固定的
- 标签名前不能随便加空格
属性
- 哪些标签有哪些属性是确定的,属性名和属性值之间用=连接,多个属性之间用空格隔开
- 如果有多个属性,属性顺序可以随意
- html中所有属性的值都必须用引号引起来,不管什么类型
标签内容
- 指的是双标签开始标签和结束标签中的部分;
- 双标签的内容中可以放任何东西(可以是文字,也可以是别的一个或多个标签)
2.head中的标签
meta
—— 元数据,主要做一些网站设置性的工作
title
—— 设置网页标题
link
—— 导入文件(设置网页图标,导入外部样式)
设置网页编码方式
<meta charset="utf-8"
设置网页图标
<link rel="icon" type="image/ico" href="./img/aaa.ico"/>
-
rel
—— 被导入的文件的作用,例如:stylesheet(样式标)、icon(网页图标) -
type
—— 对被导入的文件的类型进行说明,文件类型/文件后缀; text/css(文本文件,后缀是.css) -
href
—— 文件路径
3.文本标签
1.标题标签
当文本内容意义是标题时才选择标题标签
<h1>我是标题1</h1>
<h2>我是标题2</h2>
<h3>我是标题3</h3>
2.段落标签:p
一段文字如果表示一个段落就用p标签
3.网页中的换行和空格
在html中手动输入换行和空格无效
1.强制换行:
在网页中需要强制换行的位置加<br>
2.空格符号
 
- 空一个像素
&emsp
- 空一个空格
4.font标签
表示一段文字,这段文字可以和别的网页内容同行显示
5.水平线:
- 单标签
6.文字效果
- 加粗:b标签和strong标签,strong有强调的意思
- 倾斜:i标签和em标签,em有强调的意思
2.列表标签
网页中多个内容的意义是一样,或者表示一个分类下的具体内容等...
1.无序列表:ul标签,li标签
-
ul
—— 代表整个容器 -
li
—— 代表列表中的元素
2.有序列表:ol标签,li标签
-
ol
—— 代表整个容器 -
li
—— 代表列表中的元素
3.自定义列表:dl标签,dt标签和dd标签
-
dl
—— 代表整个容器 -
dt
—— 代表分组名 -
dd
—— 代表每个元素
3.图片和超链接
1.图片标签: img - 单标签
- src属性 - 图片地址(可以是网络图片地址也可以是本地图片地址)
- title属性 - 设置图片标题
- alt属性 - 图片加载失败后的提示语言
2.超链接: a
可以点击后跳转到其他网页的内容基本都是超链接
<a href="">标签内容</a>
(1)标签内容 - 决定点谁可以跳转; 文字超链接, 图片超链接
(2)href属性 - 决定跳转到哪个位置
- 网络地址 —— 跳转到指定页面
- 本地html文件地址 —— 跳转到指定的本地页面
- 选择器 —— 在当前页面中跳转到指定位置
- 空 —— 刷新页面(有兼容性问题)
(3)target属性
- _self(默认) —— 在当前页面中加载新的内容
- _blank —— 在新的页面中加载新的内容
4.表格标签
1.table标签 - 代表整个表格
- border属性 —— 边框线的大小
- cellspacing —— 单元格与单元格之间的间隙
- align —— 设置对齐方式:lefr(默认)\right\center; 设置整个表格在其父标签中的对齐方式
- width —— 设置整个表格的宽度(单位是像素)
- heigth —— 设置整个表格的高度
- cellpadding —— 设置内容到单元格上下左右之间的间距
- bordercloor —— 表框的颜色
- bgcolor —— 设置整个表格的背景颜色
2.tr标签 - 代表一行
- align —— 设置当前行中所有单元格中的内容的对齐方式:lefr(默认)\right\center
- height —— 设置当前行的高度
- bgcolor —— 设置一行的背景颜色
3.td标签 - 代表一个单元格
- align —— 设置当前单元格中的内容的对齐方式:lefr(默认)\right\center
- width —— 设置当前单元格所在的列的宽度
- bgcolor —— 设置当前单元格的颜色
4.补充: html中的颜色
(1)颜色单词; 例如:red, blue等
(2)#RGB十六进制, 0~255 -> 00~ff