！Web云笔记--HTML基础

Web自学笔记第一阶段笔记综合汇总

参考资料：《Head First HTML&CSS》（中文第二版）(美国)弗里昂ISBN：9787508356464 中国电力出版社

所有阶段：HTML基础àCSSà高级HTMLàJavaScriptàPHP脚本àWeb渗透

 

 

Web学习笔记第一发：认识html：web语言

 

强调，emphasize 大多数浏览器会把文本斜体，不重要不用记了

Html文件里若干的空格和回车都被算做一个空格！！！想人为输入空格还得写实体，回车的话用

浏览器会忽略html文档中 的制表符 回车和大量空格

 

 

Html注释方法之一：

块元素和内联元素

第一发完------

 

 

 

Web学习第二发：认识超文本

 

注意，html语句必定要是英文标点符号！！！！！拒绝国产变态符号，具体参见《中英文经常使用符号对照表》

 

安全第一：你可能看到web上有一些不严谨的html属性没有加双引号，不过你可不能偷懒，若是不严谨可能会致使不少问题

 

文件系统能够当作是一个树根：和树相反，树根是朝下生长的，并且也无环（固然现实中的树根常常相互嫁接产生环路）因此咱们从此将拿树根而不是树来比喻文件体统和一些子孙嵌套的系统。

 

Href：引用的地址 reference

相对地址与绝对地址

 

左斜杠（右斜杠也叫反斜杠）最经常使用：http、文件系统、右标签等等，可是Windows特么的用反斜杠来表示文件体统

 

两个点..表明上层文件夹，一个点.表明所在的文件夹

题外话：linux中打开本目录下的文件能够写：./filename，即访问此文件夹下的某个文件

 

../../../..。。。上层上层上层。。。。

 

Web页面与操做系统无关（相互独立）由于中间夹着浏览器，因此写web页面没必要考虑OS的兼容性！！！！！！

 

注意：：网站文件名和文件夹名中不要使用空格！！！！！！！！！

 

行业建议：最好在构建网站初期组织网站文件，这样就不用再网站升级时修改一大堆路径 了。

 

 

相对路径就是：web文档所在文件夹(目录）为起点，去往寻找链接指向的文件。

 

 

Web学习第三发：扩展词汇，一些标签

 

Html语言线性扫描的时候只有三个特殊字符：小于号<</span>大于号>和与符号&。由于是从左到右线性扫描的，小于号大于号成对出现，与符号和分号；也成对出现，因此除了尖括号内的内容以及实体字符，其他的字符都视为文本字符串！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！

 

 

 

引用元素（quote）多是搜索引擎的目标之一

 

两种元素（标签）：正常元素和void（空）元素，前者指成对出现的元素，后者是单着的，如

 

有序列表元素的好处：自动编号，不然想改变顺序或者增删新列表项就要人为重写序号，太麻烦

 

列表元素只能包含

 

实体：<</span>；是<(less than)  >是>(greater than)  &是&本身（ampersand=and）

http://www.unicode.org/charts/得到详细的特殊字符实体表示法、

就像程序语言中的转义字符\，也须要一个转义字符来表示本身

Html中的实体字符的目的：用有限的ascii字符来表示海量的unicode字符！！

 

既能够是内联元素也能够是块元素！！！！

是inline元素

既不是内联元素也不是块元素。。。

 

 

 

 

 

 

第四发：进军http

 

找一家托管公司（租一台服务器）/购买一台服务器（购买域名）/搭建localhost（仅供测试）

 

ICANN域名管理机构

 

www实际上是域中服务器的名字

Starbucks.com才是域名

两者合起来叫网站名：域名能够用于多个网站

 

ftp图形化软件：好比百度网盘客户端。。。

ftp命令行：cd、put、mkdir、dir、pwd、get。。。。同DOS、linux等操做系统

 

SFTP：secure FTP

 

强烈推荐Dreamweaver！！！！！！！！！

 

url的组成：

第一部分：协议名，好比http、ftp

第二部分：服务器名：好比www

第三部分：域名

第四部分：绝对路径

第五部分：（其余内容）

 

科普：什么是协议，只有在多台智能设备之间才叫协议，如交换机路由器、pc与服务器

 

绝对路径就是出发点为根目录的路径，以/开头，/表明根

 

单机一个相对路径连接时，浏览器会生成一个绝对路径发出去（url）

 

默认html文件是index.html或defaut.html

 

使用相对路径的好处：一来节省墨水，二来当网站位置移动或者更名不用一一修改路径

 

从本机读取文件file:///有三条杠。。。由于中间网站名的位置为空！！！

 

Web默认端口：80

 

中的title属性：覆盖所连接网页的

中的 中的内容！！！！！

 

行业建议：不要把连接放在一块儿，否则用户很难发现！！！！

 

元素建立id属性：跳转到页面特定位置（也能够是本页面）！！！！！！！！！！！！！！！

 

Id的惟一性：同一页面值惟一；统一元素种类惟一！！

 

元素属性的顺序随便：排名不分前后

 

能够为任何元素增长title属性！！！！（用于提示）

 

Id必定要字母开头？！后面能够是字母、数字、减号、下划线、冒号、点号，不能有空格！！！

 

的target属性：

“_blank”在新窗口（标签页）打开

“_parent”:????

“新名字”：全部目标为它的网页都会在同一新窗口打开（覆盖）

 

 

 

第五发：

 

浏览器获取图片滞后于html

浏览器也能够设置为不获取图片！

 

Web上经常使用格式：jpeg png gif

 

Jpeg：

连续色调如照片

256^3=1600多种颜色

有损压缩

文件较小

 

Png：

单色图像线条图像如logo和小文本

上百万种颜色png-8 png-16 png-32

无损压缩优于gif

支持透明比gif更高级

比相应jpeg文件较大

 

Gif：

单色线条图像

256中颜色

无损

支持透明

比相应jpeg大

支持动画

 

 

Alt属性：图片显示不出来时显示的文本

 

一英尺=30.48cm

一英寸=2.54cm

 

浏览器的auto image resize功能

 

强烈推荐Photoshop ，有专门为web图片服务的存储选项

 

Href能够直接连接到图片文件！！！

 

边缘柔化：！！！！！！！！！！！！

针对小文本或者矢量logo

栅格化成位图后放大会产生锯齿

抗锯齿就是在周边覆上一层相对于背景的渐变色

因此若是背景透明的话，就要将柔滑边缘设置成对应理想的背景色

 

行业经验：图片宽度少于800px

 

第六发：html标准

 

！！！

标准html(5)不用再考虑版本号，html变成一个活的标准，版本的概念被淡化，继续根据须要发展和变化，向下兼容：向html添加新内容，支持原来的内容

 

W3c验证工具

http://validator.w3.org

 

题外话：什么是编码：编码是程序语言和底层二进制之间的桥梁

 

放到

中第一个位置

 

只有

和 能直接放在 中！！！！

 

----------------------------------完-------------------------------------------