HTML 基本骨架

HTML5的骨架是构建HTML5页面的基础结构，它主要由以下几个部分组成：

<!DOCTYPE html>

<html>

<head>

  <meta charset="utf-8">

  <title>标题</title>

</head>

<body>

  <div>

    <p>正文</p>

  </div>

</body>

</html>

1. DOCTYPE声明

  • 作用：DOCTYPE是document type（文档类型）的缩写，它位于HTML文档的最前面，用于告知浏览器这个文档使用的是哪个HTML版本。对于HTML5，DOCTYPE声明如下：
<!DOCTYPE html>

这个声明是HTML5页面的必备组成部分，它有助于避免浏览器的怪异模式（quirks mode），确保页面在不同浏览器中能够以统一的标准进行渲染。

2. <html>标签

  • 作用：<html>标签是HTML页面的根元素，它包裹了整个页面的内容。<html>标签限定了文档的开始点和结束点，浏览器在解析到这个标签时，就会知道这是一个HTML文档。
<html lang="en">

...

</html>

其中，lang="en"属性用于指定当前页面的主要语言是英语。这有助于搜索引擎更好地理解页面内容，并改善无障碍访问性（accessibility）。

3. <head>标签

  • 作用：<head>标签用于定义文档的头部，它包含了文档的元数据（metadata），如文档的标题、字符集编码、对外部文件（如样式表、脚本）的引用等。<head>标签中的内容不会直接显示在网页上，但对网页的渲染和行为有重要影响。
<head>

  <meta charset="UTF-8">

  <title>页面标题</title>

  <link rel="stylesheet" href="styles.css">

  <script src="scripts.js" defer></script>

</head>
  • <meta charset="UTF-8">：指定页面的字符编码为UTF-8，这是一种广泛使用的字符编码，能够表示世界上大多数语言的字符。
  • <title>标签：定义了网页的标题，这个标题会显示在浏览器的标题栏或标签页上。<title>标签是<head>标签中唯一必须包含的标签。
  • <link>和<script>标签：分别用于引入外部的样式表和JavaScript文件。这些文件通常包含了页面的样式和行为逻辑。

4. <body>标签

  • 作用：<body>标签定义了HTML文档的主体部分，即用户可以直接在浏览器中看到的内容。<body>标签包含了网页的所有内容，如文本、图片、链接、表格、列表等。
<body>

  <h1>这是一个标题</h1>

  <p>这是一个段落。</p>

  <img src="data:image.jpg" alt="描述性文本">

  <!-- 其他内容 -->

</body>

在<body>标签中，可以使用各种HTML标签来构建网页的结构和内容。

HTML 基本骨架的更多相关文章

  1. 快速构建H5单页面切换骨架

    在Web App和Hybrid App横行的时代,为了拥有更好的用户体验,单页面应用顺势而生,单页面应用简称`SPA`,即Single Page Application,就是只有一个HTML页面的应用 ...

  2. HTML5入门（---------------HTML——基本骨架--------------）

    HTML基础 一.HTML 超文本标记语言.英文全拼:HyperText Markup Language.负责网页的语义描述. 二.HTML基本骨架 <!DOCTYPE html> < ...

  3. Maven之自定义archetype生成项目骨架(一)

      Maven之自定义archetype生成项目骨架(一) 标签: mavennexus插件 2015-07-15 16:40 2443人阅读 评论(0) 收藏 举报  分类: Maven技术(9)  ...

  4. python数字图像处理（19）：骨架提取与分水岭算法

    骨架提取与分水岭算法也属于形态学处理范畴,都放在morphology子模块内. 1.骨架提取 骨架提取,也叫二值图像细化.这种算法能将一个连通区域细化成一个像素的宽度,用于特征提取和目标拓扑表示. m ...

  5. 按照索引的细化提取骨架算法的java实现

    近期研究验证码识别,也就看了一些图像识别的资料,其中一种字体细化提取骨架的算法网上没有java版的实现,所以就选取了一个python实现版本进行java代码的改写.. python版实现的地址: ht ...

  6. 【转】idea 用maven骨架生成项目速度慢的问题

    转自:http://9leg.com/maven/2015/02/01/why-is-mvn-archetype-generate-so-low.html 最近从IntelliJ Idea 14的Co ...

  7. cordova3.X 运用grunt生成plugin自定义插件骨架

    Cordova提供了一组设备相关的API,通过这组API,移动应用能够以JavaScript访问原生的设备功能,如摄像头.麦克风等.Cordova还提供了一组统一的JavaScript类库,以及为这些 ...

  8. openni和骨架追踪 rviz查看---34

    原创博客:转载请标明出处:http://www.cnblogs.com/zxouxuewei/ 1.安装深度相机的NITE. 首先下载NITE-Bin-Dev-Linux-x64-v1.5.2.23, ...

  9. maven3实战之maven使用入门(使用archetype生成项目骨架)

    maven3实战之maven使用入门(使用archetype生成项目骨架) ---------- maven提供了archetype以帮助我们快速勾勒出项目骨架.以Hello World为例,我们使用 ...

  10. 沈逸老师PHP魔鬼特训笔记（6）--巫术与骨架

    PHP最牛逼的特性之一除了懒人函数,还有一些魔法函数. 首先我们来认识下__tostring,通过一个巫术方法,我们吧实例转化过后的类,直接当字符串输出.结合我们前面所做的功能,我们在类里面加上这个函 ...

