前端
html
服务器端返回的就是一个字符串，浏览器根据html规则去渲染这个字符串。
html 是超文本标记语言，相当于定义统一的一套规则，大家都遵守它，这样就可以让浏览器根据标记语言的规则去解释服务端返回的字符串。
基本结构
<!DOCTYPE html> # 定义html文档的类型，其实就是一套对应规则，这是推荐规则，兼容性最好之一。
<html lang="en"> #是否翻译网页
<head> # 对整个html的一个设置
<meta charset="UTF-8">
<title>Title</title>
</head>
<body> # 身体
</body>
</html>
写html的时候，一般都现在本地调试好html文件，直接放到服务器上就能用了。
head
<head>
<meta charset="UTF-8"> <!--自闭和标签-->
<meta http-equiv="Refresh" content="2">
<meta http-equiv="Refresh" content="2; url=http://www.baidu.com">
<!--刷新和跳转-->
<meta name="keywords" content="侯冰雷，前端">
<!--关键字，可以被搜索的-->
<title>Title</title>
</head>
body
分类：
块级标签：h1-h6、p、dic等。
行内标签：a、span、select等
自闭和标签：meta、input
所有标签都可以定义的属性：id、style、name
特殊标签属性：
a： href，target
符号：
> >
< <
p和br：
p表示段落,默认段落之间是有间隔的。
br： 换行
a标签
<a href="http://www.baidu.com" target="_blank" (新标签页打开)>百度一下</a>
<a href="./lala.html">本地文件</a>
锚，示例：
<body>
<a href="#tt">看第二章</a>
<div>
<p class="1">第一章</p>
<p class="2" id="tt" >第二章</p>
</div>
</body>
input系列
hr 分割线
多选框
单选框 name相同，才又互斥的作用；所有的标签都可以有name属性
选择文件
没有再form标签里button和submit是一样的。
form标签
提交的数据放到一个form里才能提交到另外一个地方
提交的时候要用到name属性，构建字典，来让服务端接收到字典信息。
textarea
文本区域
label标签
让一个文本跟一个标签产生一个对应关系
label里的for指定一个标签的id
列表标签
ul、ol、dl
ul没有序号
ol有序号
dl里面不是li，是dt标题，和dd内容。
css
选择器
class选择器 .tt class='tt'
id选择器 #tt id= 'tt' 一般不用id选择器，因为id唯一，逝去了重用性
标签选择器 a
background属性
background-image：默认会平铺，铺满
background-repeat: no-repeat/repeat-x/repeat-y
background-position: 相当于一张纸扣个洞，图片在纸下边
display属性
none 不显示
block 块级
in-line 行内
cursor属性
cursor：pointer 鼠标变成小手
border属性
border： 1px solid red
浮动
宽度针对父标签；
解决办法：
3.官方写法：建议大家这样去写 给父盒子设置：
.clearfix:after # 后边加行内的东西
{visibility:hidden;
clear:both;
display:block; # 转成块级
content:".";
height:0}
4、 4.给父元素添加overflow:hidden 推荐使用
position属性
fixed 固定，针对窗口
absolute 绝对，
relative 相对
<div style="position: relative;background-color: red;height: 500px; 300px">
<div style="position:absolute;bottom: 30px;right: 30px">定位</div>
</div>
absolute在其父标签有relatice属性的时候，在父标签定义位置处。
padding和margin
padding 内边距
margin 外边距
练习
1、
.top{
100% ;
height: 40px;
background-color: black;
color: #fff;
/*让文本水平居中*/
/*text-align: center;*/
line-height: 40px; 行高等于盒子高，就垂直居中
2、
.container{
1226px;
height: 100%;
/*两个值： 上下 左右*/
/*三个值： 上 左右 下*/
/*四个值： 上 右 下 左*/
/*一个值： */
margin: 0 auto; auto，推最大的距离。
}
re模块
示例1、
李[^和]* 李杰和李莲英和李二棍子
李杰
李莲英
李二棍子
表示匹配一个不是"和"的字符任意次
示例2、
^[1-9]d{14}(d{2}[0-9x])?$
现在不会匹配错误的身份证号了
()表示分组，将d{2}[0-9x]分成一组，就可以整体约束他们出现的次数为0-1次
^([1-9]d{16}[0-9x]|[1-9]d{14})$
表示先匹配[1-9]d{16}[0-9x]如果没有匹配上就匹配[1-9]d{14}
示例3、
.*?x
就是取前面任意长度的字符，直到一个x出现
re模块下的常用方法：
如果用r进行取消转义的话：
ret = re.search(r'/?[^s]*',r'/?username=houbinglei&phone=123456&pwd=&verifyCode=123456').group()
print(ret)
两边都得加r，字符串要加，让整个字符串不转义。