CSS ?? ??
???? ?? ???? ??? ??, ??, ?? ?? ???? ? ? ???, ?? ???? ?? ?? ??? ???? ???.
1. ?? ??
?? ??? ??? ??? ? ????. ?? ??.
??: No >auto ??????. ????? ?? ??? ?????.
length px, cm ? ?? ??? ???? ??? ?????.
% ???? ?? ?? ??? ?? ???? ???? ???.
2. line-height ??
line-height ??? ??? ? ????. ? ??? ??? ?????.
??: ?? ?? ???? ????.
??: ???? ?
???????????????????????????????????????????????????>?? ???. ??? ? ??? ?????.
number ?? ?? ??? ?? ??? ???? ? ??? ?????.
length ??? ? ??? ?????.
% ?? ?? ??? ???? ? ? ?? ??????.
3. max-height ??
max-height ??? ??? ?? ??? ??? ? ????. ??: No >none ??????. ????? ??? ???? ?? ??? ??? ?? ????.
length? ??? ?? ?? ?? ?????.% ?? ??? ???? ?? ?? ??? ???? ???? ?????.
4. max-width ??
max-width? ??? ?? ??? ??? ? ????.
??: No >none ??????. ????? ??? ?? ??? ??? ?? ????.
length? ??? ?? ??? ?????.
%? ?? ???? ?? ?? ??? ???? ???? ?? ??? ?????.
5. min-height ??
min-height ??? ??? ?? ??? ??? ? ????. ??: No >length? ??? ?? ??? ?????. ???? 0???.%? ?? ???? ?? ?? ??? ??? ???? ?? ??? ?????.
6. min-width ??
min-width ??? ??? ?? ??? ??? ? ????.
??: No >length? ??? ?? ?? ?? ?????. ???: ????? ?? ????.
%? ?? ???? ?? ?? ??? ??? ???? ?? ??? ?????.
7. ?? ??
?? ??? ??? ??? ??? ? ????. ??: No . ????? ?? ??? ??? ? ????.?? px, cm ? ?? ??? ???? ??? ?????.
?:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>實(shí)例</title>
<style type="text/css">
img.normal
{
height:auto;
}
img.big
{
height:120px;
}
p.ex
{
height:100px;
width:100px;
}
</style>
</head>
<body>
<img class="normal" src="http://img.educity.cn/article_image/2013082620/321090200502.jpg" width="95" height="84" /><br>
<img class="big" src="http://img.educity.cn/article_image/2013082620/321090200502.jpg" width="120" height="90" />
<p class="ex">這是一段句子的高和寬是 100px.</p>
</body>
</html>
?:
????????????????????????????????????????????????????????? ??>
