框架布局慎用元素
作者:样吧 来源:样吧 发布时间:2008-12-21 16:33:00
标签:框架,布局,浮动,css
今天无意在坛子里看到这样一个求救帖(这里),看了一下,感觉问题比较好解决。但是问题背后的问题却引起了我的反思。把他的页面整理一下看看(为了便于观察,我替换了图像。反映的问题是上下行之间为什么出现一道空隙?):
如果拨云去雾,敏锐的人会发现这不是一个简单的技巧问题。通过在不同浏览器中测试,一般人都会发现它也不是一个浏览器的Bug问题,好像是一种普遍规律。先看看效果:
这里,我选用了三种比较典型的元素(列表、段落和div元素)进行对比试验,并分别在流动和浮动环境中测试,发现不管在哪种浏览器中,列表项(li元素)包含框都会多出一道空隙(在IE6、IE7和FF3下测试),在IE中甚至左侧也多出一道空隙。莫名其妙?
这是不是特殊情况呢?我在《CSS商业网站布局之道》一书中曾经结论说:浮动元素会自动收缩大小只到包含内部的子元素。看来,这个结论需要斟酌了,汗~~~。至少在列表项元素li中是如此。
为了进一步研究这个个案,我又尝试把图像替换为div盒子。先看看效果:
![](https://www.aspxhome.com/images/zang.png)
![](https://www.aspxhome.com/images/jiucuo.png)
猜你喜欢
- 本文实例讲述了PHP查询快递信息的方法。分享给大家供大家参考。具体如下:这里使用快递100物流查询官方文档中只能返回html的接口也可以返回
- 1、利用Python中的random模块中的choice方法random.choice()可以从任何序列,比如list列表中,选取一个随机的
- 首先,如果以前安装的话,要删除干净。我也找了
- 本文为大家分享了pygame游戏之旅的第8篇,供大家参考,具体内容如下定义一个计数函数:def things_dodged(count):
- memoryview() 函数返回给定参数的内存查看对象(Momory view)。语法memoryview 语法:memoryview(o
- //继承function Person(name,sex){ this.name=name;
- 看代码吧~# 加载库import numpy as npfrom fancyimpute import KNNfrom sklearn.pr
- 从url中找到域名,首先想到的是用正则,然后寻找相应的类库。用正则解析有很多不完备的地方,url中有域名,域名后缀一直在不断增加等。通过go
- 本文给大家分享一个远程更新目标库数据的存储过程,适用于更新列名一致,主键为Int类型,可远程链接的数据库。USE [Table]--切换到源
- ob缓存介绍ob是output buffering的简称,输出缓冲区,缓冲区是通过php.ini中的output_buffering变量控制
- 首先呢我去安装了一个那个pytorch,然后导入一下发现:连numpy都找不到,于是我表示很生气重新安装,它说安装过了,地址是balabal
- 网页布局中常有的一种情况就是网页主体部分分成一行两列;而在很多种情况下,设计师们常把左右两列的背景色设计成不同色彩,以实现内容块的明显区分;
- 在Flask中配置日志在Flask应用程序中,可以使用Python的标准logging模块来配置日志记录。以下是一个简单的示例,在其中将日志
- 本文实例讲述了python队列原理及实现方法。分享给大家供大家参考,具体如下:队列(queue)是只允许在一端进行插入操作,而在另一端进行删
- 目录一、目标二、环境准备1、基本信息2、数据库环境准备3、建库 & 导入分表三、配置&实践1、pom文件 &nbs
- 常用Mysql查询语句记录一、授权1.授权本地用户对所有数据库具有所有权限> grant all privileges on
- 1. 手动操作1.1. 显示模块pip list1.2. 显示过期模块pip list --outdated1.3. 安装模块pip ins
- 本文讲述了LINUX下Oracle数据导入导出的方法。分享给大家供大家参考,具体如下:一. 导出工具 exp1. 它是操作系统下一个可执行的
- 由于自己疏忽,导致请求错误405,然后前端数据传输没错,百度大都说跟post提交方式有关,改成get还是报错,检查才知道,controlle
- 先看一个需求from collections import defaultdict"""需求: 统计user_