知识点

一.浮动（难点）

1.文档流

水平方向（从左往右）：行内元素，行内块级元素
垂直方向（从上往下）：块级元素

2.使用浮动实现：

元素既是块级元素，也可以共处一行
分为两种（左浮动（float：left；）、右浮动（float：right））

3.缺点：

浮动元素脱离文档流

造成父元素的高度崩塌（高度为0）

解决方法：清除浮动 clear：both，在最后一个浮动元素后面（同级）清除浮动

要放在父级里面

总结：使用浮动后一定要在最后的浮动元素添加div来清除浮动

    <style>
    ul>li{
        float:left;
    }
    .clear{
        clear:both;
    }
    </style>
    <ul>
        <li>新闻1</li>
        <li>新闻2</li>
        <li>新闻3</li>
        <li>新闻4</li>
        <li>新闻5</li>
        <li>新闻6</li>
        <div class="clear"></div>
    </ul>

---

二.伪类选择器

写法：
选择器:(与css相比多一个冒号)状态
：

例如
     a：hover{
        color:red;
        }

1.元素选择器作用于:

（1.编辑默认样式（ 2.定于全局样式

例如：
        .buy_btn:hover{
                color: #fff;
                background-color: #D2691E;
        }
        <a href="#" class="buy_btn">购票</a>

2.鼠标作用时
hover（鼠标悬停在上面时）、active（当鼠标点击时）

3.a标签的4种状态,正确顺序(lvha)

    1).link     链接未访问状态<br/>
    2).hover    鼠标悬停状态<br/>
    3).active   鼠标点击状态<br/>
    4).visited  链接被访问过状态<br/>

例子：
        .ipt:focus{
                color:#FF0000;
            }

4.表示顺序的状态

    ele:first-child //匹配首位<br/>
    ele:last-child //匹配末位<br/>
    ele：nth-child()<br/>
    位置要对，标签要对
    先匹配位置，<br/>
    如果当前位置的标签不对，则不会应用样式<br/>

5.表示类型的状态：
ele:nth-of-type()
ele:first-of-type
ele:last-of-type()

6.ele:nth-child 和 ele:nth-of-type对比

    ele:nth-child：优先匹配位置及元素
    ele:nth-of-type：优先匹配类型及出现顺序

---

三 关系选择器

元素E，元素F

1.关系选择器（嵌套：父代，子代） 都是作用用{}前
父代选择器：

    E F{

        }   

子代选择器：

    E>F{

        }

css选择器真正左右的元素在{}前面的元素

相邻选择器：

E+F{

}

css原则：就近原则 后者覆盖前者

    控制较细的元素
        后代—>子代
        兄弟—>相邻

---

四 git操作

基本命令行操作
例如
切换到D盘:
d:
进入对应文件夹
cd 文件路径

---

1.先从码云上创建一个仓库(项目)
2.使用git clone 命令将项目拉取到本地
3.将本地文件添加到拉取回来的仓库里面

git 四步走

将本地代码添加到git缓存区
1. git add ./
git add ./文件的相对地址(想要上传的文件)
./代表将当前所有文件都添加到缓存区里面
2. git commit -m"参数"
git commit 触发git,真正将文件添加到git缓存区
-m "一些标记" 记录当前操作
3.git pull
将线上的代码于本地代码进行检查,看看有没有冲突
4.git push
将缓存区的文件推到线上

创建git忽略文件 .gitignore
把不必要上传文件，记录下来

如何创建.gitignore

1.鼠标右键选择 git bash here
2.输入 touch .gitignore

---

项目：

git。。
拿到设计图之后做什么
1.双击打开psd
2.确定当前项目的类型（确定是pc端设计还是移动端，或者是响应式设计）
3.项目的背景（这个项目是干嘛的，为什么要做这个项目）
4.技术分析
    1.）确定外部容器的尺寸（1000*2255）
    2.）对设计稿进行区域划分