您的位置：首页 > Web前端 > CSS

html、css重难点总结

2012-08-20 11:39 169 查看

1、<a href="html02" target="_blank">html02</a>
target:链接中的内容在哪儿打开
_blank:在新的窗口中打开
_self:在当前窗口打开（默认）
2.使用图像作为链接地址
<a href="html02.html"><img src="images/cp.gif" border="0"></a>
3.发邮件
<a href="mailto:chengzh@tarena.com.cn">mail to me</a>
4.锚点(一个页面内容的跳转)
命名一个锚点
<a name="top">top</a>
跳转到锚点
<a href="#top">to top</a>
5.使用热点
将一个图片划分成多个区域，每一个区域表示一个
链接。
<img src="index04.jpg" width="500"
height="500" border="0" usemap="#m1" />
<map name="m1" id="m1">
<area shape="rect" coords="…" href="#" />
<area shape="circle" coords="…" href="#" />
<area shape="poly" coords="…" href="#" />
</map>
当shape="rect"（矩形）时，coords的值为左上角和右下角的坐标值; 当shape="poly"（多边形）时，
为各顶点值; 当shape="circle"（圆形）时，为圆心坐标值和半径值。 coords值依照图片大小的不同
和所希望链接区域的不同而有所不同
</map>

6、框架
(1)什么是框架
将一个窗口划分成多个子窗口，每一个子窗口都
可以放置一个页面。
frameset:

iframe:
frameset页面中不能出现body，而iframe可以
用在body标记里。
7.xhtml与html的关系
xhtml:可扩展的超文本标记语言
html是一种语法宽松的语言,大小写不敏感，
一些错误会忽略,w3c对html语法做了进一步的要求，
即按照xml语法的要求重新定义了html标记。
按照以下方式来写html
第一行，写文档类型声明(可以省略)
XHTML 过渡型
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
XHTML 严格型
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
HTML严格型
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
HTML松散型
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

8.实体代替某些符号：引号("),&(&) >(>) <(<)，空格( )

9.图片提交按钮：

　　<button type="submit">
<img src="images/cp.gif" border="0">
</button>

10.选择器
A.标签选择器(选择器的名称是一个标签的名字)
标记的名称{
}
B. class选择器
.任意的名称{
}
或者
标记名称.任意的名称{
}
C.id选择器
#任意的名称{
}
D.包含选择器

E. 群组选择器

11.样式的继承
子标记会继承父标记的样式
12.样式的优先级
内联样式>内部样式>外部样式
浏览器内部也有一个默认的样式
13.重点的属性
文本相关的属性
font-size: 12px;/15px; //字体大小
font-weight:900 //磅 100-900 共9个数字
text-align:rigth center left
color:
背景相关的属性
background-color:#ff88ee;//背景
background-image:url(images/t1.jpg)//背景图片
background-repeat:no-repeat repeat-x repeat-y //平铺
background-attachment:fixed //固定
边框
border:1px solid red;//宽度样式颜色
border-left:
border-right:
border-top:
border-bottom:
位置
width:100px //宽度
height:100px //高度
margin: 10px 9px 8px 7px;//外边距
margin-left:7px;
margin-right:9px;
margin-top:10px
margin-bottom:8px;
margin:1px;//上，右，下，左都是1个像素
margin:20px auto;//上下各20px,左右居中
padding://内边距有可能会将父元素撑大
padding-left:
padding-top:
padding-right:
padding-bottom:
padding:10px 9px 8px 7px;

块元素与行内元素：
块元素：
另起一行: h1..hn, p,div,form,ul/ol,li,img
行内元素:
在一行内：span

display属性：//元素的显示方式
none:不显示
block:以块元素的方式来显示
inline:以行内元素的方式来显示
position属性://元素的摆放方式
static://默认摆放,从左到右，从上到下。
absolute://按照父元素的位置偏移
relative://先按照默认方式摆放，然后偏移

float属性:
left://取消独占一行的特性，向左浮动。
text-decoration:none underline;//下划线
链接的伪样式:
a:link { color: red} 没有访问时
a:visited { color: blue} 访问后
a:active { color: lime} 鼠标点击但还没有放开时
a:hover { color: aqua} 鼠标指向时

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航