在科技发展迅速,快节奏的生活状态下,网络已经成为人们信息普及的主要来源,手机网络尤其受欢迎,造就了今天的低头族。网页设计师已经在历史的潮流中占据了重要角色。下面是搜索整理的网页设计与制作论文8篇,供大家阅读参考。
网页设计与制作论文第一篇:网页制作中CSS的优点及其特效制作
摘要:互联网时代,网页已经成为公司、个人展示自我的最好途径和手段,网站、网页制作是目前最常用的展示个人能力的手段和方法,文章通过介绍CSS (层叠式样式表)网页制作流程,并与传统的frontpage网页制作进行对比,总结更好的网页制作技巧。
关键词:CSS样式表; 网页设计; 表格;
0 引言
样式表CSS的英文名为Cascading Style Sheets,又翻译为层叠式样式表,在很多网页制作的课程中都提及如何使用CSS样式表实现网页制作的特定效果的技巧,通过CSS的定义,可以定义整体网页的显示定位、字体的格式大小、元素定位、超级链接的样式,还便于导航栏的制作,能实现图片、文字环绕等一些特定的网页展示效果,既能减少代码量,又可以增强设计效果,而且页面也更灵活多变。
1 CSS相较传统Table制作的优点
通常,CSS可以嵌入html页面中,但是通常的做法是生成一个.css的脚本文件,然后通过html调用该.css文件,如<link href="*.css"type="text/css"rel="stylesheet">。
CSS一般会配合DIV一起使用,在结构上的优势主要体现在以下几个方面。
(1)设计手段灵活,可将表现与设计分离,网站建设形式更为灵活。我们在建设网站的时候,可以将页面进行单独的CSS设计,各功能也只需要进行文字的显示即可。
(2)布局更规范、代码更清晰易懂,有利于网站管理员的维护与操作。当网站的整体基调需要变换颜色时,可以直接在css文件里调整布局的颜色;同样,当某几个栏目位置需要变动时,也仅需要在页面将对应的div的位置重新定位;调整某些栏目时,只需修改若干样式文件。这种区域化、“块”理念的设计大大减轻了网站维护人员的工作量,为以后网页的设计、改版打下了良好的基础。
(3)具备更好的控制结构排版能力。我们通过框架结构定位需要显示的元素的位置,可以有效修正原html表格中一些实现起来比较困难的地方,比如整体页面的定位、表格内容的显示等,在传统html中经常会出现错位的情况,因此对行间距的设置、行数的设置都需要非常精确,否则设计的页面表格就会出现错位偏差。
(4)更易于维护及改版工作。上述特点决定了使用样式表格在维护和改版时,修改的工作量可以集中到某一点,避免重复的设计和布局,大大减轻代码设计人员的工作量。
2 利用CSS制作特效
2.1 滤镜效果
简单来说,滤镜就是类似于我们Photoshop里面的图文特效,CSS的滤镜属性的标识符是Filter,我们通过对Filter各属性的配置数值的不同[如brightness()设置亮度,blur()设置模糊度,contrast()设置对比度,drop-shadow()设置阴影效果],将多个属性值配合,就可以实现很多我们意想不到的效果。
在遇到特殊的纪念日时,如南京大屠杀纪念日或某些特别的日子,我们需要将网页页面设置成灰色,这时可以使用CSS,通过其中的Gray滤镜就可以轻松实现这一效果(如图1所示);结合Javascript和滤镜技术我们还可以制作许多动态的效果,如自定义鼠标移动到特定区域位置或离开时显示不同效果图或背景颜色。
图1 CSS里gray滤镜特效
2.2 文字特效
针对显示信息的网站,其对文字经常会有一些特效要求,如阴影、3D特效、霓虹灯、凸出浮雕效果等。而在在html中没有太多可展示文字特色的手段,只有字体、大小、下划线几种表现手段,但是如果使用CSS样式应就不同了,其属性text-shadow有两个作用,产生阴影和模糊主体,不同的属性取值可以表达出多种文字效果,即使不使用图片,也可以给文字增加质感。
2.3 动态下拉菜单效果
下一篇:长安大学
解决移动墙|域名墙的国内免备案云服务商!