4.网站外观设计

四、网站外观设计永城职业学院彭勃永城职业学院彭勃2网站外观的重要性网站不仅要有能满足客户需求的功能，还要有一个美观、合体的外观。原因如下：•如果你不稍微洗洗干净，梳妆打扮一下就出来见人，人家会对你热情客气吗？只想教你快点走开。•外套很重要。哪怕你穿了件又脏又臭，还有几个破洞的内衣，只要外套搞得笔挺、干净一点，整个人都会显得精神，你的女朋友对你的第一印象就会好。•当然内衣不是不重要，否则当你脱掉了外套，露出了皱皱巴巴，领口黑黑的烂衬衫时，你的女朋友准把你的好形象一抹而空，八成就和你吹了。综上，网站的外观和功能同样重要！永城职业学院彭勃3CSS是什么？CSS（CascadingStyleSheet，层叠样式表）是用于（增强）控制网页样式并允许将样式信息与网页内容分离的一种标记性语言。在网页中使用CSS的方法有三种：•内联样式•嵌入样式表•链入外部样式表永城职业学院彭勃4实验一（上）内联样式永城职业学院彭勃5CSS中的度量单位px相对长度单位。像素（Pixel）。像素，屏幕上显示的最小单位，用于网页设计，直观方便。pt绝对长度单位。点（Point）。是一个标准的长度单位，1pt＝1/72英寸，用于印刷业，非常简单易用。pc绝对长度单位。皮卡（Pica）。1皮卡=12点。mm绝对长度单位。毫米（Millimeter）。永城职业学院彭勃6CSS中的度量单位cm绝对长度单位。厘米（Centimeter）。in绝对长度单位。英寸（Inch）。1in=2.54cm=25.4mm=72pt=6pcem相对长度单位，大写字母“M”的高度。ex相对长度单位。相对于小写字母“x”的高度。此高度通常为字体高度的一半。永城职业学院彭勃7实验一（下）嵌入样式表永城职业学院彭勃8补充：样式表中样式的种类元素样式指定的所有HTML标记都会使用该样式。样式类需被class属性引用才能生效，常用于跨元素的相同样式。ID样式只能用在指定ID的单一元素。锚伪类将样式应用于动作而非元素。永城职业学院彭勃9实验二链入外部样式表永城职业学院彭勃10课后作业1.阅读理解第二天实验中使用的样式表文件。2.用学到的样式技巧，继续改进个人所选网站的（母版页或其它页面的）外观布局。3.撰写实验报告。永城职业学院彭勃11另一种外观设计——主题主题是ASP.NET2.0中的新增功能，用来定义页面和服务器端控件的外观。主题由一组元素组成：皮肤，CSS，图像和其它资源（控件所需图片，脚本文件，声音文件）。永城职业学院彭勃12为什么要使用主题？服务器端控件在不同的浏览器上（尤其是老浏览器上）可能被翻译成不同的标记，所以需要一种专门用于服务器端控件的外观机制，这就是皮肤。当所有的外观都设计在主题中，且已经创建了多个主题时，设计站点就可以不用考虑样式，改变样式时也无需更新页或应用程序代码。永城职业学院彭勃13让我们来为网站设计主题和皮肤吧！永城职业学院彭勃14实验三创建主题和源页面永城职业学院彭勃15实验四继续扩充源页面永城职业学院彭勃16实验五由源页面生成皮肤将相同颜色的控件的源代码复制粘贴到对应颜色的skin文件中。删除两个skin文件中可能存在的br/标记。删除所有控件的ID属性。删除Label控件的Text属性，并各手动添加一个SkinId属性，值为colorText。为两个文件中的ImageButton控件增加值为homeImage的SkinId属性。永城职业学院彭勃17下次课，我们将学习ASP.NET主题的应用！永城职业学院彭勃18ASP.NET动态网站的数据库读取