三⼩时学会HTML（菜鸟教程精华版）
三⼩时学完HTML（菜鸟教程)
声明为 HTML5 ⽂档
<html> 元素是 HTML 页⾯的根元素
<head> 元素包含了⽂档的元（meta）数据，
如 <meta charset="utf-8"> 定义⽹页编码格式为 utf-8。
<title> 元素描述了⽂档的标题
<body> 元素包含了可见的页⾯内容
<h1> 元素定义⼀个⼤标题
<p> 元素定义⼀个段落
（对于中⽂⽹页需要使⽤ <meta charset="utf-8"> 声明编码，否则会出现乱码。有些浏览器(如 360 浏览器)会设置 GBK 为默认编码，则你需要设置为 <meta charset="gbk">。
⽬前在⼤部分浏览器中，直接输出中⽂会出现中⽂乱码的情况，这时候需要在头部将字符声明为 UTF-8）
HTML 标题（Heading）是通过<h1> - <h6> 标签来定义的。
<h1>定义最⼤的标题。<h6>定义最⼩的标题。
HTML 段落是通过标签 <p> 来定义的
HTML 链接是通过标签 <a> 来定义的
<a href="www">这是⼀个链接</a>
winform 设计模式提⽰：在 href 属性中指定链接的地址
HTML 图像是通过标签 <img> 来定义的
<img loading="lazy" src="/images/logo.png" width="258" height="39"/>
HTML 元素语法
HTML 元素以开始标签起始
HTML 元素以结束标签终⽌
元素的内容是开始标签与结束标签之间的内容
某些 HTML 元素具有空内容（empty content）
空元素在开始标签中进⾏关闭（以开始标签的结束⽽结束）
⼤多数 HTML 元素可拥有属性
HTML 属性
HTML 元素可以设置属性
属性可以在元素中添加附加信息
属性⼀般描述于开始标签
属性总是以名称/值对的形式出现，⽐如：name="value"
class 为html元素定义⼀个或多个类名（classname）(类名从样式⽂件引⼊)
id 定义元素的唯⼀id
style 规定元素的⾏内样式（inline style）
title 描述了元素的额外信息 (作为⼯具条使⽤)
class 属性可以多⽤ class=" "（引号⾥⾯可以填⼊多个class属性）
id 属性只能单独设置 id=" "（只能填写⼀个，多个⽆效
<hr>标签在 HTML 页⾯中创建⽔平线。
hr 元素可⽤于分隔内容在页⾯中创建⼀条线。
HTML 注释
实例
<!--这是⼀个注释-->
HTML 折⾏换⾏
如果您希望在不产⽣⼀个新段落的情况下进⾏换⾏，请使⽤<br>标签（没有结束标签）
HTML 输出
对于 HTML，⽆法通过在 HTML 代码中添加额外的空格或换⾏来改变输出的效果。
当显⽰页⾯时，浏览器会移除源代码中多余的空格和空⾏。所有连续的空格或空⾏都会被算作⼀个空格。需要注意的是，HTML 代码中的所有连续的空⾏（换⾏）也被显⽰为⼀个空格。
HTML 格式化标签
HTML 使⽤标签<b>("bold")与<i>("italic")对输出的⽂本进⾏格式，如：粗体 or 斜体
HTML 超链接（链接）
HTML使⽤标签<a>来设置超⽂本链接。
超链接可以是⼀个字，⼀个词，或者⼀组词，也可以是⼀幅图像，可以点击这些内容来跳转到新的⽂档或者当前⽂档中的某个部分
注意：如果为这些超链接设置了 CSS 样式，展⽰样式会根据 CSS 的设定⽽显⽰。
HTML <head> 元素
<head>元素包含了所有的头部标签元素。
在<head>元素中你可以插⼊脚本（scripts），样式⽂件（CSS），及各种meta信息。
可以添加在头部区域的元素标签为:<title>,<style>,<meta>,<link>,<script>,<noscript>和<base>
HTML <base> 元素javascript和mysql菜鸟教程
<base>标签描述了基本的链接地址/链接⽬标，该标签作为HTML⽂档中所有的链接标签的默认链接:
<head>
<base href="www.runoob/images/" target="_blank">
</head>
HTML 元素
<link>标签定义了⽂档与外部资源之间的关系。
<link>标签通常⽤于链接到样式表:
<head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>
HTML <style> 元素
<style>标签定义了HTML⽂档的样式⽂件引⽤地址.
在<style>元素中你也可以直接添加样式来渲染 HTML ⽂档:
<head>
<style type="text/css">
body {background-color:yellow}
p {color:blue}
</style>
</head>
HTML <meta> 元素
自动化培训班meta标签描述了⼀些基本的元数据。
<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">
js获取字符串的位置HTML <script> 元素
<script>标签⽤于加载脚本⽂件，如： JavaScript。
head 标签和 header 标签的不同
head 标签⽤于定义⽂档头部，它是所有头部元素的容器。
<head>中的元素可以引⽤脚本、指⽰浏览器在哪⾥到样式表、提供元信息等等。
header 标签⽤于定义⽂档的页眉（介绍信息）
HTML 样式- CSS
CSS 可以通过以下⽅式添加到HTML中:
内联样式- 在HTML元素中使⽤"style" 属性
内部样式表 -在HTML⽂档头部 <head> 区域使⽤<style> 元素来包含CSS
外部引⽤ - 使⽤外部 CSS ⽂件
HTML样式实例 - 背景颜⾊
<body >
<h2 >这是⼀个标题</h2>
<p >这是⼀个段落。</p>
</body>
HTML 样式实例 - 字体, 字体颜⾊ ，字体⼤⼩
【font-family（字体），color（颜⾊），和font-size（字体⼤⼩）属性来定义⽂本样式，⽽不是使⽤标签】
<h1 >⼀个标题</h1>
<p >⼀个段落。</p>
HTML 样式实例 - ⽂本对齐⽅式
使⽤ text-align（⽂字对齐）属性指定⽂本的⽔平与垂直对齐⽅式：
<h1 >居中对齐的标题</h1>
<p>这是⼀个段落。</p>
内部样式表
当单个⽂件需要特别样式时，就可以使⽤内部样式表。你可以在<head> 部分通过 <style>标签定义内部样式表:
<head>
<style type="text/css">
body {background-color:yellow;}
p {color:blue;}
</style>
</head>
外部样式表
当样式需要被应⽤到很多页⾯的时候，外部样式表将是理想的选择。使⽤外部样式表，你就可以通过更改⼀个⽂件来改变整个站点的外观。
<head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>
HTML 图像- 图像标签（ <img>）和源属性（Src）
在 HTML 中，图像由<img>标签定义。
<img>是空标签，意思是说，它只包含属性，并且没有闭合标签。
要在页⾯上显⽰图像，你需要使⽤源属性（src）。src 指"source"。源属性的值是图像的 URL 地址。
定义图像的语法是：
<img src="url" alt="some_text">
HTML 图像- Alt属性
alt 属性⽤来为图像定义⼀串预备的可替换的⽂本。
替换⽂本属性的值是⽤户定义的。
<img src="boat.gif" alt="Big Boat">
在浏览器⽆法载⼊图像时，替换⽂本属性告诉读者她们失去的信息。此时，浏览器将显⽰这个替代性的⽂本⽽不是图像。为页⾯上的图像都加上替换⽂本属性是个好习惯，这样有助于更好的显⽰信息，并且对于那些使⽤纯⽂本浏览器的⼈来说是⾮常有⽤的。
HTML 图像- 设置图像的⾼度与宽度
height（⾼度）与 width（宽度）属性⽤于设置图像的⾼度与宽度。
属性值默认单位为像素:
<img src="pulpit.jpg" alt="Pulpit rock" width="304" height="228">
提⽰：指定图像的⾼度和宽度是⼀个很好的习惯。如果图像指定了⾼度宽度，页⾯加载时就会保留指定的尺⼨。如果没有指定图⽚的⼤⼩，加载页⾯时有可能会破坏HTML页⾯的整体布局。
HTML 表格
表格由<table>标签来定义。每个表格均有若⼲⾏（由<tr>标签定义），每⾏被分割为若⼲单元格（由<td>标签定义）。字母 td 指表格数据（table data），即数据单元格的内容。数据单元格可以包含⽂本、图⽚、列表、段落、表单、⽔平线、表格等等。
具体参见表格的学习
⽆序列表
数据库modify怎么用
⼀个项⽬的列表，此列项⽬使⽤粗体圆点（典型的⼩⿊圆圈）进⾏标记。
⽆序列表使⽤<ul>标签
<ul>
<li>Coffee</li>
<li>Milk</li>
</ul>
Coffee
Milk
有序列表
有序列表也是⼀列项⽬，列表项⽬使⽤数字进⾏标记。有序列表始于<ol>标签。每个列表项始于<li>标签。
列表项使⽤数字来标记。
<ol>
<li>Coffee</li>
<li>Milk</li>
</ol>
1. Coffee
2. Milk
HTML ⾃定义列表
⾃定义列表不仅仅是⼀列项⽬，⽽是项⽬及其注释的组合。
⾃定义列表以<dl>标签开始。每个⾃定义列表项以<dt>开始。每个⾃定义列表项的定义以<dd>开始。
<dl>
<dt>Coffee</dt>
<dd>- black hot drink</dd>
<dt>Milk</dt>
<dd>- white cold drink</dd>
</dl>
Coffee
- black hot drink
Milk
- white cold drink
HTML 可以通过<div>和<span>将元素组合起来。
HTML 区块元素
⼤多数 HTML 元素被定义为块级元素或内联元素。
块级元素在浏览器显⽰时，通常会以新⾏来开始（和结束）。
实例:<h1>,<p>,<ul>,<table>
HTML 内联元素
内联元素在显⽰时通常不会以新⾏开始。
实例:<b>,<td>,<a>,<img>
HTML <div> 元素
HTML <div> 元素是块级元素，它可⽤于组合其他 HTML 元素的容器。
<div> 元素没有特定的含义。除此之外，由于它属于块级元素，浏览器会在其前后显⽰折⾏。
如果与 CSS ⼀同使⽤，<div> 元素可⽤于对⼤的内容块设置样式属性。
<div> 元素的另⼀个常见的⽤途是⽂档布局。它取代了使⽤表格定义布局的⽼式⽅法。使⽤ <table> 元素进⾏⽂档布局不是表格的正确⽤法。<table> 元素的作⽤是显⽰表格化的数据。
HTML <span>元素
HTML <span> 元素是内联元素，可⽤作⽂本的容器
java中的静态变量存储在什么地方
<span> 元素也没有特定的含义。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。