柏思网络微信公众号
柏思网络微博
咨询热线:0755 33889986
咨询邮箱:boonet@boonet.cn
深圳网站建设区域站
深圳网站建设 网页设计 网站制作 网站设计 网站开发 就选择柏思网络
我们的优势: 专业网站建设公司,顶尖设计师量身定制 配备高配置主机,BGP多线,高速访问 99.999%网站数据可靠性 免费提供快速ICP备案 承诺24小时快速解决网站问题
您的位置:首页 > 新闻动态> 常见问题 > 查看内容
福永网站建设公司教你CSS布局知识及如何调试
发表日期:2016-04-30 13:33:21    文章编辑:柏思网络    浏览次数:206
CSS网页布局,说难,其实很简单。说它容易,往往有很多问题困扰着新手,介绍了非常多的技巧,这些小技巧与知识能事半功倍的给大家以帮助。

一、若有疑问立即检测

在出错时若能对原始代码做简单检测可以省去很多头痛问题。W3C对于XHTML与CSS 都有检测工具可用。请注意,在文件开头的错误,可能因为不当的结构等因素造成更多错误;我们建议先修正一些最明显的错误之后重新检测,这样也许会让错误数量爆减。

二、使用浮动功能时记得适当清除指令

浮动是个危险的功能,未必会产生您所期望的结果。如果您遇到浮动元素延伸到外围容器的边框或者其他不正常情况,请先确定您的做法是正确的。

三、边界重合时利用padding或border来避免

您可能会为了一点不应该出现的空间而焦头烂额,或者您需要一点点空间时,怎样都挤不出来。如果您有用到margin,那么很容易产生边界的重合。

四、尝试避免同时对元素指定padding/border以及高度或宽度

Windows版IE经常导致width与height的计算问题。有些方法可以解决此问题,但如果母元素需要指定高度与宽度时,最好能够在母元素之内的子元素套用margin,或者当子元素需要指定高度与宽度时,在母元素套用padding以达效果。

五、不要依赖min-width/min-height

Windows版IE并不支援两种语法。但是在某种程度下,windows版IE可以达到相当于min-width/min-height的效果,所以只要对IE做点过滤功能,即可达到您想要的结果。
六、若有疑问,先减少百分比
有时候某些错误会使50%+50%成为100.1%,使网页出现问题。这时请尝试将这些值改为49%,甚至49.9%。

七、记住“TRBL”写法

border,margin与padding的简写语法有特定顺序,从上方开始顺时针方向转动:top,right,bottom,left. 所以margin:0 1px 3px 5px;的结果是上方无边界,右边1像素,以此类推。记住“TRBL”,您就不会弄错次序了。

八、只要不是零的值,都要指定单位

这需要特别注意,很多新手朋友往往忽视这个问题。不止一只强调这个问题了。

网页设计中CSS布局是很重要的部分,下面介绍几种检查调试CSS布局的有效方法。

1. 检查HTML元素是否有拼写错误、是否忘记结束标记

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

2. 检查CSS是否书写正确

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

3. 用删除法确定错误发生的位置

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

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

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

5. 是否忘记了写DTD?

如果无论怎样调整不同浏览器显示结果还是不一样,那么可以检查一下页面开头是不是忘了写下面这行DTD
如没有注明,文章为柏思网络原创,转载时请注明来源 http://www.boonet.cn/article-781-1.html
新闻分类

Hi,Are you ready?

准备好开始了吗?
那就与我们取得联系吧

有网站建设的项目想和我们谈谈吗?您可以填写右边的合作意向表格,让我们了解您的项目需求,这是一个良好的开始,我们将会尽快与你取得联系。当然也欢迎您与我们在线商务沟通或打电话咨询,让我们听到你的声音!

BOONET 柏思网络

业务热线:0755-33889986

E-mail:boonet@boonet.cn

您需要的服务

现有网站改版
我需要做微信营销
建设全新的企业网站
要找长期合作公司,需要年度服务
我需要做购物商城
我需要做系统平台

您最关注的地方

对功能要求比较高
对设计创意要求比较高
需要可以购物支付
搜索引擎排名

预算

4-6千 1万-3万 4万-6万 7万以上 项目需要招标

关闭

关闭

关于我们

柏思网络专注网站建设,我们以领先的设计水平和网站开发技术实力,打造深圳网站建设行业品牌。公司的服务宗旨是:"用良心做好服务,用实力做好质量!"

联系我们

  • 地址: 深圳宝安福永兴围科技大厦811
  • 电话: 0755-33889986
  • Email: boonet@boonet.cn
扫描二维码 关注我们官方微信 解决建站问题
建站热线

0755-33889986

周一至周六9:00-18:00

售后服务 / 投诉处理

Powered by Boonet © 2014-2017 boonet.cn .  深圳市柏思网络科技有限公司 版权所有    | 粤ICP备14004448号-3

柏思网络专注深圳网站建设 深圳网站制作 深圳网站设计 深圳网站开发 深圳网页设计专业网站建设公司。柏思网络法律顾问:刘付汉文律师   

 
提交需求
QQ在线咨询
咨询一热线
0755-33889986
咨询二热线
400-698-0762