zoukankan      html  css  js  c++  java
  • HTML文档基础

    一.HTML(Hyper Text Markup Language超文本标记语言)是一种用来制作超文本文档的简单标记语言,HTML在正文的文本中编写各种标记,通过Web浏览器进行编译和运行才干正确显示。此篇文章主要介绍HTML文档基础和经常使用标记,此篇文章的内容框架例如以下,可是仅仅先介绍HTML文档基础:

    上图在HTML文档的经常使用标记中。少画了一个多媒体标记,请见谅!


    1.HTML文档基础:

    1.1 HTML标记:HTML是超文本标记语言。

    主要由文本和标记两部分构成。HTML的标记一般是由“<”、“>”以及当中所包括的标记元素组成的。

    比如:<body></body>就是一对标记。此标记称为主体标记,用来指明文档中的主体内容。

    (1).在HTML超文本标记语言中。大多数标记都是成对出现的。通常是由一个開始标记和一个结束标记组成的,当中開始标记告诉Web浏览器从此处開始运行该标记所表示的功能,而结束标记告诉Web浏览器在这里结束该功能。这类标记称为“双标记”,其语法格式例如以下:

    <标记>内容</标记>

    当中“内容”部分就是要被这对标记起作用的部分。比如在页面中输出y的平方。能够通过<sup></sup>标记来实现。

    (2).接着附上一个“双标记”的样例。启动Dreamweaver CS5工具,也能够用其他编写网页的工具。在创建新项目中选择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">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>输出y的平方</title>
    </head>
    
    <body>
    输出y的平方:y<sup>2</sup>
    </body>
    </html>
    

    接着新建一个网站,点击工具栏的网站,然后这样选择:

     
    然后将这个网页保存到这个网站里,名字改为sup.html。执行效果例如以下:

    (3).尽管在HTML超文本标记语言中。大多数的标记为“双标记”,可是也有一些是以单独形式存在的标记,此类标记称为“单标记”。这类标记仅仅需单独使用就能完整地表达其意思,语法格式为:<标记>

    在HTML超文本标记语言中。最经常使用的“单标记”是<br>,此标记为换行标记。事实上写成<br/>也能够达到换行的效果。

    (4).接下来附上一个“单标记”的样例,通常在页面中用一行显示一段文字,因为此行文字太长显得页面非常不美观,此时能够使用单标记<br>将此段文字分为两行显示。代码例如以下:

    <!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">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>单标记</title>
    </head>
    
    <body>
    梦想遥不可及。可是不可放弃<br>仅仅要再坚持一下。成功的路就在脚下!
    </body>
    </html>
    

    然后依然保存到那个JavaScript网站下,改为br.html,执行后例如以下:

     

    (5).在使用大多数单标记和双标记的開始标记内通常能够包括一些属性。其语法格式为:<标记 属性1 属性2 属性3...>

    在上面的语法中,全部属性必须在開始标记的尖括号“<”中编写,各属性之间用空格分隔,无先后次序之分。属性也能够省略(即取其默认值)。

    属性值须要使用英文半角双引號("")标注。

    (6).接下来附上一个标记中带属性的样例,使用单标记<HR>在页面中画一条水平线,并设置其size属性、noshade属性、width属性和color属性,代码例如以下:

    <!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">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>绘制一条水平线</title>
    </head>
    
    <body>
    <hr size="6" noshade="noshade" width="70%" color="#CCFF55">
    </body>
    </html>
    

    当中代码中的size属性表示水平线的粗细。noshade属性表示将水平线的阴影去掉。水平线默觉得空心带阴影的立体效果,width属性表示水平线的宽度,color属性表示水平线的颜色。

    保存此文件到网站上,文件名称改为br.html。执行效果例如以下:

     



    1.2 HTML文档的基本结构:使用HTML语言编写的超文本文件称为HTML文件。

    能够在Windows下的文本编辑器中手工直接编写HTML文件,也能够使用FrontPage、Dreamweaver等可视化编辑软件编写HTML文档。

    (1).在HTML超文本标记语言中。定义了3种标记用于描写叙述页面的基本结构。HTML中的基本结构例如以下:

    <html>
    <head>
    ...头部信息
    <body>
    ...主体内容
    </body>
    </head>
    </html>

    (2).以下具体介绍各种标记的功能及使用方法:

    — <html>...</html>标记:HTML文档中的第一个标记,该标记用于表示该文档是HTML文档。当浏览器遇到<html>标记时,就会按HTML的标准来解释文本。

    结束标记</html>出如今HTML文档的尾部。

    — <head>...</head>标记:此标记出如今<html>标记内起始的部分,此标记称为头部标记。

    头部标记用于提供与Web页面有关的各种信息。在头部标记中,能够使用<meta>标记模拟HTTP协议的响应头报文,用于鉴别作者、标注内容提要和keyword、设定页面字符集、刷新页面等,在HTML头部能够包含随意数量的<meta>标记;使用<title>...</title>标记来指定网页的标题;使用<style>...</style>标记来定义CSS样式表;使用<script>...</script>标记来插入脚本语言等。

    一般来说,位于头部标记中的内容都不会在网页上直接显示。

    — <body>...</body>标记:此标记称为主体标记,在头部标记</head>之后。它定义了HTML文件显示的主要内容和显示格式。

    作为网页的主体部分,此标记有非常多内置属性,这些属性用于设定网页的整体风格。比如,定义页面的背景图像、背景颜色、文字颜色以及超文本链接颜色等。

    (3).接下来附上一个使用<font>...</font>标记的样例,<font>标记应用于HTML文件的主体标记<body>与</body>之间,而且仅仅影响它所标识的文字。

    这里样例通过<font>标记的face属性定义字体为“黑体”,通过size属性定义大小为“16px”,通过color定义颜色为蓝色,代码例如以下:

    <!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">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>定义文字字体</title>
    </head>
    
    <body>
    应用&lt;font&gt;标记来定义文字字体:
    <br>
    <font face="黑体,宋体" size="16px" color="#3399FF">蓝色的天空下。让我们一起飞翔。</font>
    </body>
    </html>
    

    保存此文件为font.html到网站下。执行后例如以下:

     

    这个样例中,使用了&lt;和&gt;来输出"<"和">"这些符号。即在HTML中为一些特殊的字符设置了特殊的代码。字符的实体名称都以一个“&”符号開始,以一个“;”符号结束。在这个样例代码中,,特殊符号“<”用&lt;标记表示。特殊符号“>”用&gt;标记表示。

    当中还有非常多特殊的代码。如&nbsp;代表空格,&quot;代表英文半角的""双引號等等。



    二.此篇文章介绍了HTML文档的基础,HTML文档的经常使用标记下次再介绍了,以上内容仅供大家学习參考,写得不好,请见谅,如有错误。请指出,谢谢。

    HTML文档的经常使用标记介绍可看这篇文章:http://blog.csdn.net/u012561176/article/details/46956033,里面包括了这篇文章的代码的下载地址。


    
    
  • 相关阅读:
    Windows Azure Storage (17) Azure Storage读取访问地域冗余(Read Access – Geo Redundant Storage, RA-GRS)
    SQL Azure (15) SQL Azure 新的规格
    Azure China (5) 管理Azure China Powershell
    Azure China (4) 管理Azure China Storage Account
    Azure China (3) 使用Visual Studio 2013证书发布Cloud Service至Azure China
    Azure China (2) Azure China管理界面初探
    Azure China (1) Azure公有云落地中国
    SQL Azure (14) 将云端SQL Azure中的数据库备份到本地SQL Server
    [New Portal]Windows Azure Virtual Machine (23) 使用Storage Space,提高Virtual Machine磁盘的IOPS
    Android数据库升级、降级、创建(onCreate() onUpgrade() onDowngrade())的注意点
  • 原文地址:https://www.cnblogs.com/lxjshuju/p/6958479.html
Copyright © 2011-2022 走看看