2 day——Web页面建设

1、要记住：块元素是特立独行；内联元素随波逐流；

块元素和内联元素对于构建web页面起的作用：块元素通常用作Web页面中的主要构建模块，而内联元素往往用来标记小段内容。设计一个页面时，一般先从较大的块开始（块元素），然后在完善页面时在加入内联元素；

2、把一个元素放在另一个元素中称为“嵌套”；

3、什么是HTTP？

HTTP也称为超文本传输协议。换句话说，这是在Web上传输超文本文档的公认的一种方法（协议）。尽管“超文本文档”通常只是指HTML页面，但这个协议实际上还可以用来传输图像或Web页面可能需要的任何其他文件；

i.HTTP是一个简单的请求和响应协议。它是这样工作的：每次在浏览器的地址栏中输入一个URL时，浏览器就会使用HTTP向服务器请求相应的资源。如果服务器找到这个资源，就会把它返回给浏览器，由浏览器显示。如果服务器找不到，服务器则会向浏览器报告“404错误”

4、浏览器如何处理图像？

浏览器在页面中显示图像之前，必须先获取这个图像：

i.首先浏览器从服务器获取文件“xxx.html”

ii.接下来，浏览器读取“xxx.html”文件，显示这个文件，发现其中有4个图像需要获取。所以需要从Web服务器逐个得到这些图像；

iii.获取到图像之后，浏览器显示这个图像，然后转向下一个图像；

iiii.对页面上的每一个图像都会重复这个过程；

5、Web上最常用的3中格式：JPEG、PNG和GIF，这三种格式有什么不同？

JPEG：照片和复杂图像使用JPEG

i.最适合连续色彩图像，如照片；

ii.可以表示包含多达1600万种不同颜色的图像；

iii.这是一种“有损”格式，因为缩小文件大小时会丢掉图像的一些信息；

iiii.不支持透明度；

iiiii.文件比较小，以便Web页面更高效地显示；

iiiiii.不支持动画；

PNG：单色图像、logo和几何图形使用

i.最适合单色图像和线条构成的图像（如logo、剪贴画和图像中的小文本）

ii.PNG可以表示包含上百万种不同颜色的图像。PNG有3种：PNG-8、PNG-24、PNG-32，取决于你需要表示多少颜色；

iii.PNG会压缩文件来缩小文件大小，不过不会丢掉信息。所以这是一种“无损”格式；

iiii.允许将颜色设置为“透明”，使图像下面的东西可以显示出来；

iiiii.与相应的JPEG文件相比，PNG文件跟大一些，不过取决于使用的颜色数，可能比相应的GIF文件小，也可能更大；

GIF：单色图像、logo和几何图形使用

i.类似于PNG、GIF最适合单色图像和线条构成的图像（如logo、剪贴画和图像中的小文本）

ii.GIF可以表示最多256种不同颜色的图像；

iii.GIF也是“无损”格式；

iiii.GIF也支持透明度，不过只允许一种颜色设置为“透明”；

iiiii.GIF文件往往比相应的IPEG文件大；

iiiiii.支持动画；

6、元素详解的：

i.img元素是一个内联元素。它不会在前面或后面插入换行；

ii.src属性，不只是用于相对链接，还可以在src属性中放入URL

iii.alt属性，为访问者提供一些指示，告诉他们图像里有什么信息。

iiii.width和height属性，设置一个图像的大小，宽度和高度使用像素数指定，如果没有指定宽度和告诉，则浏览器在页面中显示这个图像之前会自动确定图像的大小；

iiiii.图像要链接到一个图像，需要把元素放在元素中；