您的位置：首页 > Web前端 > HTML

HTML初步认识

2017-09-04 18:50 281 查看

HTTP: Hypertext Transfer Protocol. 超文本传输协议

每一个网址，都对应着确定的服务器上的文件

网页是真实物理的文件。一个网页是很多物理文件组成的：html文件、图片文件、js文件、css文件。这些文件要通过特殊软件才能上传到服务器上供用户看。用户通过浏览器访问网址，服务器上面的文件就会通过http请求悄悄传输到用户电脑中的临时文件夹，在用户的电脑中执行、渲染、呈递。

纯文本文件只有文本，没有样式；用记事本等纯文本编辑器可读，不是乱码。

html、css、js都是纯文本。html负责描述页面的语义；css负责页面样式；js描述页面动态效果。html只能通过标签对给文本增加语义；css可以让文字居中，更改文字字号、字体、颜色。

HTML: HyperText Markup Language. 超文本标记语言

.html：网页的格式

HTML演示：

<h1>Mayday简介</h1>
<h2>基本信息</h2>
<p>
五月天，台湾摇滚乐团，由乐队团长兼吉他手怪兽（温尚翊）、主唱阿信（陈信宏）、吉他手石头（石锦航）、贝斯玛莎（蔡升晏）和鼓手冠佑（刘谚明）组成，前身为“So Band”乐团，在1997年3月29日更名为“五月天”。至2016年，四次拿下"台湾金曲奖"和“最佳乐团奖”。
1999年，发行首张专辑《第一张创作专辑》。2000年7月7日，发行了第二张创作专辑《爱情万岁》。2001年7月6日，推出暂别歌坛之作第三张创作专辑《人生海海》。……2011年12月16日，发行第八张专辑《第二人生》。2016年7月21日，发行第九张专辑《自传》。
</p>

<h2>早年经历</h2>
<p>
1992年至1994年，阿信、怪兽、玛莎、石头先后结识于台湾师范大学附属中学，加入师大附中的吉他社，开启了音乐旅程。
1997年，为了报名参加野台开唱，五人使用玛莎在网络BBS的代号“MAYDAY”作为团名，正式更名为“五月天”。3月29日五月天野台开唱，正式组成乐队。
1999年，第四任鼓手冠佑加入乐团，主唱阿信把成军时间改为冠佑加入后。
</p>

<h2>演艺经历</h2>
<p>
1998年6月，五月天加入滚石集团，正式成为滚石集团的一员。
1999年7月7日，发行加入滚石之后的第一张专辑《第一张创作专辑》。
2000年7月7日，发行了第二张创作专辑《爱情万岁》。
……
2011年12月16日，发行第八张专辑《第二人生》。
2016年7月21日，发行第九张专辑《自传》 ，尽管这张专辑不少歌曲回忆的都是五月天亲历的青春，但却另有声音论这是五月天最无朝气之感的一张专辑。11月22日，为电影《你的名字》创作并演唱主题曲《好好（想把你写成一首歌）》。
2017年5月2日，为电影《春娇救志明》演唱主题曲《春娇救志明》，这也是歌曲《志明与春娇》的国语版。
</p>

html有很多标签对，可以给文本增加不同的语义，

如< h1 >< /h1 >主标题、< h2>< /h2>二级标题、< p>< /p>段落。

任何出文本编辑器都能够编辑html，如记事本，editplus，notepad++

sublime：高效率的程序书写工具

webstorm：更高级的项目级别编程工具

sublime中常用的快捷键：

ctrl+滚轮：放大缩小文字

ctrl+shift+d：复制当前行

ctrl+shift+k：删除当前行

ctrl+shift+↑：上移当前行

ctrl+shift+↓：下移当前行

在敲入标签的时候，仅需输入标签的名字，按tab就可以自动生成标签对——输入p然后按tab，软件自动生成< p>< /p>

html的基本骨架也可以用sublime快速生成——输入html:xt，按ctrl+E即可。xt表示版本，表示标准html格式。

<html>
<head>

</head>
<body>

</body>
</html>

完整骨架如下：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<title>Document</title>
</head>
<body>
<h1>document</h1>
<p>paragraph</p>
</body>
</html>

第1行是网页的声明头，叫DocType Defintion，文档类型定义，简称DTD。这行语句里面暗含了一个网址。W3C就是出web规范的组织机构。html、css、js的规范都是W3C定义发布的。world wide web coalition , 国际万维网联盟。网页声明头可以告诉浏览器，这是一个什么标准的页面。

第2行是最大的html标签，所有的网页内容，都要包裹在这个标签对儿里面。

在html标签中，有两个属性：

xmlns=”http://www.w3.org/1999/xhtml” 命名空间，就是一个规范；

xml:lang=”en” 语言是英语

< meta http-equiv=”Content-Type” content=”text/html;charset=UTF-8”> 字符集的配置

title标签就是网页的标题，显示在浏览器的标签栏中。

body标签就是网页的内容。

HTML注释：

任何程序、代码都有注释，注释是给程序员看的，不影响程序。适当的注释能够让程序更加可读。

语法：< !–注释的内容–>

sublime中按ctrl+/就是注释。

<!--这里准备如何做-->
<div>头部</div>
<!--这里还没想好怎么做-->
<div>主要内容</div>
<!--这里不知道要不要做-->
<div>页尾</div>

字符实体：

在页面上输出”< h1>”这些字符，但是html认为这是一个未封闭标签。所以<就是<的字符实体，即用常用字符表示这些符号的方式。

lt是英文less than

gt是greater than，即>的字符实体。

©就是©版权符号的实体。

：non-breaking spacing，不打断空格的意思，就是空格键的字符实体。

html*废弃*标签简介：

html现在只负责语义，不负责样式，但是html一开始是有样式的。

< font size=”9” color=”red”>哈哈哈< /font>

< b>加粗bold< /b>

< u>下划线underline< /u>

< i>倾斜italic< /i>

< del>删除线delete< /del>

< strong>强调< /strong>

< hr/>水平线

< br/>换行（网页中99.99%需要换行，是因为另起了段落，所以要用p，不需用< br/>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航