前端 ==> CSS （总结）

  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/uppercaselowercase;  文本转换，用于所有字句变成大写或小写字母，或每个单词的首字母大写
    2.背景属性.
        1.background-image: url ("");   以图片为背景
        2.background-repeat：no-repeat; 设置背景图片不为平铺
        3.background-positio:center;    设置背景图片居中
        汇总：background: url("") no-repeat center;

    3.;边框属性
        1.border-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;