第一章-HTML基础

HTML简介和发展历史:

       Html是一种用来描述网页的一种语言,她是一种超文本标记语言,也就是说不是一种编程语言,仅是一种标记语言(Markup Language)。


        HTML由一套标记标签(Markup Tag)组成,在制作网页时,HTML使用标记标签来描述网页。

      使用浏览器打开任意一个页面,然后按下F12键,就可以看到这个网页的源文件代码。

     

HTML诞生于1993年11月,期间经历了很多的变迁,

HTML5 是目前最新的版本,于2004年提出,2012年12月17日HTML5规范正式定稿。

2013年5月6日,HTML5.1正式草案公布。

 

HTML的优势,

首先就是世界上几乎所有的浏览器都支持HTML,

 

并且拥有了很好的跨台性开发,用户只要打开浏览器就可以访问应用,PC网站,各种的移动设备,插件等核心代码可以不需要重复编写,极大的减少了开发人员的工作量。

 

HTML5的目标就是将Web带入一个成熟的应用平台,在HMTL5平台上,视频,音频,图像,动画和计算机的交互都将被标准化,这正是市场所需要的。

 

W3C标准

发明HTML的初衷就是实现信息资料的网络传播和共享,希望HTML文档具有平台无关性,也就是同一HTML文档。

但是各个浏览器都在HTML的基础上扩展了自己的各类标签,导致了浏览器之间互不兼容,HTML编码规则混乱,也违背了HTML发明的初衷。

 

万维网(WorldWide Web Consortium ,W3C就是制定和维护统一的国际化Web开发标准,来确保各个浏览器都互相兼容,它是Web技术领域最具影响力的国际中立性技术标准机构

W3C标准不是某一个标准,而是一系列的标准的集合,一个网页主要由三部分组成

结构(Structure),表现(Presentation),行为(Behavior)。

 

网页编辑工具

可以开发网页的工具非常多,记事本,Dreamweaver,UltraEdit,Sublime,WebStrom等等

我目前选择的就是 WebStrom

 

 

HTML5文件的基本结构

以上讲过HTML是一种超文本标记语言,比如网页的一个标题,一个段落,一张图片等,这些都是利用了一个个HTML标记完成的。

最基本的语法就是 <标记>内容<标记/>

标签都是成对出现的,有一个开头就有一个结束标记,并且标签之间要有缩进,来体现层次感,也方便阅读和修改。

HTML5的基本结构可以分为两部分,整个HTML页面包括头部(head),和主体(body

头部包括了网页标题(title)等基本信息,而主体包括网页的内容信息,如图片,文字等。

 

网页中的基本标签

1.    标题标签 : <h1></h1>….<h6></h6>

2.    段落标签:<p>

3.    强制换行标签: <br/>

4.    水平线标签:<hr/>

5.    加粗标签:<strong></strong>

6.    斜体标签:<em></em>

 

注释

HTML的注释是为了方便代码阅读和调试的,而且当浏览器遇到注释会自动忽略掉注释内容,不会加载出来。

语法:<!--注释的内容-->

 

特殊符号

由于规则原因,有些符号无法使用,这时就需要使用特殊符号来达到想要的效果

空格     =  &nbsp;

大于号   =  &gt;

小于号   =  &lt;

引号     =  &quot;

版权符号 =  &copy;

 

图像标签

在浏览网页时,可以都可看到页面上的各种图像,而常见的图像格式有

JGP格式,GIF格式,BMP格式,PNG格式

 

语法:<img src="图片地址" alt="图像的替代文字" title="鼠标悬浮时提示文字" width="图片的宽度" height="图片的高度">

 

 

超链接标签

我们上网时,经常会通过超链接查看各个页面或不同的网站,所以超链接 <a> 在网页中十分常用,超链接常用来设置到其他页面的导航链接。

 

超链接包含了两个部分内容,

一是链接地址,也就是链接的目标,可以是某个网址或者文件的路径,对应的是 <a>标签的href 属性,

二是链接的文本或者图像,当单击这个文本或者图像的时候将会触发事件,并跳转到 href 属性的指定的链接地址。

 
 
<a href= " 链接地址 " target= " 跳转的窗口位置 " ></a>
href:表示链接地址的路径
target:指定链接在哪个窗口打开, _self = 自身窗口, _blank = 新建窗口

 

 

行内元素和块元素

以上的知识让我们已经认识到了HTML5的基本结构,

并发现了有的标签无论内容多少,该都是独占一行,这样的标签我们成为:“块元素”。

而有的标签则是宽度由自己的内容决定,其他的元素则可以排在它的后面,这样的标签我们称为:“行内元素”。

 

 

 

猜你喜欢

转载自blog.csdn.net/weixin_42413153/article/details/80617847