第二章 css选择器和良好的结构体( 四 ) _css选择器

去掉ul标签的默认项目符号；根据水平或者垂直需求选择浮动或者不浮动;(-block也是可以的，不过我记着这个属性在一些浏览器下会因为代码间的空格对网页效果产生一个默认的空隙)；ul ， li都不要设置宽度，这样更灵活， li的面积用撑起来，可以保证每个选项都看起来比例合理；项目标识：不推荐使用默认的项目符号，太单一了，而且不好控制。可以使用背景图定位。具体点就是先用留出位置，再用背景属性；效果：配合hover去写就好了，效果变化可以十分灵活，看你怎么写咯。2. 下拉菜单的思路原理：如果我告诉你hover的效果是可以冒泡的，你信吗。其实当我们对于父级元素设置hover效果后，它的子元素也会有同样的效果，这也就为子菜单的实现提供了基础。实现：
首先我们得需要一个横向菜单，里面的每一项li都是子菜单的父级；子菜单做成垂直菜单，配合hover就可以实现。
tips：我觉得这已经很够了，相信不是小白的看一下思想都能知道大概怎么做。
二、css图像映射解释：将li定位到图像规定地区，你可以通过点击图片到对应的网站。要点：其实就是div和插入的图片大小要定的一致。实现：父级定位，然后再分别定位li ，可以通过透明度设为0去实现。个人方法：（）
首先给父级定位；插入和父级大小一致的图像；通过.log配合e.和e.找出各个需要跳转的图像位置区间；通过和e.和e.进行判断，根据区间配合.open(““);实现指定页面的跳转。优点：我觉得不会有很多不合理的，位置被定的乱七八糟的li 。
个人认为这种功能用的不太多，好像地图之类的图像上出现的概率大点。
第六章布局
常见的布局和应用
一、基础布局
在进行布局之前，我们首先要进行布局思考，将网页划为几个区域同时思考它们的重复性。
1. 居中布局定义：一般指水平居中的布局实现
1. 设置具体宽度，然后： 0 auto；
2. 定位1（详情见代码）；
3. 定位2（详情见代码）。
4. 借助flex居中，父级div设置：flex；（一些浏览器需要做兼容）子级居中div设置-：；
定位1：#box {position：absolute；left：50%；margin-left：-1/2容器宽度}
定位2：#box {position：absolute；left：50%；transform:transition(-50%);}
2. 多列布局
借助浮动就可以实现
3. 流式布局：定义：根据页面大小调整页面各部分比例；实现：每个具体数值的地方都用百分比去设置；说起来容易实际挺困难，需要非常精准的计算。缺点：很难精确地按照设计图纸固定每部分位置，用的很少（最多的还是固定宽度）。4. 圣杯布局优点：允许主要内容先行加载实现：一个外围容器，先中间后两边都左浮动；负值+容器+相对定位负值； 5. 双飞翼布局优点：允许主要内容先行加载实现：一个外围容器，先中间后两边都左浮动；负值+中间加内容容器+内容容器；二、高级布局简介 1. flex布局
就是利用css3的flex属性就行布局，优点特别灵活，缺点对部分浏览器不兼容
2. 响应式布局
@media 可以针对不同的屏幕尺寸设置不同的样式，特别是如果你需要设置设计响应式的页面， @media 是非常有用的。