html笔记

浏览数：17 / 时间：2015年06月09日

一：html语法之--使用图像映射
1 什么是图像映射
所谓图像映射是指在一幅图中定义若干个区域，每个区域中指定一个不同的超链接，当单击不同的区域时便可以跳转到相应的目标页面。
2 创建图像映射
2.1 定义映射区域
定义映射区域使用MAP标记符，在<MAP>和</MAP>之间添加映射区域。添加映射区域使用AREA标记符。该标记符具有三个基本属性：
href 标识出目标的URL
shape 说明映射区域的形状。取值可是：
rect 矩形
circle 圆形
poly 多边形
default 整个图像区域 coords 用于标识映射区域的边界。
2.2 对映射区域进行引用
标记了映射区域之后，就可以通过在IMG标记符中使用usermap属性来引用相应的映射信息。
一个完整的图像映射语法如下：
<map name="mymap">
<area href=URL1 shape=rect coords="x1,y1,x2,y2">
<area href=URL2 shape=circle coords="x,y,r">
<area href=URL3 shape=poly coords="x1,y1,x2,y2,...,xn,yn">
</map>
<img src=image_URL usemap=#mymap>
注意：map标记符中，name属性的取值必须与img标记符中，usemap属性的取值相同，只是usemap属性的值前面多了一个# 。

二、fieldset 元素可将表单内的相关元素分组。
<fieldset> 标签将表单内容的一部分打包，生成一组相关表单的字段。
<legend> 标签为 fieldset 元素定义标题。
eg: <body>
<fieldset style="width:300px;color:red">
<legend><font color="blue">★ 审核状态</font></legend>
<form>
<input type="radio" name="state">已经审核
<input type="radio" name="state">没有审核
<input type="radio" name="state">全部
</form>
</fieldset>
</body>

三、CSS中的常用四种选择器
1.类选择器（class）
2.id选择器
3.html元素选择器
4.通配符选择器
我们希望所有的超链接
(1)默认样式是黑色，24px,没有下划线
(2)当鼠标移动到超链接时，自动出现下划线
(3)点击后,超链接变成红色。这又该怎么实现呢?
a:link{
color:black;
text-decoration:none;
font-size:24px;
}
a:hover{
text-decoration:underline;
font-size:40px;
color:green;
}
a:visited{
color:red;
}

/*对同一中html 元素分类*/
p.cls1{
color:blue;
font-size:30px;
}
p.cls2{
color:red;
font-size:20px;
}
四、四个选取器优先权
Id 选择器> class 选择器> html 选择器> 通配符选则器

五、常见的行内元素和块元素
常见的行内元素有<a> <span> <inpu type=”xxx”>
常见块元素有<div> <p>
行内元素和块元素可以转换
使用
Display: inline 表示使用行内元素方式显示
Display: block 表示使用块元素方式显示

六、浮动
浮动在div+css 中浮动分为左浮动，右浮动，清除浮动
右浮动
所谓右浮动，指一个块元素向右移动，让出自己空间，向右移动直到碰到包含自己的父元素的最右边的边框.
左浮动
所谓左浮动就是指: 某个块元素尽量向左边移动，这样就让出它右面的空间，让别的块元素显示.
如果浮动元素的高度不同，那么当它们向下移动时可能被其它浮动元素“卡住”：直到有足够空间.

七、定位
常见的定位有四种
1. static 定位(默认值) 【left 和top 无效】//left top 属性对static 没有效果， static 定位是靠margin-left margin-top 来移动位置的.
2. relative 相对定位 (空余部分不会被占用)
3. absolute 绝对定位（空余部分会被补齐）
4. fixed 固定定位.
所谓相对定位是指，相对该元素应当显示的左上角重新定位，虽然它脱离的标准流，但是它的空间，不能被占用.
所谓绝对定位是指，对该元素最近的那个脱离了标准流的元素定位,如果没有父元素(或者有父元素，但是父元素没有脱离标准流)，则相对body 左上角定位.
所谓fixed 定位就是不管怎样，总是以视窗的左上角定位.
z-index用于设置对象(div) 显示时候，层叠的属性, z-index 值越小，则越在下层显示!!

郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。

html笔记