书城计算机网络如何建设网站
6273600000007

第7章

65.网页色彩的搭配原理是什么?

网页的背景、文字、图标、边框及链接等,应该采用什么样的色彩,应该搭配什么色彩才能最好地表达网站的内涵和主题呢?下面是网页色彩搭配的一些原理:

(1)色彩的鲜明性。网页的色彩要鲜明,容易引人注目。

(2)色彩的独特性。要有与众不同的色彩,网页的用色必须要有自己独特的风格,这样才能给浏览者留下深刻的印象。

(3)色彩的艺术性。网站设计也是一种艺术活动,因此必须遵循艺术规律,在考虑到网站本身特点的同时,按照内容决定形式的原则,大胆进行艺术创新,设计出既符合网站要求,又有一定艺术特色的网站。不同色彩会使人产生不同的联想,色彩的选择要和网页的内涵相关联。

(4)色彩搭配的合理性。网页设计虽然属于平面设计的范畴,但又与其他平面设计不同,它在遵循艺术规律的同时,还考虑人的生理特点,合理的色彩搭配,给人一种和谐、愉快的感觉。避免采用纯度很高的单一色彩,这样容易造成视觉疲劳。

66.网页设计中色彩搭配有哪些技巧?

到底用什么色彩搭配好看呢?下面是网页色彩搭配的一些常见技巧:

(1)使用单色。尽管网站设计要避免采用单一色彩,以免产生单调的感觉,但通过调整色彩的饱和度和透明度也可以产生变化,使网站避免单调。

(2)使用邻近色。所谓邻近色,就是在色带上相邻近的颜色,如绿色和蓝色,红色和黄色就互为邻近色。采用邻近色设计网页可以使网页避免色彩杂乱,易于达到页面的和谐统一。

(3)使用对比色。对比色可以突出重点,产生强调的视觉效果。通过合理使用对比色能够使网站特色鲜明、重点突出。在设计时一般以一种颜色为主色调,对比色作为点缀,可以起到画龙点睛的作用。

(4)黑色的使用。黑色是一种特殊的颜色,如果使用恰当,设计合理,往往产生很强烈的艺术效果。黑色一般用作背景色,与其他纯度色彩搭配使用。

(5)背景色的使用。背景色一般采用素淡清雅的色彩,避免采用花纹复杂的图片和纯度很高的色彩作为背景色,同时背景要与文字色彩对比强烈一些。

(6)色彩的数量。一般初学者在设计网页时往往使用多种颜色,使网页变得很“花”,缺乏统一和协调,表面上看起来很花哨,但缺乏内在的美感。事实上,网站用色并不是越多越好,一般控制在3种色彩以内,通过调整色彩的各种属性来产生变化。

67.怎样放置网页导航栏?

导航栏既是网页设计中的重要部分,又是整个网站设计中一个较独立的部分。一般来说,网站中的导航栏在各个页面中出现的位置是比较固定的,而且风格也较为一致。导航栏的位置对网站的结构及各个页面的整体布局起着举足轻重的作用。

导航栏一般有四种常见的放置方式:左侧、右侧、顶部和底部。有的在同一个页面中运用了多种导航栏,例如,有的在顶部设置了主菜单,而在页面的左侧设置了折叠式的折叠菜单,同时又在页面的底部设置了多种链接,这样便增强了网站的可访问性。当然,导航栏并不是在页面中出现的次数越多越好,而是要合理运用,使页面达到总体的协调一致。

如果网页的页面比较长,最后在页面底部也设置一个导航栏。这样,如果浏览者正在阅读页面底部的内容,就不用再拖动浏览器滚动条来选择页面顶部的导航栏,而直接使用页面底部的导航栏即可。

68.如何选中插入的表格?

选中表格的方法有很多种,可以参照下列方法之一进行操作:

(1)将鼠标指针移动到表格的上方,当鼠标指针的形状变为形状按钮时,单击鼠标左键即可选中整个表格。

(2)将鼠标指针移动到表格的格线处,当鼠标指针的形状变为上下方向的箭头时,单击鼠标左键即可选中整个表格。

(3)将光标置于表格中,单击窗口左下角的<table>标记即可选中整个表格。

(4)将光标置于表格中,单击“修改”→“表格”“选择表格”命令,即可选中整个表格。

(5)将光标置于表格之外,按住“shift”键,然后在表格中的任意位置单击鼠标左键,即可选中整个表格。

选中表格后,表格的外框变成黑粗色,并在右方、下方和右下方各会显示一个黑色控制点,“属性”面板也会变为表格“属性”面板,在其中可以设置表格的属性。

69.为什么改变不了表格高度?

用鼠标拖动表格线,想把一个表格的高度缩小,可是无论怎么拖动目标,表格高度就是不变。出现这种情况一般是因为表格中的某个单元格设置了一个数值较大的行高所致,删除该单元格的行高值即可解决问题。如果表格过大,也可以在源代码编辑器中查找<tr>或<td>标签内的行高属性,然后将此属性清除即可。

70.如何使两个表格并排?

在文档中插入了两个表格,却发现第二个表格跑到第一个表格下面去了。要让这两个表格在同一行,可选中第一个表格,然后打开“属性”面板,在“对齐”下拉列表框中选择“左对齐”选项即可。

用同样的方法还可以设置表格和文字、表格和图形、图形和图形在一行,或者更多的表格和图片混排。

此外,还可以用以下代码实现两个表格并排:

71.为什么表格中的文字不会自动换行?

出现此问题有两种可能的情况:

(1)用户用CSS把表格内文字的字体设置成了英文字体,这样在Dreamweaver中表格内的文字就不会自动换行,但这仅是Dreamweaver中的显示效果,在IE里其实是可以正常换行的。如果希望在Dreamweaver的编辑状态也能使文字自动换行,把表格内文字的字体设置为中文字体即可(如宋体)。

(2)用户在表格中输入了一连串无空格的英文或数字,它们被IE识别为一个完整的单词,所以不会自动换行,遇到这种情况,转换到代码视图,在</head>标记之前添加以下代码即可:

72.如何制作表格阴影?

如果要制作表格阴影,可以将以下代码添加到<body></body>之间:

73.如何隐藏表格中单元格之间分隔线?

要隐藏表格中单元格之间分隔线,只需在插入表格后,在<table>标记中添加rules参数即可。当rules=cols时,表格会隐藏纵向的分隔线,这样就只能看到表格的行;当rules=rows时,则隐藏了横向的分隔线,这样只能看到表格的列;而当rules=none时,纵向分隔线和横向分隔线将全部隐藏。

74.如何隐藏表格的边框?

表格边框的显示与隐藏,是可以用frame参数来控制的。它只控制表格的边框,而不影响单元格。

若只显示上边框,可在<table>标记中添加table frame=above代码。

若只显示下边框,可在<table>标记中添加table frame=below代码。

若只显示左、右边框,可在<table>标记中添加table frame=vsides代码。

若只显示上、下边框,可在<table>标记中添加table frame=hsides代码。

若只显示左边框,可在<table>标记中添加table frame=lhs代码。

若只显示右边框,可在<table>标记中添加table frame=rhs代码。

若不显示任何边框,可在<table>标记中添加table frame=none代码。