静态语言html,静态页面HTML

原标题:静态页面HTML

关于技术知识或经验的整理,有时候受限于个人的见识或能力,往往有不尽如人意的地方。好在这里的重点并非一味地体现技术,而是希望回顾过去进而达到创新的目的。

不足之处,欢迎有识之士斧正。同时欢迎投稿。

正文

一、HTML简介

e232abcf526999d2b66597575891871e.png

HTML是一种用于创建网页的标准标记语言。可以使用HTML来建立Web站点,HTML运行在浏览器上,由浏览器来解析。

HTML定义了网页内容的含义和结构,其它技术则通常用来描述网页的样式和布局(如CSS),或功能与行为(如Java)。

HTML文档由HTML元素构成,元素由开始标签、结束标签、属性及元素的内容4部分组成,其中属性包含了关于元素的一些额外信息。

HTML文档的后缀名是.html或.htm,这两种后缀名没有区别,表示一种静态的页面格式,不需要服务器解析其中的脚本。

HTML5是公认的下一代HTML,极大地提升了Web在富媒体、富内容和富应用等方面的能力,将成为HTML、XHTML以及HTML DOM的新标准。

二、HTML标签

HTML标签用来标记内容块,也用来标明元素内容的意义,标签使用尖括号包围。

HTML标签有两种形式:成对出现的标签和单独出现的标签,但标签中不能包含空格。HTML标签还可以被嵌套在另外一个标签所能影响的片段中。

f76ee306fe2c7f21414d56821b60defe.png

HTML不支持的标签,请用CSS代替。为了达到某种视觉效果(使用短语元素),使用CSS会达到更加丰富的效果。

一些不常用的标签,可以用别的常用标签来实现这种功能,成为废弃标签。除了废弃标签以外,许多属性将不再生效。

常用标签

标签

说明

html

创建一个HTML文档

head

设置文档标题和其它在网页中不显示的信息

title

设置文档的标题

body

主体内容标签,一般网页内容均放入此标签组之间

frameset; iframe

框架标签

a

超链接标签

span; div

区块标签

table; tr; th; td; caption; thead; tfoot; tbody; colgroup 等

表格标签

p; h1~h6

段落标签

br

换行标签

pre

预格式化标签

code

表示文本是代码,如计算机源代码或者其他机器可以阅读的文本内容

ul; ol; li

ul是无序列表标签,ol是有序列表标签

dl; dt; dd

列表标签

form; label; input; fieldset; textarea; select等

表单类标签

img

图片标签

bgsound

网络播放器

audio

嵌入声音

video

视频播放器

font; b; i; strong; em; strike; sup; sub 等

文字、字符格式化类标签

不常用标签

标签

说明

base

基础标签,规定页面上所有链接的默认 URL 和默认目标

basefont

定义基准字体,为文档中的所有文本定义默认字体颜色、字体大小和字体系列

details

折叠标签

marquee

创建滚动字幕,多用来实现公告,虽然已经过时了,但效果确实很强大

mark

突出显示文本

meter

电池条、度量标签

progress

进度条

cite

允许定义元素内的文字作为一种参考

address

允许语义化标签

center

表示绝对居中

ins

用下划线高亮显示添加进来的内容

del

用删除线显示被移除的内容

acronym

定义或更多解释一组文字

abbr

定义缩写单词

wbr

Word Break ,用来指定软换行(或单词换行)

nobr

禁止换行标签

ruby

包围要注音的文字

var

对文档中的文本进行格式化,表示变量的名称或者由用户提供的值

figure

注释,标记

map

创建热点区域(HotArea)

object

定义一个嵌入的对象,比如图像、音频、视频以及 Flash 等,存在一些漏洞

embed

嵌入音视频

blockquote

将其包起来的文字往右缩排,可以加多组卷标实现多次缩排

相关注释

1.

标签

frameset 使用比较严格,不能和 body 标签共用,不能在 frameset 外有任何其他非 head 和非 html 标签,否则就解析成空白。

2. 标签

a 标签的 title 提示中的文字通常是单行显示的,可以用 (回车) 或 (换行) 实现换行。

3. 行(内)元素、块(级)元素

块级元素内能包含所有行内元素,行内元素不能包含块元素。

行内元素:

包括 span, a, img, em, strong, select, input, textarea, label 等。

和其他元素同行显示。

高、行高、顶和底边距不可改变。

内容撑开宽高,宽度就是它的文字或图片的宽度,不可改变。

行内元素无法设置一些 CSS 属性,例如: width, height, margin-top, margin-bottom, padding-top padding-bottom, text-index 等。

可以使用 display 来改变,如 display:block 设置为块元素。

块级元素:

包括 div, p, pre, h1~h6, ul, ol, li, dl, dt, dd, table, form, address 等。

默认都占一行,总是在新行上开始。

高度、行高、顶和底边距都可控制。

高度自适应(自适应内容),宽度缺省是它的容器的100%,除非设定一个宽度。

支持所有 CSS 样式。

可以使用 display 来改变,如 display:block 设置为块元素。

附:常用词汇

词汇

释义

HTML

HyperText Markup Language ,超文本标记语言

SEO

Search Engine Optimization ,搜索引擎优化

SEM

Search Engine Marketing ,搜索引擎营销

body

正文,主体

content

[ˈkɑntent] ,内容

element

[ˈɛləmənt] ,元件,元素,码元

attribute

[əˈtrɪbjut] ,属性,特性,标志,表征

icon

[ˈaɪkɑn] ,图标,象征

附:拓展资源

MDN Web 文档

提供有关开放网络技术(Open Web)的信息,包括 HTML、CSS 和万维网及 HTML5 应用的 API。

版权所有,侵权必究。

责任编辑:

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值