您现在的位置:首页 >> 前端 >> 内容

HTML 笔记

时间:2016/3/28 9:21:08 点击:

  核心提示:HTML 元素例子解释 与之间的文本描述网页 与之间的文本是可见的页面内容 与之间的文本被显示为标题 与之间的文本被显示为段落 提示:请仅仅把标题标签用于标题文本。不要仅仅为了产生粗体文本而使用它们。...

HTML 元素
例子解释

与 之间的文本描述网页 与 之间的文本是可见的页面内容

之间的文本被显示为标题

之间的文本被显示为段落

提示:请仅仅把标题标签用于标题文本。不要仅仅为了产生粗体文本而使用它们。请使用其它标签或 CSS 代替。

空的 HTML 元素

没有内容的 HTML 元素被称为空元素。空元素是在开始标签中关闭的。


就是没有关闭标签的空元素(
标签定义换行)。

在 XHTML、XML 以及未来版本的 HTML 中,所有元素都必须被关闭。

在开始标签中添加斜杠,比如
,是关闭空元素的正确方法,HTML、XHTML 和 XML 都接受这种方式。

即使
在所有浏览器中都是有效的,但使用
其实是更长远的保障。

HTML 提示:使用小写标签以及属性。

HTML 标签对大小写不敏感:

等同于

。许多网站都使用大写的 HTML 标签。

W3School 使用的是小写标签,因为万维网联盟(W3C)在 HTML 4 中推荐使用小写,而在未来 (X)HTML 版本中强制使用小写。

始终为属性值加引号

属性值应该始终被包括在引号内。双引号是最常用的,不过使用单引号也没有问题。

在某些个别的情况下,比如属性值本身就含有双引号,那么您必须使用单引号,例如:

name='Bill "HelloWorld" Gates'

注释:浏览器会自动地在标题的前后添加空行。

注释:默认情况下,HTML 会自动地在块级元素前后添加一个额外的空行,比如段落、标题元素前后。

标题很重要

请确保将 HTML heading 标签只用于标题。不要仅仅是为了产生粗体或大号的文本而使用标题。

搜索引擎使用标题为您的网页的结构和内容编制索引。

因为用户可以通过标题来快速浏览您的网页,所以用标题来呈现文档结构是很重要的。

应该将 h1 用作主标题(最重要的),其后是 h2(次重要的),再其次是 h3,以此类推。

HTML 标签参考手册

W3School 的标签参考手册提供了有关这些标题及其属性的更多信息。

您将在本教程下面的章节中学到更多有关 HTML 标签和属性的知识。

标签 描述
asp"> 定义 HTML 文档。
定义文档的主体。

to

定义 HTML 标题

定义水平线。
定义注释。

提示:使用空的段落标记

去插入一个空行是个坏习惯。用
标签代替它!(但是不要用
标签去创建列表。不要着急,您将在稍后的篇幅学习到 HTML 列表。)


元素是一个空的 HTML 元素。由于关闭标签没有任何意义,因此它没有结束标签。


还是


还是

您也许发现

很相似。

在 XHTML、XML 以及未来的 HTML 版本中,不允许使用没有结束标签(闭合标签)的 HTML 元素。

即使
在所有浏览器中的显示都没有问题,使用
也是更长远的保障

HTML 输出 - 有用的提示

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

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

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

如何使用样式

当浏览器读到一个样式表,它就会按照这个样式表来对文档进行格式化。有以下三种方式来插入样式表:

外部样式表

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




内部样式表

当单个文件需要特别样式时,就可以使用内部样式表。你可以在 head 部分通过

内联样式

当特殊的样式需要应用到个别元素时,就可以使用内联样式。使用内联样式的方法是在相关的标签中使用样式属性。样式属性可以包含任何 CSS 属性。以下实例显示出如何改变段落的颜色和左外边距。

style="color: red; margin-left: 20px"> This is a paragraph

标签 描述

Main Title of Web Page

Menu

Content goes here

亲自试一试

HTML 布局 - 有用的提示

提示:使用 CSS 最大的好处是,如果把 CSS 代码存放到外部样式表中,那么站点会更易于维护。通过编辑单一的文件,就可以改变所有页面的布局。如需学习更多有关 CSS 的知识,请访问我们的CSS 教程

提示:由于创建高级的布局非常耗时,使用模板是一个快速的选项。通过搜索引擎可以找到很多免费的网站模板(您可以使用这些预先构建好的网站布局,并优化它们)。

Fieldset around data本例演示如何在数据周围绘制一个带标题的框。








健康信息
身高:
体重:





如果表单周围没有边框,说明您的浏览器太老了。







Main Title of Web Page

Menu

Content goes here

提示:事实上,您也许已经注意到了,W3school站点上。。。。。。。

带有复选框的表单例子:





I have a bike:
I have a car:
I have an airplane:

如果您点击 "Submit" 按钮,您将把输入传送到名为 html_form_action.asp 的新页面。

提示:如果你打算使用背景图片,你需要紧记一下几点:

背景图像是否增加了页面的加载时间。小贴士:图像文件不应超过 10k。背景图像是否与页面中的其他图象搭配良好。背景图像是否与页面中的文字颜色搭配良好。图像在页面中平铺后,看上去还可以吗?对文字的注意力被背景图像喧宾夺主了吗?

基本的注意事项 - 有用的提示:

标签中的背景颜色(bgcolor)、背景(background)和文本(text)属性在最新的 HTML 标准(HTML4 和 XHTML)中已被废弃。W3C 在他们的推荐标准中已删除这些属性。

应该使用层叠样式表(CSS)来定义 HTML 元素的布局和显示属性。

颜色由红色、绿色、蓝色混合而成。

http://www.w3school.com.cn/html/html_colors.asp

本页提供了被大多数浏览器支持的颜色名。

提示:仅有 16 种颜色名被 W3C 的 HTML 4.0 标准支持,它们是:aqua、black、blue、fuchsia、gray、green、lime、maroon、navy、olive、purple、red、silver、teal、white、yellow。

http://www.w3school.com.cn/html/html_colornames.asp


参考样式代码

来自 W3School 的 HTML 快速参考。可以打印它,以备日常使用。
HTML Basic Document



Document name goes here


Visible text goes here



Text Elements

This is a paragraph


(line break)
(horizontal rule)
This text is preformatted
Logical Styles This text is emphasized This text is strong This is some computer code Physical Styles This text is bold This text is italic Links, Anchors, and Image Elements This is a Link HTML 笔记 Send e-mailA named anchor: Useful Tips Section Jump to the Useful Tips Section Unordered list
  • First item
  • Next item
Ordered list
  1. First item
  2. Next item
Definition list
First term
Definition
Next term
Definition
Tables
someheader someheader
sometext sometext
Frames <frameset cols="25%,75%"> <frame src="page1.htm"> <frame src="page2.htm"> </frameset> Forms
Entities < is the same as < > is the same as > © is the same as © Other Elements
Text quoted from some source.
Address 1
Address 2
City
Source : http://www.w3school.com.cn/html/html_quick.asp






Tags:HT TM ML L笔 
作者:网络 来源:Roberts b
  • 易笔记(art.yibiji.com) © 2025 版权所有 All Rights Reserved.
  • 本站部分内容收集于互联网若有侵权请联系站长删除 鄂ICP备18030946号-1