随机推荐

  1. git针对指定网站设置代理

    我们经常要用到各种git地址,比如github.gitee还有自己搭建的git等等. 但是github我们经常拉取和推送代码的时候超时,这时候如果我们搜索会发现大量的文章都是告诉我们设置全局系统代理: ...

  2. Blazor 组件库 BootstrapBlazor 中Row组件介绍

    组件介绍 在Bootstrap中,我们经常使用row和col通过栅格化来控制显示位置. 如 <div class="row"> <div class=" ...

  3. CCPC Henan Provincial Contest 2020

    CCPC Henan Provincial Contest 2020 Problem B. 广告投放 n集节目按顺序播出,节目组决定在某些节目中投放广告,节目最初播出时有m名观众,若\(i\)集投放广 ...

  4. java集合【10】——— LinkedList源码解析

    1.LinkedList介绍 我们除了最最常用的ArrayList之外,还有LinkedList,这到底是什么东西?从LinkedList官方文档,我们可以了解到,它其实是实现了List和Queue的 ...

  5. Nginx HttpHeader增加几个关键的安全选项

    针对像德勤这样的专业渗透测试(Pentest)的场景中,为了确保网站的安全性并通过严格的安全审查,需要为这些安全头配置更细致.专业的参数. 以下是对每个选项的建议以及设置值的详细说明: 1. Stri ...

  6. Sealos Devbox 云开发框架使用教程

    用过 Sealos 云开发的同学,想必都很熟悉函数式编程,喜欢 Sealos 云开发的那种完全不用关心路由,开发快,上线快,调试快,越用越简单越简单越用的感觉.它就像一个温柔的保姆,帮你打理好了所有的 ...

  7. 鱼与熊掌可以兼得，腾讯云推出COS on CDC对象存储服务

    01 前言 在云计算时代,各个企业的信息基础设施都在进行云化转型,一时间,似乎万物皆可上云.但是在上云过程中,有不少客户遇到过这样的问题:有部分数据出于合规需求,需要在本地存储与处理,怎么办?一些数据 ...

  8. 企架布道：中电金信应邀出席2023佛山敏捷之旅暨DevOps Meetup

    近日,2023佛山敏捷之旅暨DevOps Meetup活动顺利举行,本次活动以助力大湾区金融和互联网企业敏捷DevOps实施和效能提升为主题,共设立 2个会场,16个话题分享,200余位金融.互联网企 ...

  9. 鸿蒙(HarmonyOS)原生AI能力之文本识别

    鸿蒙(HarmonyOS)原生AI能力之文本识别 原生智能介绍 在之前开发中,很多场景我们是通过调用云端的智能能力进行开发.例如文本识别.人脸识别等. 原生即指将一些能力直接集成在本地鸿蒙系统中,通过 ...

  10. 【Vue】学习笔记：Vue组件

    文末有我看的这个视频的链接. 目录 组件注册 全局注册 组件基础 组件命名规则 template选项 单项数据流 data选项 局部注册 单独配置组件的选项对象 ES6对象属性简写 组件通信 父组件向 ...