body内常见标签补充
块儿级标签
div
行内标签
span
(上述两个标签主要用于页面的前期结构布局)
标签与标签直接可以相互嵌套(理论上可以无限嵌套)
<div>
<div></div>
<a></a>
<p></p>
</div>
块儿级标签可以嵌套块儿级标签和行内标签
特例:<p>标签虽然是块儿级标签但是它不能嵌套块儿级标签
行内标签只能嵌套行内标签
(科普:前端不会轻易的报错(因为前端是直接跟用户打交道的 注重用户体验)
input标签
value参数
相当于默认值
本质:用户数据其实都是由value参数存储
(用户在输入框中输入了jason其实就相当于value=jason)
placeholder参数
相当于提示信息
针对radio和checkbox可以默认选中
checked参数
checked='checked'
(在html中如果标签的属性名和属性值相等 那么可以简写)
简写 checked
select标签
option子标签
selected='selected'
简写 selected 默认选中
form标签
action参数
用来控制数据提交的地址
novalidate参数
取消浏览器的校验动作
(后续重要参数爬虫课程再介绍)
button标签
如果写在了form表单的内部 那么也可以出发提交动作
(能够触发form表单提交数据的标签有两个
<input type='submit'/>
<button></button>)
主要功能:使用户就近获取所需内容,降低网络拥塞,提高用户访问响应速度和命中率
(有些常见的软件各大互联网都开设了免费的CDN服务)
eg:前端相关CDN服务 >>> https://www.bootcdn.cn/
(要想使用CDN的前提是你的计算机必须时刻有网络""")
(前端永远都是你抄我我抄你 其乐融融)
css就是用来调节html标签样式的
1.语法结构
选择器 {
属性名1:属性值1;
属性名2:属性值2;
}
2.语法注释
/*注释内容*/
3.css引入方式
1.style标签内部直接书写
<style>css代码</style>
2.link标签href属性引入外部css文件
<link href='css代码' rel='stylesheet'></link>
3.在标签内部直接书写
<p style='css代码;'></p>
(上述三种方式最正规的是第二种引入外部css文件)
(为什么不直接学习调节样式而学选择器 因为页面上相同的标签太多了)
# 基本选择器(重要)
1.标签选择器(直接写标签名称即可)
p {
color:red;
}
2.类选择器(书写标签class属性值并在前面加点)
.c1 {
color:blue;
}
3.id选择器(书写标签id属性值并在前面加#)
#d1 {
color:black;
}
4.通用选择器(了解 指代所有的标签)
* {
color:green;
}
# 组合选择器(重要)
"""
在前端我们如何表达标签之间的嵌套关系
关键点就看嵌套的层级
<div>
<div>是外面div的儿子 内部a的父亲
<a>是外面div的儿子 外外面div的孙子</a>
</div>
<a>是外面div的儿子</a>
<p>是外面div的儿子</p>
</div>
"""
1.后代选择器
2.儿子选择器
3.毗邻选择器
4.弟弟选择器