今天终于有空写篇文章了,如果有不对的还请大家多多指正,只是想让初学者少走点弯路,当初我学的时候到处碰壁,一些很简单的问题如题“div+css的浮动”被一些牛X人物写的多么的深奥,我理解半天才弄懂原来是围绕一个属性把那个标签的祖宗十八代都给牵扯出来了!不说了....

首先,你肯定为一名网页构架师或者将要成为一名构架师,说实话现在的这个行业我却不怎么看好,因为现在做这个的太多了,谁让它叫IT呢?做的多就贬值了!呵呵,发个牢骚,现在我们切入正题!

1.float的在IE6中出现的一些BUG问题

当使用float在网页中布局的时候会出现一些让我们难以理解甚至不敢置信的一些问题,例如:在IE6里面会出现右侧3PX的空白,这时其他浏览器都是非常标准,我们理所当然的认为是IE6比较落后现在没几个人会在意,但是作为一个设计师,你必须为你的作品负责,这个问题其实解决很简单,这里我们需要使用一些HACK技术,在你的css中加上一个如:.box{margin-right:0px; margin-right:-3px!important;}这样就ok了!如果不了解HACK技术的,可以在网上查,很多的哦!

2.float浮动混乱布局div+css的浮动

最常见的问题就是,当你把上面两个块使用了float浮动属性后,下面的块会出现在上面的右侧,这个问题在设计的时候很头疼,也是很多初学者最搞不懂的。现在这个其实也很简单,使用clear这个元素的清除属性,就是在以上的两个div下面写上一个容器如:

#bb{float:left;width:480px;}

#aa{width:960px; margin-top:5px;}

#clear{clear:both;}

......

......

.....

如此即可解决这个老大难的问题。

3.float浮动出现双间距

当li使用float属性后会出现两倍的间距即当你设置li的左边距为3PX但是它会出现6PX的左侧空白,这个其实只需要在li元素的css上面设置一个内联属性即:display:inline即可解决。

4.当未知高度的子元素进行float浮动时,让父元素自适应高度

可在父元素中的末端加上

.....即可如:

#oo{ margin:0 auto;width:960px;}

#bb{float:left;width:480px;}

#aa{width:960px; margin-top:5px;}

#clear{clear:both;}

......

......

.....,如果让子元素也自适应高度的话同上。

这是我现在就遇见的div+css的浮动常出现的问题与解决方法,如果有不对的地方,还请大家予以指正,欢迎大家一起探讨

css出现的问题以及解决,div+css的浮动常出现的问题以及解决办法_html/css_WEB-ITnose...相关推荐

  1. 小技巧助你解决div+css网页内容显示不完整

    今天调一个布局,调了老一会没调好,就是内容显示不全,然后突然看到这篇文章 得到点启发,所以转发下支持下 在测试网页效果时,你是否为网页在IE6版本的浏览器中能正常打开,网页显示完整.而在IE7及以上版 ...

  2. css 浮动 解决,div+css浮动的解决方法

    如何清楚浮动(一) 已知一个大的div容器,这个容器包含了两个子div容器,然后在这两个子div容器的后面再添加一个div(这个div表示清除浮动的div容器),清楚浮动的div容器设置css样式为c ...

  3. html中css与左侧距离,html 实现DIV+CSS 让左右内容之间保持一定距离

    这篇文章主要为大家详细介绍了html 实现DIV+CSS 让左右内容之间保持一定距离,具有一定的参考价值,可以用来参考一下. 一般我们在一个外围DIV内针对两个DIV分别使用float 浮动属性(fl ...

  4. html首行缩进在CSS中的代码,如何在div+css实现首行缩进

    用word文档实现段落首行缩进是一件相当容易的事,你只需打开段落对话框,在里面进行相关设置即可.那么在div+css中该如何实现呢?今天我们一起来学习一下. 所谓首行缩进,就是每段前空两个汉字.所以在 ...

  5. DIV+CSS专题:十天学会DIV+CSS

    http://www.aa25.cn/special/10day/ 欢迎大家学习<十天学会web标准>,也就是我们常说的DIV+CSS.不过这里的DIV+CSS是一种错误的叫法,建议大家还 ...

  6. Html字母变大的代码,css鼠标选中字体变大 div css鼠标悬停超链接的文字变大

    css鼠标选中字体变大 css鼠标悬停超链接的文字变大 CSS布局鼠标悬停在超链接上字体变大,css实现鼠标经过锚文本文字时改变字体大小篇. 实现这一效果需要的是:hover伪类设置需要字体. 鼠标选 ...

  7. 导航居中分布css,导航居中背景色通栏显示 DIV + CSS 代码

    有时候我们用到导航栏居中显示,但是有通栏背景色的效果,比如本站现在(2017年12月)的导航栏就是通栏背景的.经过调试,发现了一个非常简单的通栏背景的 DIV + CSS 代码,首先看 CSS 代码: ...

  8. css滑动门技术的应用,DIV+CSS滑动门技术简介

    你对DIV+CSS滑动门技术的概念和使用是否熟悉,这里和大家分享一下,其实DIV+CSS滑动门技术是一种只需要鼠标悬停便可自动切换板块的JS特效,相信本文介绍一定会让你有所收获. DIV+CSS滑动门 ...

  9. js读取div从html中导入,在html中div+css布局的简单应用...-js+div+css下拉导航菜单完整代...-CSS文件的条件导入 - Gene Li_169IT.COM...

    方案一: 在HTML文档中使用条件导入,如在HEAD中插入如下代码: 1: 4: .csharpcode, .csharpcode pre{font-size: small;color: black; ...

最新文章

  1. 给运维工程师的Cheatsheets! 《Shell脚本速查手册》免费下!
  2. 【Linux】一步一步学Linux——groupdel命令(88)
  3. 强制关机对电脑的影响_电脑强制关机,对电脑有影响吗?你被伪科普骗了多久?...
  4. Honey Tree(超好用的样板代码管理工具)
  5. C# WinForm开发系列 - 开篇
  6. mysql 各种字段取值范围 2009-12-23
  7. 如何用pdb命令调试python代码
  8. 20220103_数据库过程:异常业务量情况通报
  9. NO.5 Android Opencv 相机人脸识别
  10. linux其他命令(查找文件、软链接、硬链接)
  11. 如何实现 1 小时内完成千万级数据运算
  12. GCN的Python实现与源码分析
  13. 示性函数、共轭函数、对偶范数、共轭
  14. 腾讯云服务器IP地址打不开网站注意80端口的问题
  15. (待填坑)【字符串】manacher(马拉车)算法
  16. 弹幕护体下的B站,走得越来越稳健了
  17. BackTrack5漏洞评估之OpenVAS Open Vulnerability Assessment System
  18. 天津计算机三加二学校有哪些,天津3+2学校有哪些学校在招生
  19. 超清视频时代要来了吗?
  20. C++ Primer 与“类”有关的注意事项总结

热门文章

  1. Node.js 0.8.21 稳定版发布
  2. 基于MINA框架快速开发网络应用程序
  3. linux lvm 逻辑卷 创建 扩容 缩减 删除
  4. python3 错误string indices must be integers 的解决方法
  5. linux putty 永久修改字体大小
  6. HTTP/2 h2 协议简介
  7. linux查看网卡速率
  8. 关于外挂新手最常见的30个问题
  9. 《UNIX环境高级编程》--du命令
  10. Android开发--BroadcastReceiver2