HTML小知识点


HTML
Hyper Text Markup Language
(超文本标签)

--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------


< >是标签 标签内含有属性


<!-- --> 定义注释
提示: <!-- --> 是HTML的注释标签,使用 < 和 > 是符合HTML标签语法规则的。
/* */是CSS的注释标签。
/* */(注释代码块)、//(注释单行)是JS的注释标签。
两种注释有各自的使用环境,并且不能相互替代。


<!doctype> 定义文档类型
提示: <!doctype>声明没有结束标签。
<!doctype>声明对大小写不敏感。
<!doctype>声明必须是 HTML 文档的第一行,位于 <html> 标签之前。


<html> 定义 HTML 文档
属性: 值: 描述:
manifest url 定义一个 URL,在这个 URL 上描述了文档的缓存信息。
xmlns http://www.w3.org/1999/xhtml 定义 XML namespace 属性


<title> 定义文档的标题
属性: 值: 描述:
dir rtl ltr 规定元素中内容的文本方向。
lang language_code 规定元素中内容的语言代码。
xml:lang language_code 规定 XHTML 文档中元素内容的语言代码。


<body> 定义文档的主体
属性: 值: 描述:
alink rgb(x,x,x) #xxxxxx colorname 规定文档中活动链接(active link)的的颜色。
background URL 规定文档的背景图像。
bgcolor rgb(x,x,x) #xxxxxx colorname 规定文档的背景颜色。
link rgb(x,x,x) #xxxxxx colorname 规定文档中未访问链接的默认颜色。
text rgb(x,x,x) #xxxxxx colorname 规定文档中所有文本的颜色。
vlink rgb(x,x,x) #xxxxxx colorname 规定文档中已被访问链接的颜色。

<h1> to <h6> 定义 HTML 标题
属性: 值: 描述:
align left center right justify(两端对齐) 规定标题中文本的排列。


<p> 定义段落
属性: 值: 描述:
align left center right justify(两端对齐) 规定标题中文本的排列。


<br> 定义简单的折行(换行)
注释:
使用 <br> 来输入空行,而不是分割段落。
<br> 标签是空标签(意味着它没有结束标签,因此这是错误的:<br></br>)。
把结束标签放在开始标签中,也就是 <br />。


<hr> 定义水平线
属性: 值: 描述:
align center left right 规定 hr 元素的对齐方式。
noshade noshade 规定 hr 元素的颜色呈现为纯色。
size pixels(px) 规定 hr 元素的高度(厚度)。
width pixels(px)or % 规定 hr 元素的宽度。


--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------


<acronym> 定义首字母缩写
例:
代码: <acronym title="World Wide Web">WWW</acronym>
显示结果: WWW


<abbr> 定义缩写
例:
代码: The <abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
显示结果: The PRC was founded in 1949.


<address> 定义文档作者或拥有者的联系信息。

<b> 定义粗体文本

<big> 定义大号文本。

<i> 定义斜体文本

<em> 定义强调文本,实际效果与斜体文本差不多

<strong> 定义粗体文本,与<b>的作用基本相同

<small> 定义小号文本

<sub> 定义下标文本

<sup> 定义上标文本

<bdo> 定义文本显示方向,内有dir属性,只能提取 ltr (左到右)或 rtl (右到左)

<tt> 呈现类似打字机或者等宽的文本效果。

--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
<a href=“链接地址”target=“目标窗口”>链接文本或图片</a>

href 指定超链接所关联的另一个资源


target 指定框架集中的那个框架来装载另一个资源,该属性可以是

_self (使用自身)
_blank (新窗口)
_top (顶层框架)
_parent (父亲框架)

<img src=“图片地址” alt=“提示文字”>

<span>文本等行级内容</span> 修饰

-------------------------------------------------------------------------------------------------------

空格 &nbsp;

大于(>) &gt;

小于(<) &lt;

引号(“) &quot;

版权号(?) &copy;

-------------------------------------------------------------------------------------------------------

<frameset cols="25%,50%,*"rows="50%,*"border="5"> cols(竖向)rows(横向)不同时 存在
<fram src="top.html">
......
</frameset>

注意<frameset></frameset>标签不能与<body></body>标签同时使用。除非你在<frameset>中 使用<noframes>标签


cols pixels % * 定义框架集中列的数目和尺寸

rows pixels % * 定义框架集中行的数目和尺寸


<html>
<frameset rows="25%,50%,25%">
<frame src="/example/html/frame_a.html">
<frame src="/example/html/frame_b.html">
<frame src="/example/html/frame_c.html">
</frameset>
</html>


------------------------------------------------------------------------------------


frameborder 0、1 规定是否显示框架周围的边框

name frame_name 规定iframe的名称

scrolling yes、no、auto 规定是否在iframe中显示滚动条

src URL 规定在iframe中显示的文档的URL

------------------------------------------------------------------------------------


<table> 用于定义表格 以</table>结束

<tr> 定义表格行,该元素只能包含<td>或者<th>两种元素

