HTML基础教程-优快云博客

Web&HTML

web即word wide web的简称，是一种基于http和html的全球性的、动态交互的、跨跨平台的分布式图像信息系统，我们接下来学习的则是其中的html。HTML即Hyper Text Markup Language的缩写，是一种超文本标记语言，包括我们在网页中所能看到的和听到的注入图片、链接、文字、声音和程序等可是可听的内容（甚至会包括即将到来的VR时代的触感和嗅感所能接触到的内容）需要了解的是HTML是一种标记语言而非一种编程语言，它是一套完整的标记标签，并通过标记标签来描述网页。正因为HTML的特点，所以HTML文档也可以看做是我们的网页。

Web通过读取html文档，通过标签呈现出网页的预定内容。

框架

和之前接触的VB、C#和.NET一样，HTML也有自己的一个框架（或许称之为代码结构比较合适）。

代码

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>                      
    <title>                    
        我是文档标题。
    </title>                        
</head>                         
<body>                      
    你好，我是HTML。也就是一个网页的内容部分。上面的文档标题也就是我们打开的网页的标签的名字。
</body>                   
</html>

效果

结构

HTML正是通过一系列的标签向我们展示网页的既定内容的。标签的结构包括：开始标签、结束标签、属性和内容这四部分。就像这样：

虽然大多数浏览器可以识别不带结束标签的HTML文档，但是强烈建议标签必须以结束标签结尾；

虽然HTML标签对大小写不敏感，但是鉴于W3R在HTML4中推荐使用小写标签，故书写标签时请使用小写；

诸如<br>和<img>可以没有结束标签，但是推荐这样书写：<br />和<img />；

标题

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>标题演示</title>
</head>
<body>
    <h1>我是标题1</h1>
    <h2>我是标题2</h2>
    <h3>我是标题3</h3>
    <h4>我是标题4</h4>
    <h5>我是标题5</h5>
    <h6>我是标题6</h6>
    PS:HTML现在最多支持6个标签
</body>
</html>

段落

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
</head>
<body>
    <p>我是一个段落 </p>
</body>
</html>

链接

链接帮助我们跳转到另外的网页。链接通过<a>标签进行定义。

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
</head>
<body>
    <a href="http://blog.youkuaiyun.com/sky15732625340">这是一个不进去坐坐就后悔的博客</a>
</body>
</html>

图像

HTML中的图像通过img标签进行定义。

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>image</title>
</head>
<body>
    <p> 建议先把图片加载到项目中，随后直接拖动图像至代码即可</p>
    <img src="image/we.jpg" />
</body>
</html>