写页面技巧篇（二）

1
子容器 使用了 浮动 需要给父容器 加清除浮动
子容器 float : left ;
父容器 cle:after{ content : "";display : block; clear : both}

2
调整 icons 小图标 有几个很好的方法

// 引入图片
background: url('../icons/1.jpg');
// 不重复显示 
background-repeat: no-repeat;
// 左右位置
background-position: 6px 6px;
// 上下左右拉长/缩小
background-size: 22px 27px;

3
/* 首行缩进 */
text-indent: 12px;

生成多个 li和a 标签 直接写
li * 8 > a 就快速生成这样的

4
使用 padding的时候要注意 比如说加了padding-left / padding-right 需要width 宽度减掉 *2 如果加的是padding-top / padding-bottom 需要把 height 减掉 *2
不然会将容器撑得很大

5
input 里面的默认的内容 使用 <input type="text" placeholder="搜索公司/职位/地点">

6

常规情况下 文字在一个框内居中 怎么实现 ？

 	height: 45px;
 	//这个实现水平方向居中
    text-align: center;
    //行高等于容器的高度 可以实现垂直方向居中
    line-height: 45px;

7
常规情况下 写页面 从最外层写
而且可以写的时候加一个 背景色 后面删掉 方便定位
一般使用 red pink gold 这种 不带特殊数字的 这样一看就是自己加的多余的部分

8
很多时候 给了一个 div 宽度 width 和背景色 background 但是却没有效果？
需要给个高度 一般给父级的高度 height

9
做页面的时候 没办法看到底部的东西 通常有两个方法处理？
1、给body 加 body style="height:10000px"
2、 在body 底部 加 br

10
小图标 向左和向右 可以用 gt > lt <

<span> &gt; </span>    还有&lt;
 

11
数组去重两种常用方法

    // 数组去重 
    // 方法一： es6  set()
     let arr = [3, 5, 2, 2, 5, 5];
    let unique = [...Array.from(new Set(arr)