html

最新推荐文章于 2024-06-07 18:11:32 发布
最新推荐文章于 2024-06-07 18:11:32 发布
阅读量320 收藏
点赞数 1
分类专栏： 以往文章 文章标签： html
本博客所有文章禁止转载及抄袭，侵权必究。
本文链接：https://blog.csdn.net/qq_39660930/article/details/77717815
版权 
<!-- 注释 -->
<!-- <!DOCTYPE>声明有助于浏览器中正确显示网页。网络上有很多不同的文件，如果能够正确声明HTML的版本，浏览器就能正确显示网页内容。doctype 声明是不区分大小写的。 -->
<!DOCTYPE html>
<html>
	<head>
		<!-- 为搜索引擎定义关键词: -->
		<meta name="keywords" content="HTML, CSS, XML, XHTML, JavaScript">
		<!-- 为网页定义描述内容: -->
		<meta name="description" content="Free Web tutorials on HTML and CSS">
		<!-- 定义网页作者: -->
		<meta name="author" content="Hege Refsnes">
		<!-- 每30秒中刷新当前页面: -->
		<meta http-equiv="refresh" content="30">
		<!-- 指定中文编码 -->
		<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
		
		<title>html实例</title>
		<!-- 页面默认的url地址 -->
		<base href="./" target="_blank">
		
		<!-- 定义文档与外部资源之间的关系。 通常用于链接到样式表 -->
		<!-- CSS -->
		<link rel="stylesheet" type="text/css" href="mystyle.css">
		
		<!-- 定义HTML文档的样式文件引用地址.在<style>元素中你需要指定样式文件来渲染HTML文档 -->
		<!-- CSS -->
		<style type="text/css">
		body {background-color:yellow}
		h1 {color:red;}
		p {color:blue;}
		</style>
	</head>
	<body>
		<h1>这是标题 1</h1>
		<h2>这是标题 2</h2>
		<h3>这是标题 3</h3>
		<h4>这是标题 4</h4>
		<h5>这是标题 5</h5>
		<h6>这是标题 6</h6>

		<!-- 段落的行数依赖于浏览器窗口的大小。如果调节浏览器窗口的大小，将改变段落中的行数。 -->
		<p>这是一个段落。</p>
		
		<!-- 换行 -->
		<br />

		<!-- 水平线 -->
		<hr>
		
		<img src="捕获.PNG" width="50" height="50" />
		
		<br />

		<b>这个文本是加粗的</b>

		<br />

		<strong>这个文本是加粗的</strong>

		<br />

		<em>这个文本是斜体的</em>

		<br />

		<i>这个文本是斜体的</i>

		<br />
		
		<big>这个文本字体放大</big>

		<br />

		<small>这个文本是缩小的</small>

		<br />
		
		<p>这个文本包含<sub>下标</sub></p>

		<p>这个文本包含<sup>上标</sup></p>
		
		<pre>
		此例演示如何使用 pre 标签

		对空行和    空格
		进行控制
		</pre>
		
		<code>计算机输出</code>
		<br />
		<kbd>键盘输入</kbd>
		<br />
		<tt>打字机文本</tt>
		<br />
		<samp>计算机代码样本</samp>
		<br />
		<var>计算机变量</var>
		<br />
		
		<address>
		Written by <a href="mailto:498046691@qq.com">pengfei</a>.<br> 
		Visit us at:<br>
		Example.com<br>
		Box 564, Disneyland<br>
		USA
		</address>
		
		<!-- 缩小，鼠标移上去显示全名 -->
		<abbr title="etcetera">etc.</abbr>
		<br />
		<acronym title="World Wide Web">WWW</acronym>
		
		<p>该段落文字从左到右显示。</p>  
		<p><bdo dir="rtl">该段落文字从右到左显示。</bdo></p>  
		
		<p>块应用
		<q>引用部分</q>
		</p>
		
		<p><del>删除线</del> <ins>下划线</ins></p>

		<a href="http://www.runoob.com/" target="_blank">访问菜鸟教程!（新窗口打开）</a>
		<br />
		<!-- 不要少写一个斜杠，写成http://www.baidu.com，会请求服务器两次 -->
		<a href="http://www.baidu.com/">百度链接</a>
		<br />

		<a id="tips">有用的提示部分</a>
		<br />
		<!-- 在HTML文档中创建一个链接到"有用的提示部分(id="tips"）"： -->
		<a href="#tips">访问有用的提示部分</a>
		<br />
		<!-- 或者，从另一个页面创建一个链接到"有用的提示部分(id="tips"）"： -->
		<a href="http://www.runoob.com/html/html-links.html#tips">访问有用的提示部分</a>
		<br />
		
		<p>创建图片链接:
			<a href="http://www.runoob.com/html/html-tutorial.html">
				<img src="smiley.gif" alt="HTML 教程" width="32" height="32">
			</a>
		</p>

		<p>有边框的图片链接:
			<a href="http://www.runoob.com/html/html-tutorial.html">
				<img border="1" src="smiley.gif" alt="HTML 教程" width="32" height="32">
			</a>
		</p>
		
		<p>
		<a href="#C4">查看章节 4</a>
		</p>

		<h2>章节 1</h2>
		<p>这边显示该章节的内容……</p>

		<h2>章节 2</h2>
		<p>这边显示该章节的内容……</p>

		<h2>章节 3</h2>
		<p>这边显示该章节的内容……</p>

		<h2><a id="C4">章节 4</a></h2>
		<p>这边显示该章节的内容……</p>

		<h2>章节 5</h2>
		<p>这边显示该章节的内容……</p>		
		
		<!-- 有框架结构时才可以看出效果。 -->
		<p>跳出父框架?</p> 
		<a href="http://www.runoob.com/" target="_parent">点击这里!</a> 
		<p>跳出所有框架?</p> 
		<a href="http://www.runoob.com/" target="_top">点击这里!</a> 
		
		<p>
		这是一个电子邮件链接：
		<a href="mailto:498046691@qq.com?Subject=Hello%20again" target="_top">
		发送邮件</a>
		</p>
		<p>
		<b>注意:</b> 单词直接空格使用 %20 代替，以确保浏览器可以正常显示文本，安装邮件客户端后使用。
		</p>
		<p>
		这是另一个电子邮件链接：
		<a href="mailto:498046691@qq.com?cc=498046691@qq.com&bcc=andsomeoneelse@example.com&subject=Summer%20Party&body=You%20are%20invited%20to%20a%20big%20summer%20party!" target="_top">发送邮件!</a>
		</p>

		<!-- CSS -->
		<p>CSS 实例开始</p>
		<pre>
		CSS 可以通过以下方式添加到HTML中:
			内联样式- 在HTML元素中使用"style" 属性
			内部样式表 -在HTML文档头部 head 区域使用style 元素 来包含CSS
			外部引用 - 使用外部 CSS 文件
		</pre>
		<a href="http://www.runoob.com/" style="text-decoration:none;">访问 runoob.com!（无下划线）</a>
		
		
		<p>CSS 实例结束</p>
		
	</body>
