认识HTML

简介: 认识HTML

一、标签概念:


之前我们说过,在HTML兴起后,网页开发人员开始为这一语言添加新特征,破坏了HTML的简单性,在浏览器如何显示网页这一问题上带来了不一致,导致了网页浏览器必须猜测如何显示网页,网业设计者不能确切的定义网页如何显示。  HTML标签便解决 了这个问题,它标记了一些文本,使网页浏览器能够识别这是哪种文本,进而正确的显示文本。HTML标签是用于指示如何显示网页部分的编码命令。


20160805144855473.png

开始标签:指明HTML命令开始,命令影响的文本位于开始标签后;
结束标签:指明HTML命令结束,命令影响的文本位于开始标签前;
空标签:在页面发出一个HTML命令,而不包含任何文本的HTML标签。


二、应用效果:

1、代码部分:

20160805144932063.png


2、效果图:


20160805144947817.png


3、我们可以先用人做个比喻:


<html>告诉我们:嘿,这是一个人;

<head>告诉我们:哇哦,这是一个已经35岁的数学老师,家里有一个儿子,一个女儿。(这些内容不会从表面上显示给读者);

<body>告诉我们:嘻嘻,这个对象上面穿了一件T恤,下面是一条牛仔裤,看起来是个很阳光的老师,我的数学有救了。(本人自己的想象)

      这样,整个人的形象就基本描述清楚了。但是,为了让这个人看着更加自然,好看,我们给他穿双鞋:

<footer>告诉我们,哈哈,这双鞋不错,是李宁牌的。


20160805145020223.png



       这样,从整体上,我们对一个人的形象大致上就描述清楚了。

三、具体解析:


1、<html >放到文章的开头,表明这是一个网页,当然</html>则表示网页的结束;

2、<head>标识文章的头部,是头部元素的容器。它描述了文档的各种属性和信息,包括文档的标题、在 Web 中的位置以及和其他文档的关系等。绝大多数文档头部包含的数据都不会真正作为内容显示给读者。

可以放在<head>中的标签有:

<base>, <link>, <meta>, <script>, <style>, 以及 <title>。

3、<body>:包含文档的所有内容(比如文本、超链接、图像、表格和列表等等。)

      网页浏览器在网页顶部显示<title></title>之间的文本。

      作用:可以在将网页加到浏览器的书签或收藏夹中时,标识网页;网页提供标题后便于访问网页的人将网页加到书签供以后使用。

4、<footer>标签定义文档或节的页脚。并不是必要元素,从生成的一个html网页最开始部分没有footer部分可以看出。在牛腩中,我们学过,用它来标记。

      最后,HTML暂时了解到这里,接下来会在实践中继续学习。

























相关文章
|
存储 关系型数据库 索引
平衡二叉树,红黑树,B树和B+树的区别及其应用场景
平衡二叉树,红黑树,B树和B+树的区别及其应用场景
838 0
|
弹性计算 数据安全/隐私保护 云计算
云服务器 ECS产品使用问题之如何设置阿里云幻兽帕鲁服务器玩家连接密码
云服务器ECS(Elastic Compute Service)是各大云服务商阿里云提供的一种基础云计算服务,它允许用户租用云端计算资源来部署和运行各种应用程序。以下是一个关于如何使用ECS产品的综合指南。
|
13天前
|
人工智能 JSON 供应链
畅用7个月无影 JVS Claw |手把手教你把JVS改造成「科研与产业地理情报可视化大师」
LucianaiB分享零成本畅用JVS Claw教程(学生认证享7个月使用权),并开源GeoMind项目——将JVS改造为科研与产业地理情报可视化AI助手,支持飞书文档解析、地理编码与腾讯地图可视化,助力产业关系图谱构建。
23495 11
畅用7个月无影 JVS Claw |手把手教你把JVS改造成「科研与产业地理情报可视化大师」
|
17天前
|
人工智能 缓存 BI
Claude Code + DeepSeek V4-Pro 真实评测:除了贵,没别的毛病
JeecgBoot AI专题研究 把 Claude Code 接入 DeepSeek V4Pro,跑完 Skills —— OA 审批、大屏、报表、部署 5 大实战场景后的真实体验 ![](https://oscimg.oschina.net/oscnet/up608d34aeb6bafc47f
5475 20
Claude Code + DeepSeek V4-Pro 真实评测:除了贵,没别的毛病
|
18天前
|
人工智能 JSON BI
DeepSeek V4 来了!超越 Claude Sonnet 4.5,赶紧对接 Claude Code 体验一把
JeecgBoot AI专题研究 把 Claude Code 接入 DeepSeek V4Pro 的真实体验与避坑记录 本文记录我将 Claude Code 对接 DeepSeek 最新模型(V4Pro)后的真实体验,测试了 Skills 自动化查询和积木报表 AI 建表两个场景——有惊喜,也踩
6540 16
|
7天前
|
人工智能 缓存 Shell
Claude Code 全攻略:命令大全 + 实战工作流(完整版)
Claude Code 是一款运行在终端环境下的 AI 编码助手,能够直接在项目目录中理解代码结构、编辑文件、执行命令、执行开发计划,并支持持久化记忆、上下文压缩、后台任务、多模型切换等专业能力。对于日常开发、项目维护、快速重构、代码审查等场景,它可以大幅减少手动操作、提升编码效率。本文从常用命令、界面模式、核心指令、记忆机制、图片处理、进阶工作流等维度完整说明,帮助开发者快速上手并稳定使用。
1666 3
|
6天前
|
前端开发 API 内存技术
对比claude code等编程cli工具与deepseek v4的适配情况
DeepSeek V4发布后,多家编程工具因未适配其强制要求的`reasoning_content`字段而报错。本文对比Claude Code、GitHub Copilot、Langcli、OpenCode及DeepSeek-TUI等主流工具的兼容性:Claude Code需按官方方式配置;Langcli表现最佳,开箱即用且无报错;Copilot与OpenCode暂未修复问题;DeepSeek-TUI尚处早期阶段。
1133 3
对比claude code等编程cli工具与deepseek v4的适配情况