第一节 HTML基础知识：
1.什么是浏览器？
浏览器帮助用户进行浏览网页的软件，能够让将网页内容呈现给用户查看，并让用户与网页交互。
2.常见到浏览器和内核？
IE内核 Trident
谷歌内核 WebKit / Blink
火狐内核 Gecko
Safarri内核 WebKit
欧朋内核 Presto
3.一些名词解释
-Internet：因特网
-WWW：万维网，世界互联网服务。
-W3C万维网联盟，国际中独立性技术标准机构。
-HTTP：超文本传输协议，浏览器和服务器端网络传输数据的约束和规范。
-Web：互联网服务总称。
-DNS：域名系统。
4.什么是服务器？
–浏览器接受用户操作→浏览器封装HTTP请求→连接服务器：DNS解析→发送请求Request→服务器接收请求→处理请求→返回响应报文→浏览器接收响应报文→渲染页面呈现
5.网页的组成？
－网页主要由文字、图像和超链接等元素构成。当然，除了这些元素，网页中还可以包含音频、视频以及Flash等。
－HTML：页面结构、CSS：页面样式表现、JavaScript：交互行为
6.网页的结构
<html>
<head> </head> 头部
<body> 身体
<h1> </h1> 标题标签
<p> </p> 段落标签
</body>
</html>
特点：成对出现，有开有闭合，尖括号括住了标签名。结束标签内增加了斜线
7.HTML语法
①“以“<”开头
②接着标签名，中间无空格
③标签名后面有属性的，加空格，然后是 属性名=“”；多个属性的用空格隔开
④属性结束后加一个或多个空格
⑤然后是结束标签“>”，如果是闭合标签在标签名前加“/”，如
⑥单标签，斜线没有意义可有可无
⑦标签中可以嵌套内容
第二节内容笔记
一、HTML常用标签
1、body标签：
<body>用于定义HTML文档所要显示的内容，也称为主体标记。浏览器中显示的所有文本、图像、音频和视频等信息都必须位于<body>标记内，<body>标记中的信息才是最终展示给用户看的。
一个HTML文档只能含有一对<body>标记，且<body>标记必须在<html>标记内，位于<head>头部标记之后，与<head>标记是并列关系。
2、标题标签h1-h6：
H1标题标签是 标注当前页面中的文档最重要的核心主题的文本。
H1到 h6标签，相对于当前文档的重要性依次降低。注意h1标签在整个页面中最多一次（当然可以超过，但是不利于搜索SEO）。
H2以后的这些标签可以在一个页面中有多个，但是不要滥用，滥用会导致网页的SEO受影响，搜索引擎会认为我们作弊。
H1 到H6 标签不是用于 字体大小的样式设置，关键是文档内容的文字的重要性的体现，html是定义文档内容的，而样式由后面我们学的css来设定。
3、段落标签：<p>
4、换行标签 <br/>，水平线标签 hr
5、文本节标签:span
6、定义着重文字，文字以斜体显示：<em>
定义加重语气，文字以粗体形式显示：<strong>
定义下标字：<sub> 定义上标字：<sup>
定义删除字，<del>，s；
•注释标签：<!---注释内容---->
7.超链接和图片
超级链接标签：a
<a href="http://www.itcast.cn">超级链接内容
–href属性，指向跳转的地址
–#页面定位
–target属性：_blank_self
锚点链接：可以然后href属性指向一个页面中的id值，可以让页面跳转到id对应的标签的位 置。
超级链接不仅仅是可以嵌套文本，还可以嵌套图片、表格、标题。
8. 相对路径和绝对路径
--相对路径
图像文件和html文件位于同一文件夹：只需输入图像文件的名称即可，如<img src="logo.gif"/>
图像文件位于html文件的下一级文件夹：输入文件夹名和文件名，之间用“/”隔开，如<
src="img/img01/logo.gif"/>
图像文件位于html文件的上一级文件夹：在文件名之前加入“../” ，如果是上两级，则需要使用 “../ ../”，以此类推，如<img src="../logo.gif"/>
--绝对路径
绝对路径一般是指带有盘符的路径。例如:
“D:\HTML+CSS网页制作\chapter02\img\logo.gif”，或完整的网络地址，例如“http://www.itcast.cn/images/logo.gif”。
9 .图片格式和选择
GIF格式
GIF最突出的地方就是他支持动画，同时GIF也是一种无损的图像格式，也就是说修改图片之后，图片质量几乎没有损失。再加上GIF支持透明（全透明或全不透明），因此很适合在互联网上使用。但GIF只能处理256种颜色。在网页制作中，GIF格式常常用于Logo、小图标及其他色彩相对单一的图像。
总结：小、兼容性好、支持透明、色彩太多不行。
PNG格式
PNG包括PNG-8和真色彩PNG（PNG-24和PNG-32）。相对于GIF，PNG最大的优势是体积更小，支持alpha透明（全透明，半透明，全不透明），并且颜色过渡更平滑，但PNG不支持动画。同时需要注意的是IE6是可以支持PNG-8的，但在处理PNG-24的透明时会显示为灰色。通常，图片保存为PNG-8会在同等质量下获得比GIF更小的体积，而半透明的图片只能使用PNG-24
JPG格式
JPEG格式是网络上比较流行的一种格式，其文件扩展名为.jpg或.jpeg。JPEG是一种有损压缩格式，其文件体积非常小，非常有利于网络传输，但由于是有损压缩，所以将一幅图像转换为JPEG格式后图像质量会降低。一般用于广告，大的宣传的图片，照片等
选择：
–jpg
•色彩还原高，适合复杂颜色图片，比如banner
–gif
•色彩效果最低，支持透明，支持动画，适合颜色比较少，不适合渐变色。
–png
•PNG的优点是，清晰，无损压缩，压缩比率很高，可渐变透明，具备几乎所有GIF的优点；缺点是不如JPG的颜色丰富，同样的图片体积也比JPG略大。
•PNG有着另一个优点，那就是逐次逼近显示(progressive display)：传输图像文件的同时，可以先把整个轮廓显示出来，然后逐步显示图像的细节，即先显示低分辨率显示图像，从模糊到清晰，然后逐步提高它的分辨率。这是一个很好的用户体验。
•总结：
•gif和png基本差不多，色彩比较少的直接gif，如果图片动画用gif。对色彩要求高的用jpg。
网友评论