博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
HTML基本架构
阅读量:6689 次
发布时间:2019-06-25

本文共 1377 字,大约阅读时间需要 4 分钟。

HTML骨架示例

                HTML文件标题        HTML头信息                        HTML内容信息       说明
  • HTML文档首先要声明一个文档类型,也就是上面例子第一行,定义了XHTML1.1文档类型(文档类型是为了说明这个页面使用了何种HTML规则,或者结构,这个在将来的教程中会详细介绍)
  • <html></html>是HTML文档的开始与结束,也是HTML文档的根元素
  • 除了文档类型外的所有页面内容,都包括在html元素
  • HTML文件中主要分为头信息head与内容信息body

文档head信息

  • 头信息head可以容纳文档的HTML相关信息,比如标题title,页面的语言与文字类型,css样式,javascript代码,简短描述关键词等内容,是用户无法直接看到的

文档body信息

  • 内容信息body包括用户可以看到的全部内容,比如段落,链接,表格等
  • 同学们还要注意一点,编写代码时一定要有层次感,head标签和body标签都是在html标签中的,所以我向后挫了一个tab键的距离,而HTML头信息又比head标签后挫了一个tab键的距离

上面就是html最基本的架构,而我们将来要学习的内容多数在body元素中,还有一少部分在head元素中

1.HTML的html标签

html 标签 -- 代表HTML文档的开始
  • html标签是成对出现的,以<html>开始, </html>结束
  • 属性
    • Commom -- 一般属性
    • xml:lang -- 国际化属性
    • xmlns -- 代表xml命名空间
    • dir-- 定义元素(文字)的对齐方式

示例

 

说明

  • 代表使用http://www.dreamdu.com做为命名空间
  • 代表使用中文作为页面文字
  • 代表左到右(left-to-right)的文字对齐方式

2.HTML的head标签

head 标签 -- 代表HTML文档的头信息
  • head标签是成对出现的,以<head>开始,</head>结束
  • 属性
    • Common -- 一般属性

说明

  • 头(head)包含了当前文档的一些信息,例如标题信息,meta信息等,正常情况下头信息是不会显示在HTML文档中的.
  • head元素包含的标签:
    • 标签
    • 标签
    • 标签
    • 标签
    • 标签
    • 标签

 3.HTML的title标签

title标签 -- 代表HTML文档的标题

  • title标签是成对出现的,以<title>开始,</title>结束
  • 属性
    • Common-- 一般属性

示例

        XHTML title 标签事例

说明

  • 此标签只能在标签内出现
  • title的内容通常在浏览器的标题栏中显示
  • 浏览器中收藏夹内书签的名称是title的内容
  • title的内容可以方便搜索引擎索引页面
  • 从搜索引擎搜索到的内容的标题往往是网页title的内容
  • title通常体现了网页的主体内容,所以记得一定要加上:)

使用技巧

比如"后台管理"这个页面,title内容的写法通常是"博客园后台管理 -- 博客园"

比如网站的"首页",title内容的写法通常是"首页 -- 介绍网站建设知识(HTML教程,CSS教程)"

 

转载于:https://www.cnblogs.com/JSWBK/p/5599804.html

你可能感兴趣的文章
putty连接 输入用户名后半天才弹出输入密码
查看>>
Linux 创建用户
查看>>
Debian6 mod_spdy 测试
查看>>
Unity - NullReferenceException: Object reference not set to an instance of an object
查看>>
1.1Tinking In Java——析构函数2
查看>>
String的一些基本方法
查看>>
log4j2中文乱码解决方案
查看>>
我的友情链接
查看>>
ABP实时服务-通知系统.发布模式
查看>>
tomcat
查看>>
CentOs7中的网卡配置工具
查看>>
第7章WEB07- JDBC篇
查看>>
django 问题收集
查看>>
if判断 分数
查看>>
高规格虚机 sys cpu高现场分析工具箱
查看>>
怎么把图片转成JPG格式
查看>>
教你如何将网页上的视频下载到手机
查看>>
字节码学院|编程是未来社会的基本能力
查看>>
JDK 1.8.0_144 集合框架之LinkedHashMap
查看>>
MySQL学习之如何快速扩展数量
查看>>