• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com专业计算机教程网站
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure
您的位置:首页 > 网页设计 >CSS > 10个DIV+CSS需要注意的问题

10个DIV+CSS需要注意的问题

作者:佚名 字体:[增加 减小] 来源:互联网 时间:2017-08-06

本文主要包含DIV,CSS等相关知识,佚名 希望在学习及工作中可以帮助到您
1. 检查HTML元素是否有拼写错误、是否忘记结束标记

即使是老手也经常会弄错div的嵌套关系。可以用dreamweaver的验证功能检查一下有无错误。

2. 检查CSS是否正确

检查一下有无拼写错误、是否忘记结尾的 } 等。可以利用CleanCSS来检查 CSS的拼写错误。CleanCSS本是为CSS减肥的

工具,但也能检查出拼写错误。

3. 确定错误发生的位置

假如错误影响了整体布局,则可以逐个删除div块,直到删除某个div块后显示恢复正常,即可确定错误发生的位置。

4. 利用border属性确定出错元素的布局特性

使用float属性布局一不小心就会出错。这时为元素添加border属性确定元素边界,错误原因即水落石出。

5. float元素的父元素不能指定clear属性

MacIE下假如对float的元素的父元素使用clear属性,四周的float元素布局就会混乱。这是MacIE的闻名的bug,倘若不

知道就会走弯路。

6. float元素务必指定width属性

很多浏览器在显示未指定width的float元素时会有bug。所以不管float元素的内容如何,一定要为其指定width属性。

另外指定元素时尽量使用em而不是px做单位。

7. float元素不能指定margin和padding等属性

IE在显示指定了margin和padding的float元素时有bug。因此不要对float元素指定margin和padding属性(可以在float

元素内部嵌套一个div来设置margin和padding)。也可以使用hack方法为IE指定非凡的值。

8. float元素的宽度之和要小于100%

假如float元素的宽度之和正好是100%,某些古老的浏览器将不能正常显示。因此请保证宽度之和小于99%。

9. 是否重设了默认的样式?

某些属性如margin、padding等,不同浏览器会有不同的解释。因此最好在开发前首先将全体的margin、padding设置为

0、列表样式设置为none等。

10. 是否忘记了写DTD?
假如无论怎样调整不同浏览器显示结果还是不一样,那么可以检查一下页面开头是不是忘了写下面这行DTD:

<!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.01 Transitional//EN\" \"http://www.w3.org/TR/html4/loose.dtd/">

您可能想查找下面的文章:

  • css小技巧
  • DIV 自动滚动功能及滚动条颜色修改的代码
  • CSS控制div宽度最大宽度/高度和最小宽度/高度的方法
  • 解决img在div中居中的问题
  • 设置一个DIV块固定在屏幕中央的两种方法(推荐)
  • 使用CSS的overflow属性防止float撑开div的方法
  • CSS文本和div垂直居中方法总结
  • 使用CSS3的box-sizing属性解决div宽高被内边距撑开的问题
  • html+css+div实现电影结束效果
  • 不固定宽度和高度的情况下CSS调整div居中的方法总结

相关文章

  • 2017-08-06CSS 关于浮动
  • 2017-08-06一个属性border-collapse解决Table的边框问题
  • 2017-08-06纯CSS写的选项卡效果
  • 2017-08-06firefox中div重叠覆盖之前ul的两种解决方法
  • 2017-08-06css控制超链接(css超链接样式)
  • 2017-08-06html5+css3之CSS中的布局与Header的实现
  • 2017-08-06select和input不会继承字号body font-size
  • 2017-08-06css实现div内图片上下左右居中
  • 2017-08-06CSS first-letter伪类元素的特点
  • 2017-08-06使用CSS清除按钮和超链接点击时产生的虚线

文章分类

  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure

最近更新的内容

    • 将样式表放在页面顶部
    • css滤镜兼容浏览器测试实例
    • css简单实现热点链接当鼠标悬停时出现白色的框
    • CSS左侧固定宽 右侧自适应的实现代码(兼容所有浏览器)
    • 宽度百分比单位的转换公式及示例
    • 关于交互设计中的默认值的设计要点
    • css实现半透明效果基本原理
    • css3弹性盒模型实例介绍
    • CSS定义超链接样式的顺序及四个伪类的用法示例介绍
    • css中的长度单位(em/ex/px/pt)使用介绍

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有