《CSS&javascript动态网页设计与制作_吴以欣》pdf电子书免费下载
下载方式一：
百度网盘下载地址：https://pan.baidu.com/s/1XCyu52bPRYVcY1LRTm9N1A
百度网盘密码：1111
下载方式二：
http://ziliaoshare.cn/Download/ac_123501_pd_CSS&javascriptDTWYSJYZZ_WYX.zip
|
|
作者：吴以欣 页数：263 出版社：empty |
《CSS&javascript动态网页设计与制作_吴以欣》介绍
第1章HTML简介1.1HTML简介1.1.1网页与HTML当通过Internet浏览网页时， 会看到各种文字信息， 链接、图表， 图片等内容如Text(文本) ； 不同于一些编译性的程序语言， 例如c、C++或Java等， HTML是一种文。Markup(标记) ：HTML的基本规则就是用“标记语言”——成对尖括号组成的标签元素早期的HTML版本不仅用标签元素描述网页的内容结构， 而且还用标签元素描述网页的排版
(1)用标签元素描述网页的内容结构；
(2) 用CSS描述网页的排版布局；
(3) 用JavaScript描述网页的事件处理， 即鼠标或键盘在网更元素上的动作后的程序。
本教材将以HIM L 4.01规范为标准进行讲解， 因此， 本章将主要讲述原则(1) 的内容， 原图1-1所示，浏览器是如何显示这些网页内容的呢?让我们通过浏览器查看这些网页的源代码， 如图1-2所示， 这些源代码就是浏览器可以“理解”的一种计算机语言——HTML。HTML是HyperText Markup Language的缩写， 中文翻译为“超文本标记语言”， 是制作网页的最基本语言，本解释性的程序语言，即它的源代码将不经过编译而直接在浏览器中运行时被“翻译”。来描述网页内容是如何在浏览器中显示的HTML最早作为一种标准的网页制作语言是在20世纪80年代末由科学家蒂姆·伯纳斯李(Tim Be mers-Lee) 提出的。当时他定义了22种标签元素， 发展至1999年12月， 由万维网联盟(W3C) 出版的HTML 4.01规范中还保留着其中的13种标签元素。2000年5月， HTML已成为―项国际标准(ISO/EC15445：2000) 。2008年1月， 万维网联盟已经出版了HTML 5.0规范的草案版布局。我们知道，在网页的设计中，网页的内容结构一般变化较小，但是阿页的排版布局可以千变万化。因此， 当需要改变网页的布局时， 就必须大量地修改HTML文档， 这给网页的设计开发带来了很多的不便。从HTML 4.0开始， 为了简化程序的开发， HTML已经尽量将“网页的内容结构”与“网页的排版布局”分开。
1.1.2编写及显示HTML文件名包括文件所在的文件夹名，如图1-3所示，浏览器就会显示出“翻译”后的网页效果。服务器的域名及该文件名， 如图1-4所示， 就可以通过Inte met浏览到这个网页的内容。这也就是在计算机中， 如果用HTML编写程序并保存为文件， 然后在浏览器“地址”栏中输人该文件如果将该文件放在一个网页服务器上，人们在浏览器“地址”栏中输入服务器的地址或指向当初科学家蒂姆·伯纳斯李发明HTML的目的——大家共享文件内容。HTML文件具有以下特点。·HTML文件是一种包含有成对标签元素的普通文本文件。因此， 我们可以用任意一种文本编辑器来编写， 例如Windows中的记事本、写字板等应用软件， 也可以使用任何一种编辑HTML文件的工具软件， 例如Adobe的Dreamweaver和Mic to soft的FrontPage等。。HTML文件必须以htm或html作为扩展名。两者并没有太大的区别， 只是对于一些老式计算机系统， 限制文件的扩展名只能由3个字母组成， 那么使用htm就会更为安全。本书的示例中将使用htm作为扩展名。
图1-4在岗其器中查看网页服务器上的HTML文件。HTML文件可以在大多数流行的网页浏览器上显示， 例如， 目前最流行的Microsoft的动态网更设计与解作——CS 5+la vaSe ripsInte met Explorer(以下简称IE) 和Mozilla的Firefox(以下简称Fie fox) 等。本书将使用Windows操作系统的IE测览器显示书中的示例。示例1-1是一个最简单的HTML程序。首先在文本编辑器中输人该程序(注意， 其中的行号仅用于本书的讲解， 因此程序中不需要输入行号) ， 保存文件名为chl_01.htm。示例1-1第一个HTML程序。
(1) 编写HTML程序时， 没有格式上的要求， 例如， 示例中的10行程序， 我们也可以将它们写成一行， 这是因为浏览器“翻译”HTML程序时是通过其中的标签内容进行的， 与程序的格式无关。但是为了便于程序的阅读和维护，我们应该根据标签的结构适时换行。(2) HTML的文件名最好不要有空格， 为了能符合大多数网页服务器的要求， HTML的文件名最好只包含有效的英文字符(A~Z，a~z.0-9)以及下划线(_)和减号线(一)，并且文件名的长度不要超过31个字符(包括扩展名)(3) 按下述方法进行操作， 就可以通过浏览器查看示例所编写的HTML程序效果。①在浏览器中单击菜单“文件”中的“打开”命令。③不断重复步骤②直到调试结束为止。
1.1.3标签、元素和属性在打开的对话框中单击“浏览”按钮，然后在打开的文件对话框中选择示例1-1中保存的文件chl_01.htm在显示的网页上单击“确定”按钮，就会得到如图1-3所示的效果。按下述方法进行操作， 可以调试HTML程序。在计算机中同时打开文本编辑器和网页浏览器， 并且在文本编辑器中打开HTML程序，例如chl_0.htm， 然后按步骤(3) 在网页浏览器中显示该网页内容。在文本编辑器中修改程序内容，例如，将示例中的“第一个”修改为“第二个”并保存该文件， 然后通过反复按下【A+Tub l组合键直到切换到网页浏览器窗口， 再按【F 5] 键或【Crl+Rl组合键就可以刷新浏览器窗口。从示例1-1中可以看出， HTML文档是由各种HTML元素组成的， 例如html(HTML文)元素、head(头) 元素、body(主体) 元素、t(题目) 元素和p(段落) 元素等。
HTML程序编写的内容就是标签、元素和属性
1.标签
HTML标签是由一对尖括号一和标签名称组成。标签分为“起始标器”和“结束标签”两种，二者的标签名称是相同的，只是结束标签多了一个斜杠“/ ，如图1-5所示，ch>为起始标签，S/b>为结束标签， “b”是标签名称， 它是英文“bold(粗体) 的缩写。标第一个整名称大小写是不敏感的，例如，c html>...c/h tmP>和个个.../HTML>的效果都是一样的， 但是HTML 4.01推荐使用小写字母， 因为下一代的HTML——XHTML规定， 标签名称必须是小写字母。
2.元素
HTML元素是组成HTML文档的最基本的部件， 它是用标签来表现的， 一般“起始标签”表示元素的开始，“结束标签”表示元素的结束。HTML元素分为“有内容的元素”和“空元素”两种。“有内容的元素”是由起始标签、结束标签以及两者之间的元素内容组成，其中元素内容既可以是需要显示在网页中的文字内容，也可以是其他元素。如示例1-1所示，起始标签与结束标签组成的元素，它的元素内容是文字“第一个”； 而起始标签
与结束标签组成的元素， 它的元素内容是另外一个元素——title元素。“空元素”则只有起始标签而没有结束标签和元素内容。如示例1-1所示， 其中的hr(横线)元素就是空元素。HTML元素还可以按另一种方式分为“块元素”和“行元素“块元素”在网页中的效果是该元素中的内容对于其前后元素的内容都另起一行，如图1-6左图所示p元素就是块元素，图1-6右图为p元素的网页效果。而“行元素”的网页效果则是，行元素中的内容对于其前后元素的内容都是在同一行中，如图1-7左图所示a元素就是行元素，如图1-7右图所示是a元素的页效果。1.img元素mg元素用于在网页中插人图像， 它是“空元素 ， 即没有结束标签。img元素除了可以包含HTML的通用属性外， 其他常用属性如表1-4所示， 其中s re(图像文件名及其路径) 和alt(替代文字)是必须有的属性。示例1-6是一个最简单的图像显示网页。表1-4img元素的常用属性性名义Stc图像文件名及其路径alt替代文字，当浏览器不能显示该图像文件时所显示的文字with图像显示宽度(百分数或像素)heigh i图像显示高度(百分数或像素)示例1-6在网页上显示如图1-20的图像内容。
图像的大小应该在图像处理软件中进行调整。设置width和height属性的另一个好处在网页中显示图像还应该注意的是，图像的显示相对于文字所占的字节数较多，比如一个全格式拥有许多JPEG与GIF的共同优点， 例如支持数百万色且压缩效果好， 所以最近越来越流行。HTML图像文件可以通过图像处理软件产生， 常用的图像处理软件有Windows的Paint(画图) ， Adobe的Photoshop等。图像文件也可以在版权许可的情况下从Internet上下载， 如图1-21所示为下载示例1-6图像的操作，具体操作如下：(1) 在浏览器的“地址栏”中输人示例1-6中第6行的s re属性值：(2)用鼠标右键单击网页中的图像，如图1-21所示，在打开的菜单中单击“图片另存为”：(3) 然后将图像保存到ch 1_06.html文件所在的文件夹中， 图像文件名为harp-seal-的电超baby jpg， 如图1-22所示。ua径两种，绝对路径指的是将图像文件的全部路径都写出来，一般用于显示其他网站上的图像文件， 例如， 示例1-6中第6行的s re属性值就Tons IaEa rws hat是包含了绝对路径的图像文件名。相对路径就是写出相对于当前HTML文件所在的目录，图1-22图像文件与HTML文件在同一个文件夹中o般用于图像文件在本网站中的情况。相对路径名的使用规则如下：jpe表示文件harp-sca-baby.jpg与文件chl_06.htm在同一个目录中在chl_06.htm所在目录的下一级目录i ages中；chl 06.htm所在目录的上一级目录中；到该文件夹中， 如图1-23所示， 这时示例1-6中第6行的s re属性值就可以改写为以控制图像的显示宽度和高度，它们的长度单位既可以是百分数，也可以是像素。值得注意的是，国回径mxwidth属性和height属性的设置只是改变了图像的显示尺寸，图像文件的实际大小不会因此面发生变化。如果width和height的设置值与图像实际尺寸不一致时，还会影响图像的显示效果，例如， 按下述语句修改示例1-6中第6行的s re属性值，就可以得到如图1-24所示的效果。图1-24重新设置图像的宽度和高度属性后的效果是，它们可以在图像被完全下载之前让浏览器知道该用多大的空间来显示图片，这样浏览器可以更快显示出美观的页面。屏的图像，即使经过压缩，也要占去大约50k字节，这相当于25000字的文本，这样会使浏览器载人图像比较费时。建议一个HTML文件里不要包含过多的图像， 否则就会影响网页的显示速度。
《CSS&javascript动态网页设计与制作_吴以欣》目录
第1章HTML基础
标签名称
起始标签结束标签
图1-5HTML标签
通过用尖括号组成的标签形式来表现的。实际上， HTML程序编写的内容就是标签、元素和属性
1.标签