标签:布局 解释 orange 相同 数字 put 前台 标记语言 ora
## 复习
```python
"""
1、html:
标记语言:解释性,没有逻辑(有无效果)
常用标签(指令<!...>、转义字符&...;、标签<英文数字->)
h1~h6 p a img div span i b ul>li table>tr>th|td form>input|select(option)|textarea|button|label
嵌套关系(架构):div完成主架构、span完成同行文本架构 -> 具体内容选取具体标签
2、css:
标记语言:解释性,没有逻辑(有无效果)
引入方式 (行间式、内联式、外联式)
选择器:!important > 行间式 > id > class > 标签 > *
学习三个方向:引入方式、选择器、具体样式
"""
```
## 今日内容
```python
"""
css:重点 - 选择器、布局
高级选择器
伪类选择器
常用样式
三种布局方式
"""
```
## form提交方式:了解
```python
"""
get: 不安全的提交数据,高效
post: 安全的提交数据,低效
前台都可以给后台提交数据,后台一定会给前台一个反馈结果
"""
```
## 选择器高级
```css
/*选择器高级:基础选择器的各种组合*/
/*1、群组选择器:控制多个*/
/*注:每一个选择器位,可以为id、class、标签、选择器组合*/
#h1, .p, .a {
color: red;
}
/*2、后代(子代)选择器:控制一个标签,前方的都是修饰*/
body .div2 .p2 { /*后代 空格,父子(孙)*/
color: orange;
}
.div2 > div > .p2 { /*子代 >,父子*/
color: pink;
}
/*高级选择器通过权重(个数)区别优先级:*/
/*3、兄弟(相邻)选择器:控制一个标签,前方的都是修饰*/
.p3 ~ .i3 { /*兄弟 ~,可相邻也可不相邻,但必须通过上方修饰下方*/
color: greenyellow;
}
.div3 + .i3 { /*相邻 +,必须相邻,但必须通过上方修饰下方*/
color: green;
}
/* 高级选择器优先级
前提:多个选择器控制同一个标签
无限大于:id > class > 标签 eg:一个id选择器 高于 n和类与标签选择器的组合
种类相同:比个数 eg:两个先比较id的个数,谁多谁优先级高,相同再比较类,以此类推
个数相同:比顺序 eg:所有类型所有个数(id、类、标签)都相同,下方的起作用
高级选择器种类不影响优先级 eg:后代选择器、子代选择器、兄弟选择器...不会运行优先级
*/
```
python51 css重点 1.选择器 2.布局
标签:布局 解释 orange 相同 数字 put 前台 标记语言 ora
原文地址:https://www.cnblogs.com/llx--20190411/p/11116245.html