一、尺寸操作
height 设置元素高度
line-height 设置行高
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
|
.p1{
width: 400px;
line-height: normal;
}
.p2{
width: 400px;
line-height: 200%;
}
.p3{
width: 400px;
line-height: 50%;
}
|
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
|
<!DOCTYPE html>
<
html
lang
=
"en"
>
<
head
>
<
meta
charset
=
"UTF-8"
>
<
title
>对齐</
title
>
<
link
href
=
"style.css"
type
=
"text/css"
rel
=
"stylesheet"
>
</
head
>
<
body
>
<
p
class
=
"p1"
>This is my web page
This is my web page
This is my web page
This is my web page
This is my web page
This is my web page
</
p
>
<
p
class
=
"p2"
>This is my web page
This is my web page
This is my web page
This is my web page
This is my web page
This is my web page
</
p
>
<
p
class
=
"p3"
>This is my web page
This is my web page
This is my web page
This is my web page
This is my web page
This is my web page
</
p
>
</
body
>
</
html
>
|
max-height 设置元素最大高度
max-width 设置元素最大宽度
|
1
2
3
4
|
.p1{
line-height: normal;
max-width: 250px;
}
|
min-width 设置元素最小宽度
min-height 设置元素最小高度
width 设置元素宽度
二、分类操作
clear 设置一个元素的侧面是否允许其他的浮动元素
cursor 规定当指向某元素之上时显示的指针类型
|
1
2
3
|
p{
cursor: auto;
}
|
|
1
2
3
|
p{
cursor: alias;
}
|
|
1
2
3
|
p{
cursor: cell;
}
|
display 设置是否及何时显示元素
|
1
2
3
4
5
6
7
8
9
|
li{
display: inline;
}
<
ul
>
<
li
>Hello</
li
>
<
li
>Hello</
li
>
<
li
>Hello</
li
>
<
li
>Hello</
li
>
</
ul
>
|
float 定义元素在哪个方向浮动
position 把元素放置到一个静态的、相对的、绝对的、固定的位置
visibility 设置元素是否可见或不可见
|
1
2
3
4
|
li{
display: inline;
visibility: hidden;
}
|
|
1
2
3
4
|
li{
display: inline;
visibility: visible;
}
|
本文转自yeleven 51CTO博客，原文链接:http://blog.51cto.com/11317783/1773184
