当前位置: 首页 > news >正文

HTML 初体验

HTML(超文本标记语言)全称:HyperText Markup Language。

超文本是什么?

答:超文本就是网页中的链接。

标记是什么?

答:标记也叫标签,是带尖括号的文本。

需求1:将“我爱中国”显示在网页上。

代码1:

//需求1:将“我爱中国”显示在网页上。
<!DOCTYPE html>
<html><head><meta charset="utf-8" /><title></title></head><body>我爱中国</body>
</html>

网页结果1:

需求2:将“我爱中国”加粗显示在网页上。

代码2:

//需求2:将“我爱中国”加粗显示在网页上。
<!DOCTYPE html>
<html><head><meta charset="utf-8" /><title></title></head><body><strong>我爱中国</strong></body>
</html>

网页结果2:

其中"<strong>"叫做开始标签,"</strong>"叫做结束标签。

双标签概念:成对出现的标签,例如上面提及的"<strong></strong>"标签。

单标签概念:只有开始标签,没有结束标签,例如:"<br>"换行标签;"<hr>"水平线标签。

需求3:将“我爱中国”加粗显示在网页上,将“国家富强,民族复兴”不加粗显示在网页上。

代码3:

//需求3:将“我爱中国”加粗显示在网页上,将“国家富强,民族复兴”不加粗显示在网页上。
<!DOCTYPE html>
<html><head><meta charset="utf-8" /><title></title></head><body><strong>我爱中国</strong>国家富强,民族复兴</body>
</html>

网页结果3:

需求4:将“我爱中国”加粗显示在网页上,将“国家富强,民族复兴”不加粗换行显示在网页上。

代码4:

//需求4:将“我爱中国”加粗显示在网页上,将“国家富强,民族复兴”不加粗换行显示在网页上。
<!DOCTYPE html>
<html><head><meta charset="utf-8" /><title></title></head><body><strong>我爱中国</strong><br>国家富强,民族复兴</body>
</html>

网页结果4:

需求5:将“我爱中国”显示在网页上,在下一行显示一条水平线。

代码5:

//需求5:将“我爱中国”显示在网页上,在下一行显示一条水平线。
<!DOCTYPE html>
<html><head><meta charset="utf-8" /><title></title></head><body><strong>我爱中国</strong><hr></body>
</html>

网页结果5:

提问:

1.保存HTML标签的文件扩展名是什么?

答:.html。

2.HTML标签名要放到什么括号里面?

答:尖括号(<>)。

3.结束标签比开始标签多什么?

答:“/”。

4.标签包裹的内容放在什么位置?

答:开始标签和结束标签之间。

http://www.xdnf.cn/news/1115281.html

相关文章:

  • HarmonyOS组件/模板集成创新活动-元服务小云体重管理引入案例(步骤条UI组件)
  • HarmonyOS组件/模板集成创新活动-开发者工具箱
  • 【设计模式】备忘录模式(标记(Token)模式)
  • 为什么玩游戏用UDP,看网页用TCP?
  • 融合开源AI大模型与MarTech:AI智能名片与S2B2C商城小程序源码赋能数字化营销新生态
  • 【QT】使用QSS进行界面美化
  • 【Linux | 网络】应用层
  • Rust赋能文心大模型4.5智能开发
  • Leetcode 3615. Longest Palindromic Path in Graph
  • 操作系统-第四章存储器管理和第五章设备管理-知识点整理(知识点学习 / 期末复习 / 面试 / 笔试)
  • 笔记/sklearn中的数据划分方法
  • 滑动窗口-76.最小覆盖子串-力扣(LeetCode)
  • 【保姆级图文详解】MCP架构(客户端-服务端)、三种方式使用MCP服务、Spring AI MCP客户端和服务端开发、MCP部署方案、MCP安全性
  • 【Datawhale夏令营】用AI做带货视频评论分析
  • Spring-----MVC配置和基本原理
  • QCustomPlot绘图保存成PDF文件
  • office-ai整合excel
  • 特征选择方法
  • 数据库3.0
  • Java SE--图书管理系统模拟实现
  • PHP语法高级篇(二):文件处理
  • JVM 锁自动升级机制详解
  • 【AI论文】GLM-4.1V-Thinking:迈向具备可扩展强化学习的通用多模态推理
  • Java面试基础:面向对象(2)
  • 数学与应用数学核心课程有哪些?全文解析!
  • 【webrtc】gcc当前可用码率2:设置阈值通知码率改变
  • 梯度下降算法:像下山一样找到最优解
  • Linux驱动开发1:设备驱动模块加载与卸载
  • ControlNet与T2IAdapter
  • 三种网络类型