CSS设计中常见的精华问题收集 -- [DIV+CSS]─ 深山工作室提供网络投票系统|微信公众号投票|微信公众号小程序|抖音小程序|百度小程序|微信公众号开发|企业网站建设

订阅本栏目 RSS您所在的位置: 深山工作室 > DIV+CSS > 正文

CSS设计中常见的精华问题收集

http://www.cnscn.org 2008/4/23 23:22:38 深山行者字体:大中小浏览 7215

firefox下，内容float时，父容器不能被撑开（闭合容器或清除浮动问题）：<div><p>web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全web标准常见问题大全</p></div>CSS代码如下：div {
width:200px;
border:1px solid red
}
p {
float:left;
width:100px;
}现象：

可以看到，父容器没有随着子容器而扩张。
解决方法：（1）加入<div style="clear:both"></div>清除浮动。
（2）为父容器也添加float:left;属性。
（3）.gainlayout{display:inline-block;} .gainlayout{display:block;}
IE6的双倍边距BUG：
在IE中，对一个div浮动时，并设定该div的margin时，会出现双倍的margin值。
CSS代码：float:left;
margin-left:100px;现象：

解决方法：加上display:inline即可。
IE6下图片下方有空隙：
现象：

解决方法：解决这个BUG的方法也有很多，可以是改变html的排版，或者设置img 为display:block。
或者设置vertical-align属性为vertical-align:top | bottom |middle |text-bottom
都可以解决。
IE6下这两个层中间有间隙：
代码：<div class="left">aaaaaa</div>
<div class="right">aaaaaa</div>CSS代码：.left {
float:left;
width:100px;
height:100px;
background:red
}
.right {
width:100px;
height:100px;
background:orange
}现象：

解决方法：这个IE的3PX BUG也是经常出现的，解决的办法是给.right也同样浮动 float:left 或者相对IE6定义“.left margin-right:-3px;”。
FF下文本无法撑开容器的高度：
CSS代码：div {
width:200px;
height:100px;
border:1px solid red
}现象：

可以看到，当文字的内容高度超过容器规定的高度时，容器不能自动撑开。
解决方法：标准浏览器中固定高度值的容器是不会象IE6里那样被撑开的,那我又想固定高度，又想能被撑开需要怎样设置呢？办法就是去掉height设置min-height:200px; 这里为了照顾不认识min-height的IE6 可以这样定义：
{
height:auto !important;
height:100px;
min-height:100px;
}
IE6下容器的宽度BUG：
现象：

解决方法：
（1）div
{
border: 20px;
padding: 20px;
width: 200px;
}
* html div
{
width: 280px;
w\idth: 200px;
}
（2）div
{
border: 20px;
padding: 20px;
width: 200px !important;
width: 280px;
width/**/:/**/200px;
}
（3）div
{
border: 20px;
padding: 20px;
width: 200px !important;
width /**/:280px;
}
IE6无法定义1px左右高度的容器：
现象：

解决方法：解决的方法有很多，例如：overflow:hidden | zoom:0.08 | line-height:1px

前一页:DIV+CSS之自动换行

后一页:网页制作,改变你的思维方

相关阅读: css里expression实现界面对象的批量控制; uni-app用map组件建立微信小程序显示商家地图位置并且打上标志然后点标志进行调用手机地图导航到对应的地址; 在图片未知尺寸情况下，利用CSS把图片垂直居中于div中心(2); js兼容多个浏览器右下角漂浮广告; 超级经典一套鼠标控制左右滚动图片带自动翻滚; uni.openLocation打开地图导航没反应解决方式（参数都设置对就是打不开）; 吉林省文化国际旅行社有限公司; asp文章内容自定义分页

共有0条关于《CSS设计中常见的精华问题收集》的评论: 发表评论

正在加载评论......

返回顶部发表评论

呢称:
表情:
内容:	评论内容:不能超过 1000 字,需审核,请自觉遵守互联网相关政策法规。
验证码:

网友评论声明,请自觉遵守互联网相关政策法规。

您发布的评论即表示同意遵守以下条款:
一、不得利用本站危害国家安全、泄露国家秘密,不得侵犯国家、社会、集体和公民的合法权益;
二、不得发布国家法律、法规明令禁止的内容;互相尊重,对自己在本站的言论和行为负责;
三、本站对您所发布内容拥有处置权。

更多信息>>栏目类别选择: 百度小程序开发; 微信小程序开发; 微信公众号开发; uni-app; asp函数库; ASP; DIV+CSS; HTML; python

更多>>同类信息: jquery设置或获取修改classname; 利用css3.0写出一个音乐播放的唱片碟盘的效果; 利用css中的scale()实现放大缩小效果; 利用background-color:#000000a8在背景颜色16进制代码之后加字母加上数字让背景色透明; css背景使用base64编码或者将base64编码放在img图片标签中; 利用css3中的-webkit-font-smoothing把网页文字的毛边去掉

更多>>最新添加文章: dw里面查找替换使用正则删除sqlserver里面的CONSTRAINT; Android移动端自动化测试：使用UIAutomatorViewer与Selenium定位元素; 抖音直播音挂载小雪花懂车帝小程序; javascript获取浏览器指纹可以用来做投票; 火狐Mozilla Firefox出现：无法载入您的Firefox配置文件它可能已经丢失或是无法访问问题解决集合处理办法; 在Android、iOS、Windows、MacOS中微信小程序的文件存放路径; python通过代码修改pip下载源让下载库飞起; python里面requests.post返回的res.text还有其它的吗

更多>>随机抽取信息: 利用javascript做的页内(详细页)搜索功能并将结果高亮突出显示; 你们负责对网站的后期推广吗？; 深山行者留言系统 v3.5; 网站页面重新构写,正在验证其它浏览器; 判断用户注册密码强度的JS代码; 深山留言板祈福效果

更多标签热门标签

竖排 word-break 锚点我想你样式查找源文件预览透明高度 rss 爱国变大留言层标语 ie6 cookies 固定 hover 选择符轮流数字行号常用首字母过滤灰色 CSS滤镜设计弹出 cpu script 快捷关键词随机舒服配色 weatherxml 技巧 tab 拖动黑白焦点 js VBScript pr 变色页面 body