HTML(1)

最新推荐文章于 2024-06-19 12:50:25 发布

yx970326

最新推荐文章于 2024-06-19 12:50:25 发布

阅读量156

点赞数

分类专栏： HTML 文章标签：自学总结

HTML 专栏收录该内容

6 篇文章 0 订阅

订阅专栏

用记事本打开一个页面
文件扩展名是操作系统用来标记文件格式的一种机制，扩展名如同文件的身份说明，区别了文件的类别和作用,HTML的文件后缀名为.html或.htm
HTML文档的基本结构：
样本代码

<html>
   <!--页面头部-->
   <head>    
       <title>
       </title>
   </head>
   <!--页面身体-->
   <body>
   </body>
</html>

一、标签

1.作用：标记页面中的内容，使浏览器能够识别设计者的要求,正确地在网页中显示出来

2.遵循规则：

a.标签由开始标签起头，一定要有结束标签收尾，有些标签默认情况下可以省略收尾标签，但并不表示没有收尾标签，只有 <link>和<base>两个标签在写法上不需要封闭

b.标签中的属性值必须放在引号中
c.同一个文本使用多个标签时必须按照嵌套的原则
二、一个完整的页面通常必须具备5个标签：

1.样本代码 : 起声明作用，告诉浏览器所书写的HTML代码的版本。浏览器根据设计者的定义来解析代码，展现出相应的页面

2.开始标签<html> : 定义页面从哪里开始(<html>)到哪里结束(</html>)

出现形式

<html xmlns=http://www.w3.org/1999/xhtml xml:lamg="en">

xmlns和xml:lang是XHTML网页的标准要求，用于指定与该标签相关的一些信息

3.头标签<head>和头标签的对象 : 有6个特殊的标签可以在头标签中使用
<meta>标签 : <head>标签中的一个辅助标签，有两个重要属性:name和http-equiv,通常用于能够优化页面被搜索的可能。
<meta>标签：对于一般的页面制作者来说实用意义不大，多数网页中也仅用其来定义版权信息
<link>标签 : 定义了一个外部文件的链接，经常被用于链接外部CSS样式
<base>标签 : 为整个页面定义了所有链接的基础定位，主要作用是确保文档中所有的相对URL都可以被分解成正确的文档地址，使在文档本身被移动或重命名的情况下也可以正确解析
<style>标签 : 用来定义CSS的样式

4.标题标签<title>:设置网页的标题名
<title>标签也是<head>标签的对象，如果页面没有标题，那么页面标题都将默认为Untitled Document,一个正规的页面必须要有页面标题，而<head>标签中的其他5个标签可视情况选择使用
使用方法

 <html>
       <head>
            <title>title标签的使用</title>
       </head>
   </html>

5.文体标签<body>:定义网页的主体内容的开始和结束，网页主体内容是页面浏览者能够在浏览器上看到的网页中的内容
使用方法

<html>
       <head>
          <title>body标签的使用</title>
       </head>
       <body>
           这是我的第一个网页
           哈哈哈哈，我很开心
       </body>   
   </html>

需要注意的是，浏览器并不会自动识别文本的版式

同<head>标签一样，<body>标签只是用来表明页面的结构，重点是<body>的对象（即哪些标签可以放在其中使用和如何使用）

案例（一）制作一则寓言小故事，设定标题

<html>
   <head>
       <title>宽容</title>
   </head>
   <body>
           一只小猪、一只小羊和一头乳牛，被关在同一个畜栏里。
       <br>有一次，牧人捉住小猪，它大声号叫......但是捉住我，
       <br>却是要我的命呢！立场不同、所处的环境不同的人，
       <br>很难了解对方的感受，因此对别人的失意、挫折、
       <br>伤痛、不宜幸灾乐祸，而应要有关怀、了解的心情。
       <br>要有宽容的心！
   </body>
</html>

结果