奇宝库 > 喜欢在DreamWeaver中编写CSS代码的朋友应该了解的几个习惯

喜欢在DreamWeaver中编写CSS代码的朋友应该了解的几个习惯

不提倡用DreamWeaver写CSS。但是由于它的“可视化”和易操作性,还是有很多朋友在用。今天,这里有一些“最好的习惯”,希望能帮助到这些朋友。

CSS正在改变网站设计的过程。Macromedia DW MX引入了一些新的和改进的CSS相关功能,以满足面向CSS的设计人员不断增长的需求。有了这些新特性,您可以为将来的更新制定计划,并开发与W3C标准更加兼容的站点。本文讨论了一些关于在DW MX中使用CSS和突出CSS特性的建议。

一般来说,样式表是控制web内容外观的格式规则的集合。CSS可以以三种不同的方式在页面中使用:

内联:写入代码的一次性样式。

嵌入式:可以控制页面中所有元素的样式表。

外部:可以控制许多页面中的元素的样式表。

其实很多网站都是根据需求结合这三种方式。

使用CSS时,不同的浏览器和同一浏览器的不同版本解析CSS的方式不同是事实。除了网络浏览器的差异,你还应该意识到还有许多其他的浏览器,如听力浏览器、基于电视的浏览器和掌上电脑和TTY(电传打字机)等手持设备。

最好的习惯是什么?

大多数技术都有自己的既定标准。CSS也不例外。虽然网络上存在的CSS并不都是标准的,但是按照现有的标准使用CSS是有好处的。一般来说,开发人员应该尽量将内容与报表分离。这样做的好处是:

1.增加网站的寿命。

非标准的样式表当时可能觉得方便,但是新版浏览器出来后,很可能会出现兼容性问题。那个时候,一页一页的修改网站是一件非常耗时的事情,也让使用CSS变得毫无意义。

2.让你的网站适用于所有用户和浏览器。

一些地方政府已经立法规定网站必须对残疾人无障碍。为残障意识设计的浏览设备,如听障浏览器,对CSS标准化有着极其严格的要求。

3.使网站的更新和维护更加容易。

如果使用得当,CSS可以快速将一个页面中的调整应用到所有页面。

您必须做出的第一个选择是使用哪个样式表。说到最佳习惯,不同样式表的分析如下:

内联CSS简单来说,你应该尽量避免使用它。除了一些其他的缺点,使用内联CSS意味着你没有利用CSS的真正优势,也就是说,你没有把内容和格式分开。DW MX使用内联CSS主要是为了定位页面元素(这些元素在DW MX的用户界面中称为“层”),或者使用一个DHTML特效,需要使用Inline-style & # 106 AvaScript来改变一个对象的属性。

嵌入式CSS:也不理想,因为只能影响当前页面。在更新的过程中,如果丢失了一个页面,网站的风格就会不一致;另外,当用户浏览你的站点时,每个页面都应该下载样式表信息。

外部CSS:这是你的首选。外部CSS可以使所有与之相连的页面保持一致的外观风格;大纲,改一次,轻松更新所有相关页面;缩小你的页面,加快浏览速度。在下面分析具体的CSS特性时,将会提到CSS的其他一些最佳习惯。

在DW MX中创建CSS样式表

在DW MX(Text《CSS Style》New Style Sheet)中创建CSS样式表时,在弹出的对话框中,有两种选择:New Style Sheet File和Only This Document。选择“新建样式表文件”,您将开始创建外部CSS的过程。此选项要求您在实际创建之前命名样式表并选择保存位置;另一个选项,仅本文档,将直接把相关代码写到页面的该部分。

您也可以在“新建样式”对话框中选择现有样式表来编辑或添加新定义。

我应该连接到外部CSS还是导入它?

创建外部样式表后,您需要将其附加到每个页面(或模板)上。为此,您可以在CSS面板上的淡季点击“附加样式表”按钮,弹出链接外部样式表的对话框,您可以在其中浏览到您的目标样式表的名称。找到它之后,您可以选择链接或导入这个外部样式表。

连接是最常见的方式。选择“链接”将样式表连接到页面。它将向您的页面添加以下标记:

所有支持CSS的浏览器都支持连接选项。如果你想让一些比较老的浏览器(比如Netscape 4.x)来“看到”这个样式表,你应该采用下面的方法。

如果选择“导入”选项,使用的标签是:

Netscape 4将完全忽略导入的CSS,并根据连接的CSS解释页面。这样,我们就可以放心地使用CSS中的新功能,而不必担心浏览器的兼容性。

CSS属性检查器

您可以在DW MX的属性检查器中轻松切换到CSS模式。默认情况下,属性检查器以原始HTML模式显示字体标签。点击字体下拉菜单旁边的小“A”,可以看到当前可用的CSS样式表,而不是字体标签列表。

同时,您可以轻松切换回HTML模式。

现成的CSS样式表

DW MX中一个令人兴奋的CSS特性是它包含了准备好的CSS样式表。CSS新用户可以先体验一下。选择“文件”“新建”,在弹出的“新建文档”对话框中选择“CSS样式表”,右边的框中会出现所有可用CSS的列表。要实践我们所说的最佳习惯,选择一个标有“可及”的。

将文档保存在站点文件夹中,然后可以使用上述方法将CSS附加到文档中。

设计时样式表(设计时样式表)

DW MX的这一功能允许您在设计视图中工作时将样式表应用于页面,并使您对网站的外观有更直观的了解。设计时样式表不会出现在站点中。从我们的最佳习惯来看,这个功能非常有用。如果您同时使用导入和连接方法(如上所述),附加的设计时样式表允许您使用任何一种方法来开发站点。当您想要查看页面在另一个样式表下的外观时,您可以轻松地切换到另一个样式表。

对于希望将CSS应用于服务器端(如ASP、php或ColdFusion)或通过& # 106 AvaScript在客户端访问它的开发人员来说,设计时样式表也很有用。服务器端样式表是处理客户端浏览器CSS支持差的另一种方式。但是在之前版本的DW中,这种方法无法让你在设计阶段就检查CSS的实际效果。设计时间样式表允许您实时查看样式表的效果,因此您可以在DW MX中使用可视化界面。另一个好处是,当你上传站点文件时,你不必检查整个站点是否有多余的样式表。

确认

无论您是创建自己的样式表还是编辑现有的样式表,验证都可以确保您不会误用非标准标签或错误代码。DW MX本身不包含CSS验证程序,可以使用W3C站点提供的验证服务。在DW MX中,您可以验证HTML或DHTML标记(文件检查页面验证标记(对于HTML)或文件检查页面验证为XHTML的XML。).DW MX在开发基于CSS的网站时提供了很多辅助工具。在MW MX的帮助下,加上对CSS的充分了解,你就可以开发出一个经得起时间考验的网站。

本文来自网络,不代表本站立场,转载请注明出处: