1.form表单:实现洪湖与wen服务器的交互
请求server端方式:
get
post
请求协议
浏览器(客户端) ===》 服务端
url
请求首行
请求头
换行
请求数据
if get:
url? data
get请求:安全性差,数据量有限制。 一般用在正常的查询。
哪些是get请求:
1.url 访问 server
2.超链接访问 即 a 标签
if post:
请求数据
关于表单两个属性:name:作为发送端的的建 vlaue:作为发送端的值
css(层叠样式表)
1基本选择器
1.标签选择器
p{}
2.id选择器
#info{}
3.class选择器
.info{}
4.通配选择器
*{}
2.组合选择器
1.后代选择器
.c2 p{}
2.子代选择器
.c2>p{}
3.毗邻选择器
.c2+p{}
4.兄弟选择器
.c2~p{}
5.多元素选择器
1,选择器的优先级
规则外:
important
规则内:
内嵌> id(100)>class(10)>element(1)
2.继承:
优先级级别最低
继承字体相关样式
3.css(层叠样式表):对html标签的渲染和布局
1.查找标签
选择器
基本选择器
组合选择器
属性选择器
1.关于文本操作:
颜色color:
:red and #ff0000 RGB(255.0.0)
位置text-align:
text-align:left and right and center and justify;
垂直居中(设置行高):
line-height:400px;
设置透明度:opacity
opacity:0.4;
2. 操作标签(属性操作)
布局关键点:如何能让可以调节长宽的元素(标签)在一行显示。
float:left;
内外边距:
边框(厚度):border
填充(四边的宽度):padding
1. padding-top : 上方
padding_right: 右边
padding: 50px 20px 10px 10px; 顺时针
padding: 50px; 四个方向
padding: 50px 20px 上下 左右
padding: 50px 20px 40px 上 左右 下。
调整两个盒子<div>的距离:margin
2.margin
margin:50px;
用在内联标签内或者 浮动的。
盒子左右居中:margin: 0 auto;
1.文本其他属性。
1.vertical-align: -4px; 设置对齐,
2.font-family:字体; 字体类型
3.text-decoration:none; 取消超链接的下划线
4.font-weight: lighter/bold/bolder 字体的粗细
5.font-style: oblique; 斜体
6.text-ident:150px; 首行缩进
7.letter-spacing:10px 字母间距
8.word-spacing:20px; 单词间距
9.text-transform: capitalize/uppercase\lowercase; 文本转换,用于所有字句变成大写或小写字母,或每个单词的首字母大写
2.背景属性.
1.background-image: url (""); 以图片为背景
2.background-repeat:no-repeat; 设置背景图片不为平铺
3.background-positio:center; 设置背景图片居中
汇总:background: url("") no-repeat center;
3.;边框属性
1.border-width:20px;
2.border-style:solid;
3.border-color: res;
汇总:border: 30px red solid;
单独设置各边:
border-top-style:dotted;
border-right-style:solid;
border-bottom-style:dotted;
border-left-style:none;
4.列表属性:
1.list_style: none; 去掉列表 符号。
2.list_style: square; 方形
3.list_style: circle; 圆形
5.display
1.none 隐藏某标签 and verisbility
2.block 内联转块级
3.inline 块级转内联
4.inline-block 二者兼有
6.边距的塌陷问题
1.overflow:hidden 隐藏溢出的值
2. 滚动条
3.固定高度
4.清除浮动
5.
排序以一个标签排序
7.position(定位)
1.static
1.固定定位:fiexed
position: fiexed;
right:20px;;
bottom:20px;
2.绝对定位
position: absolute;
top: 100px;
left:100px
3.相对定位
position: relative;
top: 100px;
left: 100px;