HTML 5程序员之路:daily 01- 02
第一次做自己的每日分享
Internet在我的认知中
Internet就是把无数个相对独立的计算机和用户端联系起来,用另一种理解方式就像小山村通过发达的交通和外界进行物资和信息的交流。
Internet提供的主要服务
Telnet/Email/WWW/BBS/FTP等
Telnet: 即远程登录服务,它虽然方便且简洁,但是它将用户的所有内容,包括用户名和密码都明文在互联网上传送,具有一定的安全隐患,许多服务器都会选择禁用。
email:即电子邮件。
bbs:通过在计算机上运行服务软件,允许用户使用终端程序通过Internet来进行连接,执行下载数据或程序、上传数据、阅读新闻、与其它用户交换消息等功能。
Ftp: 即文件传输协议,在FTP的使用当中,用户经常遇到两个概念:"下载"(Download)和"上传"(Upload)。可生成下载链接,就是我们常说的“种子”。-
基本实现技术
- 分组交互原理:信息在Internet上被分成许多小数据包进行传输,到达目的地后将数据包重组为信息
TCP/IP协议簇 Tcp/Ip是TCP/IP协议簇中主要的两个协议,还包括其他的许多协议。
Web与Internet
Web与Internet的关系
我的理解是web就是山村或城市,而inernet就像是交通网络。网线就是其中无数的道路。
Web简介
又称做万维网或环球网,即WWW(World Wide Web)
万维网就是无数文档的集合,这些文档驻留在因特网的某个地方
Web是基于Internet的一个多媒体信息服务系统
基于浏览器/服务器模式
由Web服务器、浏览器(Browser)和通信协议三部分组成
通信协议采用的是HTTP协议,超文本传输协议(Hypertext Transfer Protocol)
什么是HTML
HTML(HyperText Markup Language):超文本标记语言,一种纯文本类型的语言
Hypertext 指超文本,超文本是用超链接的方法,将各种不同空间的文字信息组织在一起的网状文本。用任何文本输出工具都可以书写超文本。
Markup 即为标记
language 在这特指计算机语言
使用带有尖括号的标记将网页中的内容逐一标识出来
标记语言不仅仅是一种语言,就像许多语言一样,它需要一个运行时环境,使其有用。提供运行时环境的元素称为用户代理。
用来设计网页的标记语言
用该语言编写的文件,以.html或.htm为后缀
由浏览器解释执行
标记语法
-
分为:封闭型标记(也叫双标记);必须要有头和尾,头表示标记语法开始,尾表示语法的结束
-
和非封闭标记(也叫单标记或空标记)不能包含内容
元素嵌套
元素之间可以互相嵌套,形成更为复杂的语法
在嵌套元素时需要注意标记的嵌套顺序
文档结构
·<!doctype html>· 文档类型声明 在开始写代码要先声明写使用的哪种语法规则,因为机器识别是单一死板的。
<html>
表明文档包含的元素,即文档头(head)和主体部分(body)。
<head>
文档头,用于为页面定义全局信息,title/meta/script/style/link等
<body>
文档主体部分,在这主要是网页展示给读者的信息,可以进行插入图片,超链接,视频等资源信息
<b></b>加粗
<i></i>倾斜
<u></u>下划线
<s></s>删除线
<sup></sup>上标
<sub></sub>下标
附下两段代码,代码都有注释。
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="Author" content="冬天不爱洗头">
<title>Document</title>
</head>
<!--
bgcolor:设置背景颜色
text:设置字体颜色 也可以用 style="color:..."改变字体颜色
back:设置背景图片
URL:统一资源定位符,指出某一资源在网络中的位置
../即回到上一级目录
http://www.baidu.com/img/tu.png
http://协议名
www.baidu.com 域名
img:目录
tu.png 具体的文件
绝对路径:一个具体的位置,让其文件都知道某个资源位置
相对路径:文件相对于当前位置的路径
-->
<body bgcolor="gray" text="red" background="">
<h1>9.28</h1>
<!--img
必须要有src属性
img的宽和高只写一个,保证图片不失真
../,找到当前路径的上一级目录
-->
[站外图片上传中……(4)]<br/>
<!--a标记
href:为了告知当前标记要跳转的内容
url/mail/zip文件/.jpg/.mp3/#test/#
target:_blank/_self
name:设置锚点
-->
<a href="mailto:594344517@qq.com?subject=我要请王老师吃饭&cc=18770811800@163.com" target="_blank">联系我们</a>
<a href="http://www.apple.com" target="_self">广告合作</a>
<a href="资源.rar">相关下载</a>
<a href="123.jpg">高清大图</a>
<a href="#test2">诗和远方 </a>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p><a name="test"
id="test2">山顶</a></p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<a href="#">返回顶部</a>
<a></a>
</body>
</html>
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="Author" content="冬天不爱洗头">
<title>Document</title>
</head>
<body>
<!--多个空格和制表符智慧显示一个空格,回车不会产生换行效果-->
<!--转义字符; 是空格 的转义字符-->
<p>奥特曼 大战 小怪兽</P>
<p>奥特曼大战小怪兽</p>
<h1>HTML5 <day 1></h1>
<p>今天<b>天气不错</b>,<i>我</i>吃了<s>6.5</s>元的<u>早饭</u></p>
<!--sub:below
sup:up
-->
<p>z=x<sub>1</sub><sup>2</sup>+x<sub>2</sub><sup>3</sup></p>
<!--标题标记只有六级-->
<h1>Test</h1>
<h2>Test</h2>
<h3>Test</h3>
<h4>Test</h4>
<h5>Test</h5>
<h6>Test</h6>
<!--title对某一个标记进行描述-->
<p align="center" id="" title="title标记">123456789</p>
<!--宽度有两种表达方式
1.绝对的;有固定长度,例如100px
相对的:通过百分比来确定,例如50%
-->
<hr size="10" color="black" width="50%" align="left"/>
<!--
<br/>是换行标记,是一个单标记
nobr是不允许换行,双标记-->
<p><nobr>今天在疯狂学东西,很是不错。解放路倒萨封疆大吏撒娇反对声浪飞机拉的发生的看法哈的发生sad房价ask萨 防守打法</nobr> </p>
<div>今天天气不错一</div>
<div>今天天气不错二</div>
<h1>HTML 5 <span style="color:red;" ><Day 1 ></span></h1>
<pre>
生活不止
眼前的苟且,
还有诗和远方。</pre>
</body>
</html>