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

HTML 实例/测验之HTML 基础一口气讲完!(o-ωq)).oO 困

HTML 基础

非常简单的HTML文档

<!DOCTYPE html>
<html><head><title>页面标题(w3cschool.cn)</title></head><body><h1>我的第一个标题</h1><p>我的第一个段落。</p></body>
</html>

输出:
 

我的第一个标题

我的第一个段落。

HTML标题

<!DOCTYPE html>
<html>
<head><meta charset="utf-8"><title>W3Cschool(w3cschool.cn)</title>
</head>
<body><h1>这是标题1</h1><h2>这是标题2</h2><h3>这是标题3</h3><h4>这是标题4</h4><h5>这是标题5</h5><h6>这是标题6</h6></body>
</html>

输出:

这是标题1

这是标题2

这是标题3

这是标题4
这是标题5
这是标题6

HTML段落

<!DOCTYPE html>
<html>
<head><meta charset="utf-8"><title>W3Cschool(w3cschool.cn)</title>
</head>
<body><p>这是一个段落。</p> <p>这是另外一个段落。</p></body>
</html>

输出:
 

这是一个段落。

这是另外一个段落。

HTML链接

<!DOCTYPE html>
<html>
<head><meta charset="utf-8"><title>W3Cschool教程(w3cschool.cn)</title>
</head>
<body><a href="https://www.w3cschool.cn">这是一个链接使用了 href 属性</a></body>
</html>

输出:

这是一个链接使用了 href 属性

HTML图片

<!DOCTYPE html>
<html>
<head><meta charset="utf-8"><title>W3Cschool教程(w3cschool.cn)</title>
</head>
<body><img src="/statics/images/logonew2.png"  width="206"  height="36" ></body>
</html>

输出:该图片

以下是一个用 HTML 编写的包含标题、段落、链接和图片的实例:

<!DOCTYPE html>
<html><head><title>HTML 实例</title>
</head><body><h1>美丽的自然风光</h1><p>大自然拥有着令人惊叹的美景,让人陶醉其中。</p><p>你可以通过以下链接了解更多关于自然的信息:<a href="https://www.example.com/nature">自然之美网站</a>.</p><img src="nature.jpg" alt="美丽的自然风景" width="500">
</body></html>

在这个实例中:

  • <h1>美丽的自然风光</h1>定义了一个一级标题。
  • <p>大自然拥有着令人惊叹的美景,让人陶醉其中。</p><p>你可以通过以下链接了解更多关于自然的信息:<a href="https://www.example.com/nature">自然之美网站</a>.</p>是两个段落,其中第二个段落包含一个链接。
  • <img src="nature.jpg" alt="美丽的自然风景" width="500">插入了一张名为 “nature.jpg” 的图片,并设置了宽度为 500 像素,同时设置了替代文本 “美丽的自然风景”,以便在图片无法加载时显示。

请注意,实际使用时需要将 “nature.jpg” 替换为真实的图片文件名和路径。


http://www.mrgr.cn/news/55504.html

相关文章:

  • 自动化工具:Ansible
  • Array数组
  • MySQL 中的外键检查设置:SET FOREIGN_KEY_CHECKS = 1
  • perl文件测试操作符及其意义
  • 使用Airtest自动化某云音乐爬取歌曲名称
  • 数据轻松上云——Mbox边缘计算网关
  • 《Frida Android SO逆向深入实践》书评——清华大学出版社
  • Electron兼容win7版本的打包流程
  • 周报 | 24.10.14-24.10.20文章汇总
  • AI 编译器学习笔记之八 -- Python基础学习
  • 从0到1构建Next.Js项目SSG和SSR应用
  • Effective C++ | 读书笔记 (一)
  • MySQL-31.索引-结构
  • 二叉树习题其二Java【力扣】【算法学习day.9】
  • web前端第一次作业
  • 多线程
  • JAVA Maven的简单介绍
  • go 包相关知识
  • 龙芯+FreeRTOS+LVGL实战笔记(新)——12按键输入初步
  • SpringCloud 入门实战基础篇
  • 写一个自动采集地球前30行业的小程序
  • C++11 异常处理:优势、劣势与规范
  • JS事件和DOM
  • Uboot是如何发现Devicetree并将它传递给Linux的
  • Spring Async异步源码分析
  • 文件 (上)