HTML+CSS 轻松入门之浮动模型
状元素这么霸道都是独占一行,如果现在我们想让两个块状元素并排显示,怎么办呢?不要着急,设置元素浮动就可以实现这一愿望。
任何元素在默认情况下是不能浮动的,但可以用 CSS 定义为浮动,如 div、p、table、img 等元素都可以被定义为浮动
下面我们来写一个浮动的实例,代码如下
流动模式下的内联元素
以上代码是块状元素div 独占一行,现在我们要把他们放在一行显示,然后俩个div之间又点距离,请看下面代码:
流动模式下的内联元素
这样我们想要的效果就完成了,首先我们要给第一个div 做一个向左的浮动,第二个也是,然后俩个就会链接在一起,在同一行展示
接下来我们给第二个div 做一个向左的边界 这样就可以了