part 1
First of all:
introduce:
HTML是一种 超文本标记语言 (Hyper Text Markup Language),是W3C组织推荐使 用的一个国际标准,是一种用来制作超文本文档的简单标记语言。
设计 HTML语言 的目的是为了能把存放在一台电脑中的文本或图形与另一台电脑中的文本或图形方便地联系在一起,形成有机的整体,人们不用考虑具体信息是在当前电脑上还是在网络的其它电脑上。我们只需使用鼠标在某一文档中点取一个图标,Internet就会马上转到与此图标相关的内容上去,而这些信息可能存放在网络的另一台电脑中。
注:大小写不敏感 、html/htm为后缀
行业情报:
天才第一步:
既然想了解html,那不如从编写一个简单的网页开始:(天才第一步,先装好软件)
编写软件:sublime,下载链接:www.sublimetext.com/3
插件安装:CTRL + ~调出命令行,安装控制台命令,命令网址如下:https://packagecontrol.io/installation#st3 。
不愿意上网的直接复制:import urllib.request,os,hashlib; h = '6f4c264a24d933ce70df5dedcf1dcaee' + 'ebe013ee18cced0ef93d5f746d80ef60'; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); urllib.request.install_opener( urllib.request.build_opener( urllib.request.ProxyHandler()) ); by = urllib.request.urlopen( 'http://packagecontrol.io/' + pf.replace(' ', '%20')).read(); dh = hashlib.sha256(by).hexdigest(); print('Error validating download (got %s instead of %s), please try manual install' % (dh, h)) if dh != h else open(os.path.join( ipp, pf), 'wb' ).write(by))
最后Ctrl+Shift+P键打开命令板-安装插件:
- Install Package
- Emmet - JsFormat
- SideBarEnhancements
- CssComb - Autoprefixer
The next:
Structure:
HTML文本是由HTML命令组成的描述性文本,基本HTML页面以<html>标签开始,以</html>结束,HTML命令可以说明文字、图形、动画、声音、表格、链接等。< > 用大小于号作为包装,这个包装成为标签,<tag>。不同的标签标识不同的意思。
HTML的结构包括头部(Head)、主体(Body)两大部分,其中头部描述浏览器所需的信息,而主体则包含所要说明的具体内容。
<!DOCTYPE hmtl> 仅声明文档类型 非标签
<p> </p>开始一个新段落,在<p></p>标签内,加上<br/>仅换行,但还是一个段落
<pre> </pre>类似于<p>标签,但是会保留空格和换行符
<h1> </h1>标题标签,一共可以有6个级别标题,<h2></h2>......
<hr>水平线标签,单标签
<i></i> 或者<em></em>文字斜体
<b></b> 或者<strong></strong> 文字加粗
常用特殊符号:
< <
> >
® 已注册
© 版权
™ 商标
空格
列表标签:
无序列表标签语法:
<ul type="...">
<li> </li>
</ul>
有序列表标签语法:
<ol type=" "> <li> </li> </ol>
定义列表标签语法:
<dl> <dt></dt> <dd></dd> </dl>
图片标签语法:
<img src=" " alt=" " ...>
注:src属性必写(绝对路径:从盘符路径开始;相对路径-建议使用) ,height以及width属性取值为百分比时是相对于父级元素取。
超链接标签语法:
这是我第一次编写的网页:
<!DOCTYPE html>
<html>
<head>
<title>demo</title>
<meta charset="UTF-8"/>
</head>
<body>
<h1>demo</h1>
<hr>
<div>
<p align="center">我坚信 青春不会消亡</p>
<p align="center">它只是躲在某片绿荫下 慢慢疗伤 </p>
<p align="center">岁月凝成一颗珍珠 却无法拥有</p>
<p align="center">丢在地上 冰凉 </p>
<p align="center">握在手里 滚烫 </p>
<p align="center">我想拥抱它 却扑了一个空</p>
<p align="center">它化作一片杂物 散落在桌上</p>
<p align="center">泛黄的日记本 </p>
<p align="center">气数已尽的铅笔 </p>
<p align="center">褪色的发卡</p>
<p align="center">还有 一个空空的背囊</p>
<p align="center">那年</p>
<p align="center">铅笔在日记本上写道 </p>
<p align="center">真好 </p>
<p align="center">我没有去打搅你的暗自芬芳</p>
<p align="center">真好</p>
<p align="center">你也没有戳穿我的刻意坚强</p>
<p align="center">人生 就是一次次幸福的相聚</p>
<p align="center">夹杂着一次次伤感的别离 </p>
<p align="center">我不是在最好的时光中遇见了你 </p>
<p align="center">而是 </p>
<p align="center">遇见了你 </p>
<p align="center">才给了我这段最好的时光</p>
<ul type=""></ul>
</div>
<div>
</div>
</body>
part 1的最后:
我想以一个问题结尾:既然HTML是一种超文本标记语言,那么为什么它却是纯文本呢?
part 2
一、WWW万维网介绍
既然是网站,那么万维网是如何工作的呢?
WWW 指万维网(World Wide Web),万维网常被称为Web,Web 是由遍布全球的计算机所组成的网络,所有 Web 中的计算机都可以彼此通信,所有这些计算机都使用名为 HTTP 的通信标准。
Web 信息存储于被称为网页的文档中,HTML 文档 = 网页,网页是存储于被称为 Web 服务器的计算机上,读取网页的计算机称为 Web 客户端,Web 客户端通过称为浏览器的程序来查看网页。
浏览器可通过一个请求来读取某个服务器上的一张网页,请求是一个包含页面地址的标准 HTTP 请求,页面地址类似这样:http://www.someone.com/page.htm
所有的网页都含有其如何被显示的结构,浏览器通过阅读这些结构来显示页面,最常用的显示结构称为 HTML 标签,用于段落的 HTML 标签类似这样:<p>,在 HTML 中像这样定义段落:<p>This is a Paragraph</p>
web 的规则制定主体是 W3C,W3C 指的是万维网联盟(World Wide Web Consortium),W3C 将各种规范订立为 web 标准,最核心的 web 标准是 HTML、CSS、XML,最新的 HTML 标准是 XHTML 1.0。
二、HTML与XHTML的介绍:
HTML超文本标记语言(HyperText Markup Language,HTML)
XHTML可扩展超文本标记语言(eXtensible HyperText Markup Language,XHTML)
XHTML表现方式与HTML类似,不过语法上更加严格。从继承关系上讲,HTML是一种基于标准通用标记语言(SGML)的应用,是一种非常灵活的置标语言,而XHTML则基于可扩展标记语言(XML),XML是SGML的一个子集。XHTML 1.0在2000年1月26日成为W3C的推荐标准。
三、深入行业情报:
四、干货CSS、JavaScript与XML...的介绍
CSS
CSS 指层叠样式表 (CascadingStyleSheets),样式定义如何显示HTML 元素,样式通常存储在样式表中,把样式添加到 HTML 4.0 中,是为了解决内容与表现分离的问题,外部样式表可以极大提高工作效率,外部样式表通常存储在CSS 文件中,多个样式定义可层叠为一。
JavaScript
在数百万张页面中,JavaScript 被用来改进设计、验证表单、检测浏览器、创建cookies,等等。JavaScript 是因特网上最流行的脚本语言,并且可在所有主要的浏览器中运行,比方说 Internet Explorer、 Mozilla、Firefox、Netscape、和 Opera。
JavaScript 被设计用来向 HTML 页面添加交互行为。JavaScript 是一种脚本语言(脚本语言是一种轻量级的编程语言)。JavaScript 由数行可执行计算机代码组成。JavaScript 通常被直接嵌入 HTML 页面。JavaScript 是一种解释性语言(就是说,代码执行不进行预编译)。
function:
1)JavaScript 为 HTML 设计师提供了一种编程工具,HTML 创作者往往都不是程序员,但是 JavaScript 却是一种只拥有极其简单的语法的脚本语言!几乎每个人都有能力将短小的代码片断放入他们的 HTML 页面当中。
2)JavaScript 可以将动态的文本放入 HTML 页面。类似于这样的一段 JavaScript 声明可以将一段可变的文本放入 HTML 页面:document.write("<h1>" + name + "</h1>")
3)JavaScript 可以对事件作出响应。可以将 JavaScript 设置为当某事件发生时才会被执行,例如页面载入完成或者当用户点击某个 HTML 元素时。
4)JavaScript 可以读写 HTML 元素。JavaScript 可以读取及改变 HTML 元素的内容。
5)JavaScript 可被用来验证数据。在数据被提交到服务器之前,JavaScript 可被用来验证这些数据。
6)JavaScript 可被用来检测访问者的浏览器。JavaScript 可被用来检测访问者的浏览器,并根据所检测到的浏览器,为这个浏览器载入相应的页面。
7)JavaScript 可被用来创建 cookies。JavaScript 可被用来存储和取回位于访问者的计算机中的信息。
XML
XML 指可扩展标记语言(EXtensible Markup Language),XML 是一种标记语言,很类似 HTML,XML 被设计用来描述数据。XML 是一个 W3C 标准
XML 标签没有被预定义。您需要自行定义标签。XML 使用文件类型声明(DTD)或者XML Schema来描述数据。带有 DTD 或者 XML Schema 的 XML 被设计为具有自我描述性。
XML 被设计用来携带数据。XML 是不作为的。也许这有点难以理解,但是 XML 不会做任何事情。XML 被设计用来结构化、存储以及传输信息。
下面是 John 写给 George 的便签,存储为 XML:
<note>
<to>George</to>
<from>John</from>
<heading>Reminder</heading>
<body>Don't forget the meeting!</body>
</note>
这个标签有标题以及留言。它也包含了发送者和接受者的信息。但是,这个 XML 文档仍然没有做任何事情。它仅仅是包装在 XML 标签中的纯粹的信息。我们需要编写软件或者程序,才能传送、接收和显示出这个文档。