HTML学习笔记--元素

开始标签称为起始标签，结束标签称为闭合标签

　　　　　　openging tag　　　　closing tag

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

如果忘记了闭合标签，有可能正常显示，也可能产生不可预料的结果或错误。

<br>是没有闭合标签的空元素,现在最好用<br/>

HTML标签对大小写不敏感。许多多站都用大写的HTML标签。

HTML4推荐小写，(X)HTML 版本中强制使用小写。

HTML属性

HTML 元素可以设置属性
属性可以在元素中添加附加信息
属性一般描述于开始标签
属性总是以名称/值对的形式出现，比如：name="value"。

如:<a href="http://www.runoob.com">这是一个链接</a>

属性值可用双引号也可用单引号。属性和属性值对大小写不敏感

HTML标题

通过<h1>到<h6>标签进行定义的

h1最大，h6最小

将 h1 用作主标题（最重要的），其后是 h2（次重要的），再其次是 h3，以此类推。

水平线

<hr>

注释

HTML 输出- 使用提醒

我们无法确定 HTML 被显示的确切效果。屏幕的大小，以及对窗口的调整都可能导致不同的结果。

对于 HTML，您无法通过在 HTML 代码中添加额外的空格或换行来改变输出的效果。

当显示页面时，浏览器会移除源代码中多余的空格和空行。所有连续的空格或空行都会被算作一个空格。需要注意的是，HTML 代码中的所有连续的空行（换行）也被显示为一个空格。

target属性

target属性值设置链接的文档是在新窗口打开还是当前窗口打开。

<a href="http://www.runoob.com/" target="_blank">访问菜鸟教程!</a>

_blank为新窗口打开超链接

HTML链接 ID属性

用于创建在一个HTML文档书签标记。在文档中是不显示的。

如:<a id="tips">有用的提示部分</a>

10.

base元素

描述了基本的链接地址或者链接目标，该标签作为HTML文档中所有的链接标签的默认链接:

<base href="http://www.runoob.com/images/" target="_blank">

11.
link元素

<link rel="stylesheet" type="text/css" href="mystyle.css">

12.

在<style> 元素中你也可以直接添加样式来渲染 HTML 文档:

<style type="text/css">
body {background-color:yellow}
p {color:blue}
</style>

13.

meta标签描述了一些基本的元数据。

META 元素通常用于指定网页的描述，关键词，文件的最后修改时间，作者，和其他元数据。

元数据可以使用于浏览器（如何显示内容或重新加载页面），搜索引擎（关键词），或其他Web服务。

<meta name="keywords" content="HTML, CSS, XML, XHTML, JavaScript">

14.

15.

CSS用于渲染HTML元素

CSS 可以通过以下方式添加到HTML中:

内联样式- 在HTML元素中使用"style" 属性
内部样式表 -在HTML文档头部 <head> 区域使用<style> 元素来包含CSS
外部引用 - 使用外部 CSS 文件

<1>内联样式的使用示例:

<p style="color:blue;margin-left:20px;">This is a paragraph.</p>

<2>当单个文件需要特别样式时，就可以使用内部样式表。你可以在<head> 部分通过 <style>标签定义内部样式表:

<head> <style type="text/css"> body {background-color:yellow;} p {color:blue;} </style> </head>

<3>当样式需要被应用到很多页面的时候，外部样式表将是理想的选择。使用外部样式表，你就可以通过更改一个文件来改变整个站点的外观。

16.图像

<img> 是空标签，意思是说，它只包含属性，并且没有闭合标签。

要在页面上显示图像，你需要使用源属性（src）。src 指 "source"。源属性的值是图像的 URL 地址。

alt 属性用来为图像定义一串预备的可替换的文本。替换文本属性的值是用户定义的。

在浏览器无法载入图像时，替换文本属性告诉读者她们失去的信息。此时，浏览器将显示这个替代性的文本而不是图像。为页面上的图像都加上替换文本属性是个好习惯，这样有助于更好的显示信息，并且对于那些使用纯文本浏览器的人来说是非常有用的。

height（高度）与 width（宽度）属性用于设置图像的高度与宽度。

17.

表格

表格由 <table> 标签来定义。每个表格均有若干行（由 <tr> 标签定义），每行被分割为若干单元格（由 <td> 标签定义）。字母 td 指表格数据（table data），即数据单元格的内容。数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等等。

18.

无序列表

<ul>
<li>Coffee</li>
<li>Milk</li>
</ul>

19.

有序列表

<ol>
<li>Coffee</li>
<li>Milk</li>
</ol>

20.

自定义列表

<dl>
<dt>Coffee</dt>
<dd>- black hot drink</dd>
<dt>Milk</dt>
<dd>- white cold drink</dd>
</dl>

