第四章网页

day 04
知识回顾
1、thead、tbody和tfoot的含义
thead、tbody和tfoot可以使表格的结构更加个所
thead是表格的头部(页眉)
tbody是表格的主体(主要内容)
tfoot是表格的底部(页脚)
2、文本框、密码框、单选框、多选框、提交按钮、下拉列表
<form action="#">
<!-- 文本框-->
<input type="text">
<!-- 密码框-->
<input type="password">
<!-- 单选框 -->
<input type="radio">
<!-- 多选框 -->
<input type="checkbox">
<!-- 提交按钮 -->
<input type="submit” value="提交”>
<!-- 下拉列表-->
<select name="" id="">
coption value=""></option>
coption value=""></option>
coption value=""></option>
</select>
</formm
3、单选框与多选框设置默认选中使用哪个属性
checked
4、下拉列表设置默认选中使用哪个属性
selected
5、有一个class名称为box的盒子，需要给其所有的子孙后代的a标签添加文字颜色为红色，代码如何写?
.box a {
color:red;
6、简述什么是盒模型?
所有元素都具有盒模型，盒模型也叫做框模型，包含：内容、内填充、边框和外边距。总宽和总高的计算
7、解释padding：20px50px的含义
设置上下的内填充是20像素，左右的内填充是50像素
8、border-style:solid double dotted dashed的含义
上边框是实线、右边框是双线、下边框是点状虚线、左边框是虚线
9、如何去掉边框
border:0;
border:none;
10、如何用边框制作三角形?
width:0;
height:0；
border:100px solid;
border-color:transparent red transparent transparent;
/*兼容*/ I
font-size:0;
line-height:0；
11、背景属性的简写顺序
background:background-color background-image background-repeat background- position;
补充：
1、复合选择器
伪类选择器
作用：给元素添加特殊效果的
链接伪类
a:link /*未访问时的链接效果*/
a:visited} / 已经访问过的链接效果*/
a:hover() /鼠标悬停时的链接效果*/
a:active() /*鼠标按住不放时的链接效果*/
链接伪类的书写顺序必须按照Ivha的顺序来写，否则可能出现问题
(1):hover
element:hover {
/*css样式*/
/★ .box:hover 
background-color: yellow;
}*/
鼠标移入到class名称为box的元素身上，改变自己的背景颜色为黄色• 鼠标悬停时改变子元素的样式
element1:hover element2 {
/*css样式*/
.box:hover p {
color:blueviolet;
鼠标移入到class名称为box的元素身上，改变子元素的文字颜色为紫色(2)：active
• 鼠标按住不放时改变自己的样式
element:active 
/“css样式*/
2、前景图与背景图的区别：
• 书写位置：img写在body中，背景图写在样式表中
占位与不占位：前景图是占位的，背景图是不占位的
• 前景图有实际含义的，而背景图没有实际含义，只是起到装饰作用• 前景图可以被搜索引擎搜索到，而背景图是不可以的
一、CSS的三大特性
1、css层叠性
是指多种css属性的叠加
样式不冲突
样式不会层叠，会叠加
样式冲突
同一个元素身上拥有两个以上的相同属性时，会发生css样式的层叠就近原则(离元素近的样式会生效)