百度前端学习日记05——页面布局(一)浮动
发布日期:2021-08-15 22:29:18 浏览次数:29 分类:技术文章

本文共 543 字,大约阅读时间需要 1 分钟。

前言

更多参考

正文

1.浮动概念

最初,引入 float 属性是为了能让 web 开发人员实现简单的布局,包括在一列文本中浮动的图像,文字环绕在它的左边或右边。你可能在报纸版面上看到过。

举例给图片设置float:left

img {
float: left; margin-right: 30px;}

2.浮动的破坏性

首先了解被设置了float的元素会脱离文档流。

举例

3.清除浮动

clear属性

值 left,right,both

4.浮动布局

a.两列布局

.div1{
float:left; width:48%}.div2{
float:right; width:48%; }

b.三列布局

div:nth-of-type(1) {
width: 36%; float: left;}div:nth-of-type(2) {
width: 30%; float: left; margin-left: 4%;}div:nth-of-type(3) {
width: 26%; float: right;}

 

转载于:https://www.cnblogs.com/no-wing/p/9285839.html

转载地址:https://blog.csdn.net/weixin_30781107/article/details/97082009 如侵犯您的版权,请留言回复原文章的地址,我们会给您删除此文章,给您带来不便请您谅解!

上一篇:hdu3917 最大权闭合图
下一篇:intellij idea 用 Gradle新建 spring boot

发表评论

最新留言

不错!
[***.144.177.141]2024年02月28日 14时22分43秒

关于作者

    喝酒易醉,品茶养心,人生如梦,品茶悟道,何以解忧?唯有杜康!
-- 愿君每日到此一游!

推荐文章

vowifi android开关,如何配置VoLTE, ViLTE and VoWifi(IMS config for VoLTE, ViLTE and VoWifi) 2019-04-21
电脑端的mafsvr服务关掉_网吧才是电脑优化的精髓!学会3招你也不用羡慕网吧的流畅了... 2019-04-21
html获取文件路径_HTML 文件路径 2019-04-21
mysql滴的一声就关了_关于mysql数据库在输入密码后,滴的一声直接退出界面的解决办法(详细办法)... 2019-04-21
mysql in 有序_mysql中的in排序 mysql按in中顺序来排序 2019-04-21
mysql 行转列 显示_mysql 行转列 (结果集以坐标显示) 2019-04-21
由于连接方在一段时间后没有正确答复或连接的主机_新风换气机使用效果不佳,为何?掌握正确使用方法就好了... 2019-04-21
mysql 查询姓王_MySQL查询语句练习题,测试足够用了 2019-04-21
mysql多实例脚本_mysql多实例脚本 2019-04-21
python如何生成excel文件夹_用python脚本通过excel生成文件夹树结构 2019-04-21
python获取post请求中的所有参数_Django从POST reques获取请求参数 2019-04-21
mysql加密复制_MySQL主从复制使用SSL加密 2019-04-21
python启动远端 exe_python打包exe开机自动启动的实例(windows) 2019-04-21
java当前路径_java获取当前路径的几种方法 2019-04-21
java web传递参数_Javaweb的八种传值方式 2019-04-21
java gui支持的包有哪两个_Java GUI 2019-04-21
java list详解_java集合List解析 2019-04-21
java坐标代码_java实现计算地理坐标之间的距离 2019-04-21
kettle调用java程序_Kettle ETL调用 java代码来进行数据库的增删改查 2019-04-21
mysql 取两个时间差 php_在php和MySql中计算时间差的方法详解 2019-04-21