<td> 定义单元格,包含俩个主要的属性:colspan-指定单元格跨多少列,rowspan-指 定单元格可横跨的行数

<caption> 用于定义表格标题

<th> 定义表格页眉的单元格

<tbody> 定义表格的主体

<thead> 定义表格头

<tfoot> 定义表格脚

cellspcing

cellpadding

------------------------------------------------------------------------------------


1.表格标签一般什么情况下使用?

主要用于规则的数据显示
适当的可以在表单页面中使用


2.使用表格标签进行页面布局的缺点

代码量比较大,页面浏览速度比较慢
层次结构比较复杂,不易于维护和改版
不利于搜索引擎搜索查找数据


3.强调:要对网页进行布局,推荐使用DIV+CSS,严禁使用表格进行布局页面


------------------------------------------------------------------------------------


form标签的语法

<form action="表单提交地址" method="提交方法">
...文本框、按钮等单元素..
</form>

表单的典型应用:

百度...

个人注册;企业注册...


form标签常用属性

action:指定表单提交后由服务器上的那个处理程序进行处理

enctype:用于指定表单数据的编码方式

application/x-www-form-urlencoded:默认的编码方式,将表单空件中的值处理成URL编码 方式

mutipart/form-data:以二进制的方式来处理表单数据。

text/plain:当表单的action属性值唯 mailto:RUL形式时使用。

method:指定向服务器提交的方式一般为get和post俩种方式


get方式的请求会将请求参数的名和值转换成字符串,并附加在原URL之后,因此可以在地 址栏中看到的请求参数的名和值。切get求求传送的数据量比较小,一般不能大于2KB.


post方式的请求传送的数据量比较大,通常认为可以不受限制,往往取决于服务器的限制 。
post方式的请求参数是放在HTML的HEADER中传输,用户在地址栏中看不到请求参数,安全 性相对较高

------------------------------------------------------------------------------------


常见的表单元素

使用input元素


单行文本框: 指定<input../>元素的type text
密码输入框: 指定<input../>元素的type password

隐藏域: 指定<input../>元素的type hidden

单选框: 指定<input../>元素的type radio

复选框: 指定<input../>元素的type checkbox

图像框: 指定<input../>元素的type image (type="image"的时,可以指定width和height属性)

文件上传域: 指定<input../>元素的type属性为file即可

提交、重置、普通按钮 指定<input../>元素的type属性为submit、reset、或button即 可

------------------------------------------------------------------------------------


checked 设置单选框、复选框初始状态是否处于选中状态,只有当type属性为checkbox或radio时才可指定

disaled 设置首次加载时禁用此元素。当type="hidden"时不能指定该属性

maxlength 该属性是一个数字,指定文本框中所允许输入的最大字符数。


