css布局中有什么不好的习惯(CSS网页布局时常犯错误有哪些)

2026-04-11 17:30:01 :0

css布局中有什么不好的习惯(CSS网页布局时常犯错误有哪些)

大家好,css布局中有什么不好的习惯相信很多的网友都不是很明白,包括CSS网页布局时常犯错误有哪些也是一样,不过没有关系,接下来就来为大家分享关于css布局中有什么不好的习惯和CSS网页布局时常犯错误有哪些的一些知识点,大家可以关注收藏,免得下次来找不到哦,下面我们开始吧!

本文目录

CSS网页布局时常犯错误有哪些

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

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

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

MacIE下如果对float的元素的父元素使用clear属性,周围的float元素布局就会混乱。

DW制作网页时使用CSS该注意什么!

很多CSSer是从以前的网页制作中开始学习CSS网页布局的,或许还存在着一定的DW习惯。希望此文能帮助大家理解和纠正一些不好的习惯。
  由于“可视化”和操作简便,在DW中编写CSS的朋友很多,今天我们介绍一些在DW中编写CSS的“最佳习惯”,希望对大家有所帮助。
  CSS正在改变网站设计的进程。为迎合不断增长的倾向于CSS的设计人员的需求,Macromedia DW MX引进了一些新的及改善过的CSS相关的特性。有了这些新的特性,你可以为未来的更新作好计划,开发与W3C标准更加兼容的站点。本文讨论在DW MX中使用CSS以及突出某一特定CSS特性时的一些建议。
  一般地讲,样式表(style sheet)就是控制网页内容外观的格式化的规则的集合。可以以三种不同的方式在你的页面中使用CSS:
  代码式(Inline):写入到代码中的一次性的样式。
  内嵌式(Embedded):可控制一个页面中所有元素的样式表
  外联式(External):可控制许多页面中的元素的样式表
  事实上,许多站点都根据需要把这三种方式结合起来使用。
  在使用CSS时一个需要重点考虑的事实是不同的浏览器以及同一浏览器的不同版本以不同的方式来解析CSS。除了网络浏览器的差异之外,你还要意识到还有很多其他的浏览器,比如听力浏览器,基于电视的浏览器以及Palm pilot和TTY(teletypewriter,远程打字机)一类的手持设备。
  大多数技术都有自己约定俗成的标准。CSS也不例外。虽然并非网络上存在的所有CSS都很规范,但按照现有标准来使用CSS却还是不无裨益的。一般来说,开发人员应尽可能将内容与报告分离开来。这样做的好处在于:
  1、增加站点的寿命
  不规范的样式表可能在当时觉得很方便,但新版本的浏览器出来以后,很可能就会出现兼容性问题。到时逐页修改站点就是一项非常费时的工作同时也使使用CSS失去了意义。
  2、让你的站点对所有的用户以及浏览器都适用
  有些地方的政府已经立法要求网站必须让残障人士也同样可以浏览。为残障认识设计的浏览设备,比如听力浏览器,对CSS规范性要求极其严格。
  3、让站点更新和维护更加轻松
  使用方式得当的话,CSS可让你在一个页面中的调整快速应用到所有页面中去。
  你首先要做的选择是使用哪一种样式表。当涉及到最佳习惯时,对不同样式表的分析如下:
  Inline CSS:简单地说,你应该尽量避免使用。除了一些其他的缺点之外,使用Inline CSS意味着你并没有利用到CSS的真正优点,即你并没有将内容与格式分离开。DW MX使用Inline CSS主要是为了定位页面元素(这些元素在DW MX的用户界面中称为“层(layer)”),或者为了使用某个DHTML特效,它需要使用Inline 样式的javascript来改变一个对象的属性。
  Embedded CSS:它也不是最理想的,因为它只能对当前页面施加影响。在更新的过程中,如果某一个页面丢失,将会使站点的风格不一致;另外,当用户浏览你的站点时,每一页都要下载一次样式表信息。
  External CSS:这是你的第一选择。External CSS可以让所有连接到它的页面保持一致的外观风格;提纲挈领,更改一次,轻松更新所有相关页面;让你的页面体积更小,浏览速度更快。

Html和CSS布局技巧总结(偶尔回顾回顾布局也是很有必要的)

优点:兼容性好;
不足:需要同时设置子元素和父元素;

优点:兼容性好
缺点: 需要指定宽度

优点:只需要对自身进行设置
不足:IE6,7需要调整结构

不足:兼容性差,IE9及以上可用

缺点:兼容性差,如果进行大面积的布局可能会影响效率

在使用vertical-align的时候,由于对齐的基线是用行高的基线作为标记,故需要设置line-height或设置display:table-cell;

该布局方式非常常见,适用于定宽的一侧常为导航,自适应的一侧为内容的布局

注:IE6会有3px的bug

如果我们需要将两列设置为等高,可以用下述方法将“背景”设置为等高,其实并不是内容的等高

