首页 web前端 css教程 CSS设计网页页面时的常见错误预防技巧(收藏)

CSS设计网页页面时的常见错误预防技巧(收藏)

Nov 26, 2018 pm 03:43 PM
常见错误

本篇文章给大家带来的内容是关于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设计网页页面时的常见错误预防技巧的全部介绍,如果您想了解更多有关CSS3教程,请关注PHP中文网。


以上是CSS设计网页页面时的常见错误预防技巧(收藏)的详细内容。更多信息请关注PHP中文网其他相关文章!

本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

AI Hentai Generator

AI Hentai Generator

免费生成ai无尽的。

热工具

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器

SublimeText3汉化版

SublimeText3汉化版

中文版,非常好用

禅工作室 13.0.1

禅工作室 13.0.1

功能强大的PHP集成开发环境

Dreamweaver CS6

Dreamweaver CS6

视觉化网页开发工具

SublimeText3 Mac版

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

PHP查询语句注意事项及常见错误 PHP查询语句注意事项及常见错误 Mar 22, 2024 am 11:42 AM

PHP是一种被广泛应用在Web开发中的编程语言,它可以与各种数据库进行交互来实现数据的查询和操作。在使用PHP进行查询操作时,我们需要特别注意一些事项,避免常见的错误,下面将详细介绍PHP查询语句的注意事项及常见错误,并提供具体的代码示例来帮助读者更好地理解。一、连接数据库在进行PHP查询之前,首先需要连接数据库。使用PHP内置的mysqli(MySQLI

WordPress常见错误全解析:技巧拯救你的网站 WordPress常见错误全解析:技巧拯救你的网站 Mar 05, 2024 pm 06:12 PM

《WordPress常见错误全解析:技巧拯救你的网站》WordPress作为一款广受欢迎的网站建设平台,在使用过程中难免会遇到一些问题和错误。本文将针对一些常见的WordPress错误进行详细解析,并提供具体的代码示例,帮助网站管理员轻松解决问题,提升网站运行效率和用户体验。1.白屏错误当访问WordPress网站时出现白屏,通常是由于PHP代码错误导致的

常见的Golang类型转换错误及其解决方案 常见的Golang类型转换错误及其解决方案 Feb 25, 2024 am 08:30 AM

Golang类型转换的常见错误及解决方法在使用Golang进行开发的过程中,类型转换无疑是一个经常遇到的问题。虽然Golang是一种静态类型的语言,但是在一些情况下我们仍然需要进行类型转换,比如从interface{}类型转换为具体的结构体类型,或者从一个基本数据类型转换为另一个基本数据类型。然而,类型转换时经常会出现一些错误,本文将介绍一些常见的类型转换错

C++程序中遇到的常见错误及解决方案:'segmentation fault'错误 C++程序中遇到的常见错误及解决方案:'segmentation fault'错误 Aug 26, 2023 pm 12:42 PM

C++程序中遇到的常见错误及解决方案:'segmentationfault'错误在C++编程过程中,我们常常会遇到各种错误。其中,一个常见的错误是“segmentationfault”(段错误)。当程序运行时出现这个错误时,通常会意味着程序试图访问一个不存在或非法的内存地址,导致程序崩溃。这种错误可能会使程序执行失败,并在命令行或终端中显示一条错误消息。

10个常见PHP语法错误及如何避免 10个常见PHP语法错误及如何避免 Jun 22, 2023 pm 12:48 PM

PHP作为当前Web编程领域中最为流行的脚本语言之一,其简单、快速、灵活的特性受到广大程序员的热爱。但是在实际的开发过程中,我们难免会遇到各种各样的语法错误,比如:拼写错误、缺少分号、大小写错误等等。作为程序员,要尽可能的减少这些低级错误,以提高代码的质量和自己的开发效率。下面我们就来总结一下10个常见PHP语法错误及如何避免。一、变量名大小写问题PHP中的

掌握CentOS上搭建web服务器的方法,避免常见错误 掌握CentOS上搭建web服务器的方法,避免常见错误 Aug 06, 2023 am 08:24 AM

掌握CentOS上搭建web服务器的方法,避免常见错误作为一款开源的操作系统,CentOS在服务器领域得到了广泛应用。搭建web服务器是使用CentOS的常见需求之一。本文将介绍搭建web服务器的详细方法,并提醒读者避免常见错误。一、安装ApacheApache是一款强大而稳定的web服务器软件,使用广泛。我们首先要安装Apache。在终端输入以下命令安装A

PHP开发者必知!常见的PHP错误类型详解 PHP开发者必知!常见的PHP错误类型详解 Mar 27, 2024 pm 10:24 PM

PHP开发者必知!常见的PHP错误类型详解,需要具体代码示例在PHP开发过程中,难免会遇到各种各样的错误。了解不同类型的错误是非常重要的,因为它们可以帮助我们更快地定位和解决问题。本文将详细解释一些常见的PHP错误类型,以及提供具体的代码示例。1.语法错误语法错误是在编译PHP脚本时发生的错误,通常是由于拼写错误、括号不匹配或引号错误等造成的。这种错误会导

避免踩坑:掌握Golang指针的注意事项和常见错误 避免踩坑:掌握Golang指针的注意事项和常见错误 Jan 24, 2024 am 10:48 AM

Golang指针的注意事项和常见错误,帮你避免踩坑在Golang中,指针是一种特殊的数据类型,它存储了一个变量的地址。通过指针,我们可以直接访问和修改相应地址上存储的值。使用指针可以提高程序的效率和灵活性,但同时也容易出现一些错误。本文将介绍Golang指针的注意事项,并通过具体的代码示例帮助你避免可能踩的坑。不要返回局部变量的指针当我们想要返回一个指针时,

See all articles