HTML(基础)_html隔多久显示不同内容代码-优快云博客

//<title> 标签定义了不同文档的标题。

//<base> 标签描述了基本的链接地址/链接目标，该标签作为HTML文档中所有的链接标签的默认链接:
<head>
<base href="http://www.runoob.com/images/" target="_blank">
</head>

//<link> 标签定义了文档与外部资源之间的关系。连接css
<head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>

//<style> 标签定义了HTML文档的样式文件引用地址.
<head>
<style type="text/css">
body {background-color:yellow}
p {color:blue}
</style>
</head>

//<meta> 标签提供了元数据.元数据也不显示在页面上，但会被浏览器解析。META 元素通常用于指定网页的描//述，关键词，文件的最后修改时间，作者，和其他元数据。元数据可以使用于浏览器（如何显示内容或重新加//载页面），搜索引擎（关键词），或其他Web服务。<meta> 一般放置于 <head> 区域。

为搜索引擎定义关键词:<meta name="keywords" content="HTML, CSS, XML, XHTML, JavaScript">
为网页定义描述内容:<meta name="description" content="免费 Web & 编程 教程">
定义网页作者:<meta name="author" content="Runoob">
每30秒钟刷新当前页面:<meta http-equiv="refresh" content="30">

//<script>标签用于加载脚本文件

元素

HTML 文档由 HTML 元素定义。

开始标签 *	元素内容	结束标签 *
<p>	这是一个段落	</p>
<a href="default.htm">	这是一个链接	</a>
<br>	换行

HTML 元素语法：

HTML 元素以开始标签起始，以结束标签终止
元素的内容在开始标签与结束标签之间
某些 HTML 元素具有空内容（empty content）
空元素在开始标签中进行关闭 (以开始标签的结束而结束，无内容的 HTML 元素称为空元素)
大多数 HTML 元素可拥有属性

嵌套：大多数 HTML 元素可以嵌套。HTML 文档由相互嵌套的 HTML 元素构成。

属性

属性是 HTML 元素提供的附加信息。

属性	描述
class	为html元素定义一个或多个类名（classname）(类名从样式文件引入)
id	定义元素的唯一id
style	规定元素的行内样式（inline style）
title	描述了元素的额外信息 (作为工具条使用)

字符集

字符集	描述
UTF-8	UTF8 中的字符可以是 1-4 个字节长。UTF-8 可以表示 Unicode 标准中的任意字符。UTF-8 向后兼容 ASCII。UTF-8 是网页和电子邮件的首选编码。
UTF-16	16 比特的 Unicode 转换格式是一种 Unicode 可变字符编码，能够对全部 Unicode 指令表进行编码。UTF-16 主要被用于操作系统和环境中，比如微软的 Windows 2000/XP/2003/Vista/CE 以及 Java 和 .NET 字节代码环境

HTML基本文档

<!DOCTYPE html>
<html>
<head>
<title>文档标题</title>
</head>
<body>
可见文本...
</body>
</html>

基本标签（Basic Tags）

<h1>最大的标题</h1>
<h2> . . . </h2>
<h3> . . . </h3>
<h4> . . . </h4>
<h5> . . . </h5>
<h6>最小的标题</h6>
 
<p>这是一个段落。</p>
<br> （换行）
<hr> （水平线）
<!-- 这是注释 -->

文本格式化（Formatting）

<b>粗体文本</b>
<code>计算机代码</code>
<em>强调文本</em>
<i>斜体文本</i>
<kbd>键盘输入</kbd> 
<pre>预格式化文本</pre>
<small>更小的文本</small>
<strong>重要的文本</strong>
 
<abbr> （缩写）
<address> （联系信息）
<bdo> （文字方向）
<blockquote> （从另一个源引用的部分）
<cite> （工作的名称）
<del> （删除的文本）
<ins> （插入的文本）
<sub> （下标文本）
<sup> （上标文本）

链接（Links）

//语法：
<a href="url">链接文本</a>
 
//使用 target 属性，可以定义被链接的文档在何处显示。下面的这行会在新窗口打开文档：
<a href="https://www.runoob.com/" target="_blank" rel="noopener noreferrer">访问菜鸟教程!</a>

//普通的链接：<a href="http://www.example.com/">链接文本</a>
//图像链接： <a href="http://www.example.com/"><img src="URL" alt="替换文本"></a>
//邮件链接： <a href="mailto:webmaster@example.com">发送e-mail</a>
//书签：
<a id="tips">提示部分</a>
<a href="#tips">跳到提示部分</a>

图片（Images）

//语法
<img src="url" alt="some_text"> 
<img loading="lazy" src="URL" alt="替换文本" height="42" width="42">

样式/区块（Styles/Sections）

<style type="text/css">
h1 {color:red;}
p {color:blue;}
</style>
<div>文档中的块级元素</div>
<span>文档中的内联元素</span>

无序/有序列表

//无序列表
<ul>
    <li>项目</li>
    <li>项目</li>
</ul>

//有序列表
<ol>
    <li>第一项</li>
    <li>第二项</li>
</ol>

定义列表

<dl>
  <dt>项目 1</dt>
    <dd>描述项目 1</dd>
  <dt>项目 2</dt>
    <dd>描述项目 2</dd>
</dl>

表格（Tables）

<table border="1">
  <tr>
    <th>表格标题</th>
    <th>表格标题</th>
  </tr>
  <tr>
    <td>表格数据</td>
    <td>表格数据</td>
  </tr>
</table>

框架（Iframe）

通过使用框架，可以在同一个浏览器窗口中显示不止一个页面。

//语法
<iframe src="URL"></iframe>
<iframe src="demo_iframe.htm"></iframe>
<iframe loading="lazy" src="demo_iframe.htm" width="200" height="200"></iframe>//设置高宽
<iframe src="demo_iframe.htm" frameborder="0"></iframe>//移除边框

表单（Forms）

<form action="demo_form.php" method="post/get">
<input type="text" name="email" size="40" maxlength="50"> //文本域，type="text" 
<input type="password" name="pwd"> //密码字段通过标签 <input type="password"> 来定义
<input type="checkbox" checked="checked"> //复选框
<input type="radio" checked="checked"> //单选框
<input type="submit" value="Send"> //单击确认按钮时，表单的内容会被传送到服务器。
<input type="reset"> 
<input type="hidden">

<select> //定义了下拉选项列表，下拉菜单
<option>苹果</option>
<option selected="selected">香蕉</option>
<option>樱桃</option>
</select>

<textarea name="comment" rows="60" cols="20"></textarea> //定义文本域 (一个多行的输入控件)
</form>

脚本<script>/<noscript>

JavaScript 最常用于图片操作、表单验证以及内容动态更新。

<script>
document.write("Hello World!");
</script>

<script>
document.write("Hello World!")
</script>
<noscript>抱歉，你的浏览器不支持 JavaScript!</noscript>

字符实体（Entities）

&lt; 等同于 <
&gt; 等同于 >
&#169; 等同于 ©

显示结果	描述	实体名称	实体编号
	空格
<	小于号	<	<
>	大于号	>	>
&	和号	&	&
"	引号	"	"
'	撇号	' (IE不支持)	'
￠	分	¢	¢
£	镑	£	£
¥	人民币/日元	¥	¥
€	欧元	€	€
§	小节	§	§
©	版权	©	©
®	注册商标	®	®
™	商标	™	™
×	乘号	×	×
÷	除号	÷	÷