21.

HTML可以通过<div>和<span>将元素组合起来

22.

区块元素

大多HTML元素被定义为块级元素和内联级元素。

块级元素在浏览器显示时，通常会以新行来开始（和结束）。

实例: <h1>, <p>, <ul>, <table>

内联级元素

内联元素在显示时通常不会以新行开始。

实例: <b>, <td>, <a>, <img>

HTML <div> 元素是块级元素，它可用于组合其他 HTML 元素的容器。

<div> 元素没有特定的含义。除此之外，由于它属于块级元素，浏览器会在其前后显示折行。

如果与 CSS 一同使用，<div> 元素可用于对大的内容块设置样式属性。

<div> 元素的另一个常见的用途是文档布局。它取代了使用表格定义布局的老式方法。使用 <table> 元素进行文档布局不是表格的正确用法。<table> 元素的作用是显示表格化的数据。

HTML <span> 元素是内联元素，可用作文本的容器

<span> 元素也没有特定的含义。

当与 CSS 一同使用时，<span> 元素可用于为部分文本设置样式属性。

23.

大多数网站会把内容安排到多个列中（就像杂志或报纸那样）。

大多数网站可以使用 <div> 或者 <table> 元素来创建多列。CSS 用于对元素进行定位，或者为页面创建背景以及色彩丰富的外观。

虽然我们可以使用HTML table标签来设计出漂亮的布局，但是table标签是不建议作为布局工具使用的 - 表格不是布局工具。

24.

表单是一个包含表单元素的区域。

表单元素是允许用户在表单中输入内容,比如：文本域(textarea)、下拉列表、单选框(radio-buttons)、复选框(checkboxes)等等。

表单使用表单标签 <form> 来设置

多数情况下被用到的表单标签是输入标签（<input>）。

输入类型是由类型属性（type）定义的。

25.

文本域通过<input type="text"> 标签来设定，当用户要在表单中键入字母、数字等内容时，就会用到文本域。

密码字段通过标签<input type="password"> 来定义

<input type="radio"> 标签定义了表单单选框选项

<input type="checkbox"> 定义了复选框. 用户需要从若干给定的选择中选取一个或若干选项。

<input type="submit"> 定义了提交按钮.

当用户单击确认按钮时，表单的内容会被传送到另一个文件。表单的动作属性定义了目的文件的文件名。由动作属性定义的这个文件通常会对接收到的输入数据进行相关的处理。

26.

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

27.

HTML 颜色由一个十六进制符号来定义，这个符号由红色、绿色和蓝色的值组成（RGB）。

每种颜色的最小值是0（十六进制：#00）。最大值是255（十六进制：#FF）。

28.

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

29.

30.

HTML 中的预留字符必须被替换为字符实体。

一些在键盘上找不到的字符也可以使用字符实体来替换。

在 HTML 中，某些字符是预留的。

在 HTML 中不能使用小于号（<）和大于号（>），这是因为浏览器会误认为它们是标签。

如果希望正确地显示预留字符，我们必须在 HTML 源代码中使用字符实体（character entities）。

HTML 中的常用字符实体是不间断空格( )。

浏览器总是会截短 HTML 页面中的空格。如果您在文本中写 10 个空格，在显示该页面之前，浏览器会删除它们中的 9 个。如需在页面中增加空格的数量，您需要使用   字符实体。

发音符号是加到字母上的一个"glyph(字形)"。

一些变音符号, 如尖音符 ( ̀) 和抑音符 ( ́) 。

变音符号可以出现字母的上面和下面，或者字母里面，或者两个字母间。

变音符号可以与字母、数字字符的组合来使用。

31.

统一资源定位器

Web浏览器通过URL从Web服务器请求页面。

当您点击 HTML 页面中的某个链接时，对应的 <a> 标签指向万维网上的一个地址。

一个统一资源定位器(URL) 用于定位万维网上的文档。

scheme://host.domain:port/path/filename

scheme - 定义因特网服务的类型。最常见的类型是 http
host - 定义域主机（http 的默认主机是 www）
domain - 定义因特网域名，比如 runoob.com
:port - 定义主机上的端口号（http 的默认端口号是 80）
path - 定义服务器上的路径（如果省略，则文档必须位于网站的根目录中）。
filename - 定义文档/资源的名称

posted @ 2019-01-12 23:37 云中翱翔的鹏鸟阅读(286) 评论(0) 编辑收藏举报

会员力量，点亮园子希望

刷新页面返回顶部

风来雨去雨去风来来来去去

让专注更加沉浸！

HTML学习笔记--元素

HTML 输出- 使用提醒

公告