利用右侧容器的flex:1,均分了剩余的宽度,也实现了同样的效果。而align-items 默认值为stretch,故二者高度相等

基本html结构为父容器为parent,自容器为left,center,right.其中,left,center定宽,right自适应

多列等分布局常出现在内容中,多数为功能的,同阶级内容的并排显示等。

html结构如下所示

如果你还想了解更多这方面的信息,记得收藏关注本站。

css布局中有什么不好的习惯(CSS网页布局时常犯错误有哪些)

本文编辑:admin

更多文章:


immediately的用法(immediately的含义及用法)

immediately的用法(immediately的含义及用法)

大家好,immediately的用法相信很多的网友都不是很明白,包括immediately的含义及用法也是一样,不过没有关系,接下来就来为大家分享关于immediately的用法和immediately的含义及用法的一些知识点,大家可以关注

2026年4月28日 23:00

prepare for disappointment(disappointment是什么意思)

prepare for disappointment(disappointment是什么意思)

大家好,如果您还对prepare for disappointment不太了解,没有关系,今天就由本站为大家分享prepare for disappointment的知识,包括disappointment是什么意思的问题都会给大家分析到,还

2025年12月26日 11:15

backspace用英文怎么读(Backspace,这个键怎么读)

backspace用英文怎么读(Backspace,这个键怎么读)

本篇文章给大家谈谈backspace用英文怎么读,以及Backspace,这个键怎么读对应的知识点,希望对各位有所帮助,不要忘了收藏本站喔。本文目录Backspace,这个键怎么读backspace怎么读音bαckspαce英语怎么读bac

2025年10月1日 12:45

javaweb实验心得(求一份java上机实验心得,300字左右)

javaweb实验心得(求一份java上机实验心得,300字左右)

大家好,关于javaweb实验心得很多朋友都还不太明白,不过没关系,因为今天小编就来为大家分享关于求一份java上机实验心得,300字左右的知识点,相信应该可以解决大家的一些困惑和问题,如果碰巧可以解决您的问题,还望关注下本站哦,希望对各位

2025年7月1日 05:45

html表单重置(HTML如何清空表单信息)

html表单重置(HTML如何清空表单信息)

今天给各位分享HTML如何清空表单信息的知识,其中也会对HTML如何清空表单信息进行解释,如果能碰巧解决你现在面临的问题,别忘了关注本站,现在开始吧!本文目录HTML如何清空表单信息在HTML上将表单中lnput元素的TYPE属性设置为什么

2025年5月25日 05:15

fgets函数的作用是(标准函数fgets(s,n,f)的功能是)

fgets函数的作用是(标准函数fgets(s,n,f)的功能是)

