Day25-CSS常见布局技巧+CSS初始化

常见的布局技巧

margin负值的应用

1. 让每个盒子margin往左侧移动-1px正好压住相邻盒子边框。

2. 2.鼠标经过某个盒子的时候，提高当前盒子的层级即可(如果没有定位，则加相对定位（保留位置),如果有定位，则加z-index )。

    
    
    
    
    



    

        
1
        
2
        
3
        
4
        
5
    

    
    
    
    
    



    

        
1
        
2
        
3
        
4
        
5
    

文字围绕浮动元素

巧妙运用浮动元素不会压住文字的特性

    
    
    
    
    



    
    

        

            
        
        
【王者荣耀】杨玉环MGXFGS【我的小兔糕今天968块】复制链接参与活动，快来我的小兔市集出售吧！兔年上分大吉！
    

行内块巧妙运用

<<上一页

1

2

3

4

5

6

7

8

>>下一页

CSS三角强化

原理如下：

代码如下：

width: 0;height : 0;

border-color: transparent red transparent transparent;

border-style: solid;

border-width: 22px 8px 0 0;

CSS初始化

不同浏览器对有些标签的默认值是不同的，为了消除不同浏览器对HTML文本呈现的差异，照顾浏览器的兼容，我们需要对CSS进行初始化。

简单理解:CSS初始化是指重设浏览器的样式。(也称为CSS reset )每个网页都必须首先进行CSS初始化。

这里我们可以京东css初始化代码为例。