文档章节

网页布局基础(2)-横向俩列布局

维他ViTa
 维他ViTa
发布于 2016/12/04 16:52
字数 251
阅读 6
收藏 0

一、float属性

3个属性:left(左浮动) /  right(右浮动) /  none(不浮动)

特点:元素会左 / 右移,直至触碰容器为止。



就像容器边缘有磁铁吸引

*注意:设置了浮动的元素,依旧处于标准文档流中。

二、清除浮动影响的方法

     当元素设置浮动属性后,会对相邻的元素产生影响​。(相邻元素特指紧邻后面的元素)

1.clear属性:clear : both  (clear : left 或者 clear : float)
​​​                  ​​​​//   不清楚的情况下使用clear : both

2.同时设置width : 100% (或者固定宽度)+overflow : hidden ;

                 //​    紧邻元素使用方法1   ;  父级元素受影响使用方法2

三、横向俩列布局

方法:1.float属性 - 使纵向排列的块级元素,横向排列;

          2.margin属性 - 设置俩列之间的布局。



清除属性的注意点在不同情况下使用不同清除浮动的方法。

© 著作权归作者所有

共有 人打赏支持
维他ViTa
粉丝 12
博文 135
码字总数 44057
作品 0
深圳
程序员
私信 提问
HTML5-基础篇-移动端适配 ( 二 )

一 : 科普一分钟 我们熟悉了在PC端进行开发网页,相对于移动设备需要有哪些调整呢,才能设计出符合各个场景和机型的完美移动网页.在众多APP 中大多嵌入H5页面开发,所以解决适配的问题很重要.其...

TianTianBaby223
2017/08/25
0
0
flutter笔记7:flutter页面布局基础,看完这篇就可以用flutter写APP了

不知不觉已经到了第7篇,然而很多萌新玩家可能还是不知道如何堆砌控件,像用CSS一样搭出漂亮的APP界面,我也一样,红红火火恍恍惚惚,直到今天含泪读完Flutter布局基础,仿佛打开了一个全新的...

燃烧的鱼丸
03/09
0
0
编写第一个响应式页面

本文为大家讲解如何使用一种科学的方法实现网页设计,从原理上搞清楚什么是响应式设计,并实现一个简易的响应式设计框架,以此为基础,编写出第一个响应式页面。 不知道现在大家还读村上春树...

凡尘里的一根葱
2015/11/24
60
0
Windows Phone开发(5):室内装修

为什么叫室内装修呢?呵呵,其实说的是布局,具体些嘛,就是在一个页面中,你如何去摆放你的控件,如何管理它们,你说,像不像我们刚搬进新住所,要“装修”一番?买一套什么样的茶几和杯具(...

junwong
2012/04/18
188
0
Bootstrap~页面的布局

Bootstrap作为支持响应式布局的一个前端插件,确实发挥着重要的作用,无论你是在手机,平板还是PC上浏览网页,都能达到不错的效果,这一切一切,都是bootstrap带给我们的! 今天主要说下页...

mcy247
2017/12/06
0
0

没有更多内容

加载失败,请刷新页面

加载更多

Eureka Server启用 https服务指北

文章共 591字,阅读大约需要 2分钟 ! 概 述 在我的前文《Eureka Server 开启Spring Security Basic认证》中已经给 Eureka Server 开启了最基本的鉴权措施,本文则让 HTTPS加持于 Eureka Ser...

CodeSheep
35分钟前
6
0
OSChina 周二乱弹 —— 其实我在地板也睡不着

Osc乱弹歌单(2018)请戳(这里) 【今日歌曲】 @witt-z :分享歌词: 阴天 在不开灯的房间,当所有思绪都一点一点沉淀。 分享莫文蔚的单曲《阴天》: 《阴天》- 莫文蔚 手机党少年们想听歌,...

小小编辑
58分钟前
250
7
微服务分布式事务实现

https://www.processon.com/view/link/5b2144d7e4b001a14d3d2d30

WALK_MAN
今天
3
0
《大漠烟尘》读书笔记及读后感文章3700字

《大漠烟尘》读书笔记及读后感文章3700字: 在这个浮躁的社会里,你有多久没有好好读完一本书了? 我们总觉得自己和别人不一样,所以当看到别人身上的问题时,很少有“反求诸己”,反思自己。...

原创小博客
今天
4
0
大数据教程(9.5)用MR实现sql中的jion逻辑

上一篇博客讲解了使用jar -jar的方式来运行提交MR程序,以及通过修改YarnRunner的源码来实现MR的windows开发环境提交到集群的方式。本篇博主将分享sql中常见的join操作。 一、需求 订单数据表...

em_aaron
今天
3
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部