readonly 指定该文本框内的值不允许修改(可以使用javascript脚本修改

size 该属性是一个数字,指定该元素的长度。当type="hidden"时不能指定该属性

src 指定图像域所显示的图像RUL,只有当type="image"时才可以指定该属性。


value(定义)=name


<button type="按钮类型">
普通文本、格式化文本、图像
</button>

button标签常用属性

disable 指定是否禁用此元素。该属性只能是disable或者省略

name 指定该按钮的唯一名称

type 指定该按钮属于那种按钮,只能是button、rest、submit

背景图片 <body background="1 (1).jpg" marginwidth="520" marginheight="520">


背景颜色 <span style="background:">

<label><label>

<select name="指定列表名称" size="行数">
<option value="选项值" selected=“selected”>...</option>
</select>


disabled 指定是否禁用此元素。该属性只能是disabled或者省略

mutiple 设置该列表是否允许多选

size 指定该列表内同时显示多少个列表项

在<select.../>元素里,只能包含如下俩种子元素

<option>:用于定义列表框选项或菜单项,它的常用属性如下:

disabled:指定禁用该选项,该属性值只能是disabled或者省略
selectd :指定该列表初始状态是否处于被选中状态,值只能是selected
value:指定该选项对应的参数值

<optgroup>:用于定义列表项或菜单单项组,他的常用用属性如下:

label:指定该选项组的标签。这个属性必填
disabled:禁用该选项组里的所有选项,该属性值真是disabled或省略

多行文本框语法

<textarea name=“。。。” cols=“列宽” rows=“行宽”>
文本内容
</textarea>

多行文本常用属性

cols:指定文本框的宽度,该属性必填
rows:指定文本框的高度,该属性必填
readonly:指定该文本框只读。该属性只能是readonly或省略

-----------------------------------------------------------------------------------

Web_上的多媒体指的是音效、音乐、视频和动画,现代网
络浏览器已经支持很多多媒体格式。

常用的视频格式

AVI
.avi
AVI (Audio Video Interleave)格式是由微软开发的。所有运行Windows的计算机都支持
AVI格式。它是因特网上很常见的格式,但非windows计算机并不总是能够播放。
WMV
.wmv
Windows Media格式是由微软开发的。Windows Media在因特网上很常见,但是如果未安装
额外的(免费)组件,就无法播放Windows Media电影。一些后期的Windows Media电影
在所有非Windows计算机上都无法播放,因为没有合适的播放器。
MPEG
.mpg
MPEG (Moving Pictures Expert Group)格式是因特网上最流行的格式。它是跨平台的,得到
.mpeg
了所有最流行的浏览器的支持。
QuickTime
.mov
QuickTime格式是由苹果公司开发的。QuickTime是因特网上常见的格式,但是QuickTime电
影不能在没有安装额外的(免费)组件的Windows计算机上播放。
Realvideo
.rm
Realvideo格式是由Real Media针对因特网开发的。该格式允许低带宽条件下(在线视频、网
ram
络电视)的视频流。由于是低带宽优先的,质里常会降低。
Flash
swf
Flash (Shockwave)格式是由Macromedia开发的。Shockwave格式需要额外的组件来播
.fv
放。但是该组件会预装到Firefox或IE之类的浏览器上。
Mpeg-4
mp4
Mpeg-4 (with H.264 video compression)是一种针对因特网的新格式。事实上,YouTube
推荐使用MP4。YouTube接收多种格式,然后全部转换为.fv或.mp4以供分发。越来越多的
视频发布者转到MP4,将其作为Flash播放器和HTMLS的因持网共享格式。

-----------------------------------------------------------------------------------


Web_上的多媒体指的是音效、音乐、视频和动画,现代网
络浏览器已经支持很多多媒体格式。

MIDI
.mid
MIDI (Musical Instrument Digital Interface)是一种针对电子 音乐设备(比如合成器和声
.midi
卡)的格式。MIDI文件不含有声音,但包含可被电子产品(比如声卡)播放的数字音乐指令。
点击这里指放The Beatles。
因为MIDI格式仅包含指令,所以MIDI文件极其小巧。上面的例子只有23k的大小,但却能播
放将近5分钟。MIDI得到了广泛的平台上的大里软件的支持。大多数流行的网络浏览器都支持
MIDI。
RealAudio
.rm
RealAudio格式是由Real Media针对因特网开发的。该格式也支持视频。该格式允许低带宽茶
.ram
件下的音频流(在线音乐、网络音乐)。由于是低带宽优先的,质里常会降低。
Wave
.wav
Wave (waveform)格式是由IBM和微软开发的。所有运行Windows的计算机和所有网络浏
览器(除了Google Chrome)都支持它。
WMA
.wma
WMA格式(Windows Media Audio),质里优于MP3,兼容大多数播放器,除了iPod。WMA
文件可作为连续的数据流来传输,这使它对于网络电台或在线音乐很实用。
MP3
.mp3
MP3文件实际上是MPEG文件的声音部分。MPEG格式最初是由运动图像专家组开发的。MP3
.mpga
是其中最受欢迎的针对音乐的声音格式。期待未来的软件系统都支持它。

-----------------------------------------------------------------------------------

<embed>播放音频

<embed src="troublelsaFriend.mp3" width="200" height="200" autostart="true"
loop(循环播放)="true"> (自动播放)
</embed>


<embed src="奔跑的猫.swf" width="200" width=200 loop="true" quality(播放质量)="high"
PLUGINSPAGE(自动下载安装播放器)=“http://www.macromedia.com/shouckwave/download/index.cgi?P1_Prod_Version=Shockwav
eFlash”></embed>


-----------------------------------------------------------------------------------

<object>标签
作用:可以使用<object>标签来给浏览器加载插件,通过加载的插件来播放音频和视频
(适合ie浏览器)

使用<object>标签播放音频
<object data="TroublelsaFriend.mp3">
<param name="src" value="TroublelsaFriend.mp3"><param name=" autoplay(自动播放)" value="true"></object>


使用<object>标签播放flash
<object classid="clsid:D27CDB6E-AE6D-11cf- 96B8-444553540000"width=“300" height="300"
codebase(自动下载播放器)="http://active.macromedia.com/flash4/cabs/swflash. cab#version=4,0,0,0">
<param name="movie" value="飞机起飞飞翔动画. swf"><param name="play" value="true"><param name="loop" value="true"><param name="quality" value="high">
</object>


-----------------------------------------------------------------------------------
为了能实现浏览器更好的兼容性,一般使用object标签内嵌套embed标签


<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
codebase=http://download.macromedia.com/ pub/ shockwave/ cabs/ flash/swflash.cab#version=6,0,40,0 width="550" height="400" id="myMovieName"><param name=movie value="奔跑的猫swf"><param name=quality value=high>
<param name=bgcolor value=#FFFFFF>
<embed src="奔 跑的猫swf" quality=high bgcolor= #FFFFF width="550"hight="400"name="myMovieName" type="application/ x-shockwave-flash"PLUGINSPAGE="http://www.macromedia.com/ go/ getflashplayer">
</embed>
</object>

猜你喜欢

转载自www.cnblogs.com/mgl321768422/p/11453894.html
今日推荐