</html>
程序员阿周
关注
  • 1
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
专栏目录
1CSDN博客.html
08-25
JavaScript Date 对象以及两大定时器 通过js实现的时间对象的获取以及相关函数的封装 两大定时器的使用
一套后台管理html模版
08-04
【标题】：“一套后台管理html模版” 这套后台管理HTML模板是专为构建高效、功能丰富的后台管理系统界面设计的。HTML模版是前端开发的基础，它定义了网页的结构和样式，使得开发者能够快速搭建出美观且易于操作的...
HTML基础(CSDN)
ToDarryL的博客
08-06 1352
学习HTML的目标 目录 1.什么是网站跟网页 网站是指在因特网上根据一定的规则，使用HTML等制作的用于展示特定内容相关的网页集合 网页是网站中的一"页",通常是HTML格式的文件,他要通过浏览器来阅读 2.网页是构成网站的基本元素 网页是构成网站的基本元素,它通常由图片、链接、文字、声音、视频等元素组成。通常我们看到的网页,常见以.htm或.html后缀结尾的文件,因此将其俗称为HTML文件。 1.1什么是HTML HTML指的是超文本标记语言(Hyper Text Markup Lan
HTML学习
最新发布
weixin_66989547的博客
06-07 1150
HTML（Hyper Text Markup Language）是一种用于创建网页的标记语言。它是一种开放标准，由万维网联盟（W3C）制定和维护。HTML的目的是为网页开发人员提供一种简单、灵活的语言，用于创建各种类型的网页内容，包括文本、图像、链接、表格、表单等。HTML的历史可以追溯到1990年代初，当时互联网还处于起步阶段。最早的HTML版本是HTML 1.0，它只包含少数几个标签，如＜P＞、＜H1＞、＜A＞等。随着互联网的不断发展和普及，HTML也不断更新和发展。
CSDN博客专栏HTML语言编写详解
fdgyfghh的博客
02-12 314
CSDN博客专栏HTML语言编写详解
HTML动态爱心代码爱心满屏
11-07
HTML动态爱心代码满屏爱心免费下载
网上订餐系统模板html源码
06-11
网上订餐系统模板HTML源码是一个用于构建在线订餐平台的前端资源，它包含了实现基本功能所需的HTML文件。由于描述中提到该源码是静态的，这意味着它不包含任何服务器端代码或与数据库的交互，因此它主要用于展示界面...
纯HTML网页源码
11-02
HTML，全称HyperText Markup Language，即超文本标记语言，是构建互联网页面的基础。它是一种标记语言，通过一系列标签来描述网页的结构和内容。"纯HTML网页源码"指的是只包含HTML代码，不依赖其他如JavaScript、CSS...
爱心代码 李峋同款爱心等免费下载 exe、py、html格式
11-12
【标题】"爱心代码 李峋同款爱心等免费下载 exe、py、html格式" 提供了一组与编程相关的资源，这些资源包含了不同格式的爱心图案实现，包括可执行文件（exe）、Python脚本（py）以及HTML页面（html）。这暗示我们...
HTML
weixin_30875157的博客
09-02 220
前端基础之HTML CSDN 目录 一、HTML介绍 二、head内常用标签 三、body内常用标签 一、HTML介绍 1.web服务本质 from socket import socket, SOL_SOCKET, SO_REUSEADDR sk = socket() sk.setsockopt(SOL_SOCKET, SO_REUSEADDR, 1) ...
HTML基础知识详解
"HTML知识点汇总" HTML（HyperText Markup Language）是一种标记语言，用于构建和组织网页的结构。它是Web开发的基础，允许开发者通过各种标签来指定网页内容的样式和布局。以下是对HTML部分核心知识点的详细说明：...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

程序员阿周

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值