本篇文章给大家谈谈fgets函数的作用是,以及标准函数fgets(s,n,f)的功能是对应的知识点,希望对各位有所帮助,不要忘了收藏本站喔。本文目录标准函数fgets(s,n,f)的功能是C语言文件习题:在C语言中,函数fgets(str,

2025年12月10日 18:30

settimeout类型(setTimeout()和setInterval()方法的区别)

settimeout类型(setTimeout()和setInterval()方法的区别)

今天给各位分享setTimeout()和setInterval()方法的区别的知识,其中也会对setTimeout()和setInterval()方法的区别进行解释,如果能碰巧解决你现在面临的问题,别忘了关注本站,现在开始吧!本文目录set

2026年5月26日 18:30

今日头条免费素材库(自媒体微信公众号怎么找写作素材)

今日头条免费素材库(自媒体微信公众号怎么找写作素材)

“今日头条免费素材库”相关信息最新大全有哪些,这是大家都非常关心的,接下来就一起看看今日头条免费素材库(自媒体微信公众号怎么找写作素材)!本文目录自媒体微信公众号怎么找写作素材今日头条我的素材怎么添加今日头条盗用素材会怎么样自媒体微信公众号

2026年8月26日 22:00

prefs文件怎么打开(C4D如何导出自定义快捷键该文件后缀为res的格式)

prefs文件怎么打开(C4D如何导出自定义快捷键该文件后缀为res的格式)

大家好,prefs文件怎么打开相信很多的网友都不是很明白,包括C4D如何导出自定义快捷键该文件后缀为res的格式也是一样,不过没有关系,接下来就来为大家分享关于prefs文件怎么打开和C4D如何导出自定义快捷键该文件后缀为res的格式的一些

2026年9月21日 22:30

什么是sophisticated(sophisticated 是什么意思)

什么是sophisticated(sophisticated 是什么意思)

各位老铁们,大家好,今天由我来为大家分享什么是sophisticated,以及sophisticated 是什么意思的相关问题知识,希望对大家有所帮助。如果可以帮助到大家,还望关注收藏下本站,您的支持是我们最大的动力,谢谢大家了哈,下面我们

2026年1月3日 14:15

下列()是正确的(下列说法正确的是( ))

下列()是正确的(下列说法正确的是( ))

大家好,今天小编来为大家解答以下的问题,关于下列()是正确的,下列说法正确的是( )这个很多人还不知道,现在让我们一起来看看吧!本文目录下列说法正确的是( )下列判断正确的有()下列描述正确的是( )下列说法中正确的是( )下列说法正确的是

2025年9月29日 06:45

struts sql结构(如何理解SQL servers的体系结构)

struts sql结构(如何理解SQL servers的体系结构)

这篇文章给大家聊聊关于struts sql结构,以及如何理解SQL servers的体系结构对应的知识点,希望对各位有所帮助,不要忘了收藏本站哦。本文目录如何理解SQL servers的体系结构struts1 的sql语句一般放在哪个文件下

2025年11月3日 18:00

iferror函数参数使用(excel2010表格中如何使用iferror函数 iferror函数在excel中使用方法)

iferror函数参数使用(excel2010表格中如何使用iferror函数 iferror函数在excel中使用方法)

大家好,如果您还对iferror函数参数使用不太了解,没有关系,今天就由本站为大家分享iferror函数参数使用的知识,包括excel2010表格中如何使用iferror函数 iferror函数在excel中使用方法的问题都会给大家分析到,

2026年4月26日 15:15

holders是什么意思(clear holders 什么意思)

holders是什么意思(clear holders 什么意思)

本篇文章给大家谈谈holders是什么意思,以及clear holders 什么意思对应的知识点,文章可能有点长,但是希望大家可以阅读完,增长自己的知识,最重要的是希望对各位有所帮助,可以解决了您的问题,不要忘了收藏本站喔。本文目录clea

2025年12月9日 21:00

js文件下载(js 下载文件 不提示保存 直接下载)

js文件下载(js 下载文件 不提示保存 直接下载)

大家好,关于js文件下载很多朋友都还不太明白,不过没关系,因为今天小编就来为大家分享关于js 下载文件 不提示保存 直接下载的知识点,相信应该可以解决大家的一些困惑和问题,如果碰巧可以解决您的问题,还望关注下本站哦,希望对各位有所帮助!本文

2025年7月31日 05:00

linux下安装jdk解压就完了(linux下安装jdk并设置环境变量)

linux下安装jdk解压就完了(linux下安装jdk并设置环境变量)

大家好,如果您还对linux下安装jdk解压就完了不太了解,没有关系,今天就由本站为大家分享linux下安装jdk解压就完了的知识,包括linux下安装jdk并设置环境变量的问题都会给大家分析到,还望可以解决大家的问题,下面我们就开始吧!本

2025年12月22日 12:30

小黄豆怎么做好吃(大豆怎么做好吃又简单)

小黄豆怎么做好吃(大豆怎么做好吃又简单)

大家好,关于小黄豆怎么做好吃很多朋友都还不太明白,不过没关系,因为今天小编就来为大家分享关于大豆怎么做好吃又简单的知识点,相信应该可以解决大家的一些困惑和问题,如果碰巧可以解决您的问题,还望关注下本站哦,希望对各位有所帮助!本文目录大豆怎么

2026年5月11日 18:15

持续集成框架(jmeter持续集成为什么要用ant)

持续集成框架(jmeter持续集成为什么要用ant)

各位老铁们好,相信很多人对持续集成框架都不是特别的了解,因此呢,今天就来为大家分享下关于持续集成框架以及jmeter持续集成为什么要用ant的问题知识,还望可以帮助大家,解决大家的一些困惑,下面一起来看看吧!本文目录jmeter持续集成为什

2025年6月22日 22:15

cite和citation(cite的意思及用法)

cite和citation(cite的意思及用法)

其实cite和citation的问题并不复杂,但是又很多的朋友都不太了解cite的意思及用法,因此呢,今天小编就来为大家分享cite和citation的一些知识,希望可以帮助到大家,下面我们一起来看看这个问题的分析吧!本文目录cite的意思

2026年3月1日 07:15

python基础编程代码(Python中的程序基本结构有哪些呢)

python基础编程代码(Python中的程序基本结构有哪些呢)

“python基础编程代码”相关信息最新大全有哪些,这是大家都非常关心的,接下来就一起看看python基础编程代码(Python中的程序基本结构有哪些呢)!本文目录Python中的程序基本结构有哪些呢python新手代码是什么Python中

2026年9月3日 20:00

近期文章

本站热文

electronics软件(labcenter electronics是什么软件)
2025-05-22 23:45:02 浏览:134
博客是微博吗(博客是微博吗)
2025-05-22 22:45:01 浏览:111
diversity and distribution(悬赏英语短文)
2025-05-23 16:15:02 浏览:107
ios软件开发前景(iOS就业前景怎么样)
2025-05-22 23:00:01 浏览:102
next month(有The next month这个单词吗,和 next month有什么区别)
2025-05-23 02:30:01 浏览:102
patron(patron是什么意思)
2025-05-23 10:30:02 浏览:95
标签列表

热门搜索