10 ���ӻ���ʽģ�͵�ϸ��

    Ŀ¼

10.1 �������顱�Ķ���

    һ��Ԫ�صĿ�ijߴ��λ�õļ�����ʱ�����ij���ض��ij����Σ���Ϊ��Ԫ�ص���������һ��Ԫ�صİ�����Ķ������£�

  1. ��Ԫ�����ڵİ����飨���°����飩���û���ѡ��
  2. ��������Ԫ�أ����İ���������������Ŀ���ǰ���򴴽��������������Զ�λ�ġ�
  3. ���Ԫ��������'position: fixed'�����������ӵ�������
  4. ���Ԫ��������'position: absolute'���������������ǰ������������'position'����'static'�����������£�
    1. ���ǰ���ǿ���Ԫ�أ���������ǰ�����߰ױ��γɡ�
    2. ���ǰ��������Ԫ�أ�������ȡ����ǰ����'direction'���ԣ�
      1. ���'direction'Ϊ'ltr'��������Ķ�������Ǹ�ǰ�������ĵ�һ����Ķ��������ݱߣ����ĵס��ұ��Ǹ�ǰ�����������һ����ĵס������ݱߡ�
      2. ���'direction'Ϊ'rtl'��������Ķ����ұ��Ǹ�ǰ�������ĵ�һ����Ķ��������ݱߣ����ĵס�����Ǹ�ǰ�����������һ����ĵס������ݱߡ�

        ���������������ǰ������Ԫ�ؿ�����ݱߴ����ð����顣

���ӣ�

    �����Ƕ�λ�������ĵ��İ����飨C.B.����

<HTML>
   <HEAD>
      <TITLE>Illustration of containing blocks</TITLE>
   </HEAD>
   <BODY id="body">
      <DIV id="div1">
      <P id="p1">This is text in the first paragraph...</P>
      <P id="p2">This is text <EM id="em1"> in the 
      <STRONG id="strong1">second</STRONG> paragraph.</EM></P>
      </DIV>
   </BODY>
</HTML>

    �����������ģ�

�������Ԫ�� ����C.B.��Ԫ��
body��ʼC.B.�����û�����أ�
div1body
p1div1
p2div1
em1p2
strong1p2

    ������Ƕ�λ"div1"��

   #div1 { position: absolute; left: 50px; top: 50px }

    ���İ����鲻����"body"�����dz�ʼ�����飨��Ϊû��������λ��ǰ���򣩡�

    ��������ٶ�λ"em1"��

   #div1 { position: absolute; left: 50px; top: 50px }
   #em1  { position: absolute; left: 100px; top: 100px }

    ������ı����Ϊ��

�������Ԫ�� ����C.B.��Ԫ��
body��ʼC.B.
div1��ʼC.B.
p1div1
p2div1
em1div1
strong1em1

    "em1"��λ�����İ������Ϊ�����ǰ����λ�򣨼�����"div1"��������һ������

10.2 ���ݵĿ�����'width'����

'width'
ֵ��  <length> | <percentage> | auto | inherit
��ʼֵ��  auto
�����ڣ�  ����Ԫ�أ��������ڷ��滻Ԫ�أ������к����顣
�ɷ�̳У�  ��
�ٷֱȣ�  ���ڰ�����Ŀ���
ý�飺  ͼ��

    ������ָ���˿���Ԫ�غ��滻Ԫ�ز����Ŀ�����ݿ�����

    ��Ԫ�ز��������ڷ��滻������Ԫ�ء����滻����Ԫ�ؿ�Ŀ�����������������Ⱦ�����κ���Ԫ�����ƫ��֮ǰ���Ŀ��ȡ�����Ӧ�üǵ����ڿ��������߿��ڡ����߿�Ŀ��������ǵ����������������ǿ������ڳ��������������̡�

    �滻Ԫ�صĿ����������ģ��������������ֵ����'auto'���û��˿��ܽ������¶��ȡ�

    ����ֵ�ĺ������£�

<length>
ָ��һ���̶����ȡ�
<percentage>
ָ��һ���ٷֱȿ��ȡ��ٷֱȵļ���������ɿ���������Ŀ��ȡ�
auto
����ȡ�����������Ե�ֵ���μ��Ժ�Ľڡ�

    ����'width'ֵ�ǷǷ��ġ�

���ӣ�

    ���磬����Ĺ��򽫶�������ݿ��ȹ̶�Ϊ100�㣺

P { width: 100px }

10.3 ���Ⱥͱ߾�ļ���

    һ��Ԫ�ص�'width'��'margin-left'��'margin-right'��'left'��'right'���Եļ���ֵȡ���ڲ����Ŀ�����ͣ�������Ӱ�졣һ����ԣ�����ֵ��ָ��ֵ��ͬ��'auto'��ij�����ʵ�ֵȡ�����������������⡣������Щ�����Ҫ���Կ��ǣ�

  1. ���ڵķ��滻Ԫ��
  2. ���ڵ��滻Ԫ��
  3. ���������еĿ��ࡢ���滻Ԫ��
  4. ���������еĿ��ࡢ�滻Ԫ��
  5. �����ķ��滻Ԫ��
  6. �������滻Ԫ��
  7. ���Զ�λ�ķ��滻Ԫ��
  8. ���Զ�λ���滻Ԫ��

    1-6������Զ�λ��

10.3.1 ���ڵķ��滻Ԫ��

    'width'���Բ����á���'left'��'right'��'margin-left'��'margin-right'ָ��'auto'��Ч���Ǽ���ֵΪ'0'��

10.3.2 ���ڵ��滻Ԫ��

    ��'left'��'right'��'margin-left'��'margin-right'ָ��'auto'��Ч���Ǽ���ֵΪ'0'��ָ��'width'Ϊ'auto'��Ԫ�ص��������ȸ�������ֵ��

10.3.3 ���������еĿ��ࡢ���滻Ԫ��

    ���'left'��'right'����Ϊ'auto'�����ǵļ���ֵΪ0�����������Լ���뱣�������Լ����

    'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' = �������Ŀ���

    ������߿����ʽΪ'none'���߿������Ϊ��'0'��������������е�����ָ���˷�'auto'��ֵ����Щֵ����Ϊ�ǡ�����Լ����������֮һ�ļ���ֵ�����ò�������ָ��ֵ��ͬ�����'direction'����Ϊ'ltr'��'margin-right'��ָ��ֵ�����ԣ������¼�������������ĵ�ʽ�����'direction'Ϊ'rtl'����'margin-left'��ȡ�����ķ�����

    ���ֻ��һ��ֵָ��Ϊ'auto'�����ļ���ֵ�ӵ�ʽ�еó���

    ���'width'����Ϊ'auto'����������'auto'ֵ��Ϊ'0'��'width'�ӵ�ʽ��ʣ�ಿ�ֵõ���

    ���'margin-left'��'margin-right'Ϊ'auto'�����ǵļ���ֵ��ͬ��

10.3.4 ���������еĿ��ࡢ�滻Ԫ��

    ���'left'��'right'Ϊ'auto'�����ǵļ���ֵΪ0�����'width'ָ��Ϊ'auto'������ֵ��Ԫ�ص��������ȡ����ijһ���߾�����Ϊ'auto'�����ļ���ֵ��������Լ������������һ������������߾඼������'auto'�����ǵļ���ֵ��ȡ�

10.3.5 �����ķ��滻Ԫ��

    ���'left'��'right'��'width'��'margin-left'��'margin-right'ָ��Ϊ'auto'�����ǵļ���ֵΪ'0'��

10.3.6 �������滻Ԫ��

    ���'left'��'right'��'margin-left'��'margin-right'ָ��Ϊ'auto'�����ǵļ���ֵΪ'0'�����'width'Ϊ 'auto'������ֵ��Ԫ�ص��������ȡ�

10.3.7 ���Զ�λ�ķ��滻Ԫ��

    ȷ����ЩԪ�ؼ���ֵ��Լ��Ϊ��

    'left' + 'margin-left' + 'border-left-width' + 'padding-left' + 'width' + 'padding-right' + 'border-right-width' + 'margin-right' + 'right' = �������Ŀ���

    ������߿���ʽΪ'none'���߿������Ϊ��'0'����һԼ����ʵ��ͨ������˳���һϵ���滻���ﵽ��

  1. ���'left'����Ϊ'auto'��'direction'Ϊ'ltr'���滻'auto'Ϊ����������ߵ��ٶ�����'position'��������Ϊ'static'��������Ԫ�صĵ�һ������Ǹ���������߾�ߵľ��롣������Ϊ�˲�ȥʵ�ʼ����Ǹ����û��˿������ɵز����������ڵ�λ�á������������ڰ��������ߣ���ֵΪ������
  2. ���'right'����Ϊ'auto'��'direction'Ϊ'rtl'���滻'auto'Ϊ���������ұߵ������ᵽ���Ǹ��������ұ߾�ߵľ��롣���������ڰ�����ߵ���ߣ���ֵΪ������
  3. ���'width'Ϊ'auto'����ʣ��'left'��'right'��'auto'�滻Ϊ'0'��
  4. ���'left'��'right'��'width'����'auto'��������'margin-left'��'margin-right'��'auto'�滻Ϊ'0'��
  5. �������һ��'margin-left'��'margin-right'����'auto'�����ڶ����Լ���������߾������ͬ�������ʽ��
  6. �������һ��ֻ��һ��'auto'���ڣ����ݵ�ʽ����Ǹ�ֵ��
  7. �������һ����ֵ�����Լ����Ҫô����'left'��ֵ�����'direction'Ϊ'rtl'����Ҫô����'right'��ֵ�����'direction'Ϊ'ltr'����Ȼ�����Ǹ�ֵ��

10.3.8 ���Զ�λ���滻Ԫ��

    ��һ�����ǰһ�������ƣ�����Ԫ����һ���������ȡ��滻��˳���ǣ�

  1. ���'width'Ϊ'auto'���滻ΪԪ�ص��������ȡ�
  2. ���'left'����Ϊ'auto'��'direction'Ϊ'ltr'���滻'auto'Ϊ����������ߵ��ٶ�����'position'��������Ϊ'static'��������Ԫ�صĵ�һ������Ǹ���������߾�ߵľ��롣������Ϊ�˲�ȥʵ�ʼ����Ǹ����û��˿������ɵز����������ڵ�λ�á������������ڰ��������ߣ���ֵΪ������
  3. ���'right'����Ϊ'auto'��'direction'Ϊ'rtl'���滻'auto'Ϊ���������ұߵ������ᵽ���Ǹ��������ұ߾�ߵľ��롣���������ڰ�����ߵ���ߣ���ֵΪ������
  4. ���'left'��'right'��'auto'��������'margin-left'��'margin-right'��'auto'�滻Ϊ'0'��
  5. �������һ��'margin-left'��'margin-right'����'auto'�����ڶ����Լ���������߾������ͬ�������ʽ��
  6. �������һ��ֻ��һ��'auto'���ڣ����ݵ�ʽ����Ǹ�ֵ��
  7. �������һ����ֵ�����Լ����Ҫô����'left'��ֵ�����'direction'Ϊ'rtl'����Ҫô����'right'��ֵ�����'direction'Ϊ'ltr'����Ȼ�����Ǹ�ֵ��

10.4 ������������'min-width'��'max-width'

'min-width'
ֵ��  <length> | <percentage> | inherit
��ʼֵ��  ȡ�����û���
ʹ���ڣ�  ����Ԫ�أ����˷��滻����Ԫ�غͱ���Ԫ��
�ɷ�̳У�  ��
�ٷֱȣ�  ���ڰ�����Ŀ���
ý�飺  ͼ��
'max-width'
ֵ��  <length> | <percentage> | none | inherit
��ʼֵ��  none
�����ڣ�  ����Ԫ�أ����˷��滻����Ԫ�غͱ���Ԫ��
�ɷ�̳У�  ��
�ٷֱȣ�  ���ڰ�����Ŀ���
ý�飺  ͼ��

    �����������������߽���Ŀ���������һ��ȷ���ķ�Χ�ڡ�ȡֵ�ĺ������£�

<length>
ָ��һ���̶�����С�����ļ�����ȡ�
<percentage>
ָ��ȷ������ֵ�İٷֱȡ��ٷֱȵļ���������ɿ���������Ŀ��ȡ�
none
��������'max-width'���Կ�Ŀ���û�����ơ�

    ������㷨�������������������Ӱ��'width'���Ե�����ֵ��

  1. �ȸ������������Ⱥͱ߾�ļ��㡱�еĹ��������ȣ�������'min-width'��'max-width'����
  2. �������õ���'min-width'����'max-width'��'max-width'����Ϊ'min-width'��ֵ��0
  3. �������ֵ����'max-width'�����������ٴ�ʹ�ã����������'max-width'��Ϊ'width'��ָ��ֵ��
  4. �������ֵС��'min-width'�����������ٴ�ʹ�ã����������'min-width'��Ϊ'width'��ָ��ֵ��

    �û��˿���ָ��һ���Ǹ���'min-width'���Ե���Сֵ����ֵ���ݲ�ͬ��Ԫ�أ����������������Զ���ͬ�����'min-width'С�ڸ����ޣ���������Ϊ����ʽ��ָ����������������Ϊ'auto'�����Ĺ���ʹ�����̫С���û��˿���ʹ����Сֵ��Ϊ����ֵ��

10.5 ���ݵĸ߶���'height'����

'height'
ֵ��  <length> | <percentage> | auto | inherit
��ʼֵ��  auto
�����ڣ�  ����Ԫ�أ����˷��滻����Ԫ�أ������к�����
�ɷ�̳У�  ��
�ٷֱȣ�  ������
ý�飺  ͼ��

    ������ָ���˿���Ԫ�غ��滻Ԫ�����ɵĿ�����ݸ߶���

    �����Բ������ڷ��滻����Ԫ�ء����滻����Ԫ�ؿ�ĸ߶���Ԫ�ص�'line-height'ֵ����̳�ֵ��������

    ȡֵ�ĺ������£�

<length>
ָ���̶��ĸ߶ȡ�
<percentage>
ָ��һ���ٷֱȸ߶ȡ��ٷֱȵļ���������ɿ���������ĸ߶ȡ����������ĸ߶�û����ʽ������������ȡ�������ݵĸ߶ȣ�����ֵ��ͬ��'auto'��
auto
�߶�ȡ�����������ԡ��������������

    ����'height'ֵ�ǷǷ��ġ�

���ӣ�

    ���磬����Ĺ��򽫶���ĸ߶ȹ̶�Ϊ100�㣺

P { height: 100px }

    �߶ȳ���100��Ķ��佫����'overflow'���Զ����������

10.6 �߶Ⱥͱ߾�ļ���

    �ڼ���'top', 'margin-top'��'height'��'margin-bottom'��'bottom'��ֵʱ������Բ�ͬ����Ŀ��������

  1. ���ڵķ��滻Ԫ��
  2. ���ڵ��滻Ԫ��
  3. ���������еĿ��ࡢ���滻Ԫ��
  4. ���������еĿ��ࡢ�滻Ԫ��
  5. �����ķ��滻Ԫ��
  6. �������滻Ԫ��
  7. ���Զ�λ�ķ��滻Ԫ��
  8. ���Զ�λ���滻Ԫ��

    1-6������Զ�λ��

10.6.1 ���ڵķ��滻Ԫ��

    ���'top'��'bottom'��'margin-top'��'margin-bottom'Ϊ'auto'�����ǵļ���ֵΪ0��'height'���Բ������ã����ǿ�ĸ߶���'line-height'���Ը�����

10.6.2 ���ڵ��滻Ԫ�أ����������еĿ��ࡢ�滻Ԫ�أ��������滻Ԫ��

    ���'top'��'bottom'��'margin-top'��'margin-bottom'Ϊ'auto'�����ǵļ���ֵΪ0�����'height'Ϊ'auto'�������ֵΪ�����߶ȡ�

10.6.3 ���������еĿ��ࡢ���滻Ԫ�أ������ķ��滻Ԫ��

    ���'top'��'bottom'��'margin-top'��'margin-bottom'Ϊ'auto'�����ǵļ���ֵΪ0�����'height'Ϊ'auto'���߶�ȡ���ڸ�Ԫ���Ƿ����κο�����Ԫ�ء������ֻ����������Ԫ�أ��߶ȵ�����˵��߿�Ķ�����׶˵��߿�ĵ�֮��ľ��롣���������������Ԫ�أ��߶ȵ�����˵Ŀ����ӿ�Ķ��߽絽��׶˵Ŀ����ӿ�ĵױ߽硣ֻ���dz��������е���Ԫ�أ�����������;��Զ�λ�򱻺��ԣ�ֻ������Զ�λ��δƫ�Ƶ��������ע�⣬�ӿ������һ����������

10.6.4 ���Զ�λ�ķ��滻Ԫ��

    ���ھ��Զ�λ��Ԫ�أ���ֱ����ijߴ������������Լ����

    'top' + 'margin-top' + 'border-top-width' + 'padding-top' + 'height' + 'padding-bottom' + 'border-bottom-width' + 'margin-bottom' + 'bottom' = ������ĸ߶�

    ������߿���ʽΪ'none'����Ϊ������'0'������Լ����ʵ�ֻ�������˳���һϵ���滻��

  1. ���'top'Ϊ'auto'�������滻Ϊ��������Ķ��ߵ��ٶ�����'position'��������Ϊ'static'��������Ԫ�صĵ�һ������Ǹ������Ķ��߾�ߵľ��롣������Ϊ�˲�ȥʵ�ʼ����Ǹ����û��˿������ɵز����������ڵ�λ�á������������ڰ��������棬��ֵΪ������
  2. ���'height'��'bottom'Ϊ'auto'����'bottom'�滻Ϊ0��
  3. ���'bottom'��'height'����'auto'����'margin-top'��'margin-bottom'�е�'auto'�滻Ϊ'0'��
  4. �������һ����'margin-top'��'margin-bottom'����'auto'�����ݸ��ӵ�Լ�������������߾��������������ʽ��
  5. �������һ����ֻ��һ��'auto'�����ݵ�ʽ�����ֵ��
  6. �������һ����ֵ�����Լ��������'bottom'��ֵ��Ȼ�����Ǹ�ֵ��

10.6.5 ���Զ�λ���滻Ԫ��

    ��һ���κ�ǰ�����ƣ�ֻ��Ԫ����һ�������߶ȡ��滻��˳���Ϊ��

  1. ���'height'Ϊ'auto'�������滻ΪԪ�ص������߶ȡ�
  2. ���'top'Ϊ'auto'�������滻Ϊ��������Ķ��ߵ��ٶ�����'position'��������Ϊ'static'��������Ԫ�صĵ�һ������Ǹ������Ķ��߾�ߵľ��롣������Ϊ�˲�ȥʵ�ʼ����Ǹ����û��˿������ɵز����������ڵ�λ�á������������ڰ��������棬��ֵΪ������
  3. ���'bottom'Ϊ'auto'����'margin-top'��'margin-bottom'��'auto'�滻Ϊ'0'��
  4. �������һ��'margin-top'��'margin-bottom'����'auto'�����ݸ��ӵ�Լ�����������߾��������������ʽ��
  5. �������һ��ֻ��һ��'auto'�����ݵ�ʽ�����ֵ��
  6. �������һ����ֵ�����Լ��������'bottom'ֵ��Ȼ����ݵ�ʽ����Ǹ�ֵ��

10.7 ��С�����߶���'min-height'��'max-height'

    ��ʱ��Ԫ�صĸ߶ȿ�����һ���ض��ķ�Χ�ں����á������������ṩ�������Ĺ��ܣ�

'min-height'
ֵ��  <length> | <percentage> | inherit
��ʼֵ��  0
�����ڣ�  ����Ԫ�أ����˷��滻����Ԫ�غͱ���Ԫ��
�ɷ�̳У�  ��
�ٷֱȣ�  ���������ĸ߶�
ý�飺  ͼ��
'max-height'
ֵ��  <length> | <percentage> | none | inherit
��ʼֵ��  none
�����ڣ�  ����Ԫ�أ����˷��滻����Ԫ�غͱ���Ԫ��
�ɷ�̳У�  ��
�ٷֱȣ�  ���������ĸ߶�
ý�飺  ͼ��

    �����������������߽���ĸ߶�������һ���ķ�Χ�ڡ�ȡֵ�������£�

<length>
ָ��һ���̶�����С�����߶ȡ�
<percentage>
ָ��һ���ٷֱ���ȷ������ֵ���ٷֱȵļ���������ɿ���������ĸ߶ȡ����������ĸ߶�û����ʽָ����������ȡ�������ݵĸ߶ȣ����ðٷֱ�ֵ��ͬ��'auto'��
none
������'max-height'���ã��Կ�ĸ߶�û�����ơ�

    ������㷨�������������������Ӱ��'height'���Ե�����ֵ��

  1. �߶ȵļ�������������߶Ⱥͱ߾�ļ��㡱�Ĺ��򣨲�����'min-height'��'max-height'����
  2. ���'min-height'�ļ���ֵ����'max-height'��'max-height'����Ϊ'min-height'��ֵ��
  3. �������ĸ߶ȴ���'max-height'�������������ٴ�ʹ�ã����������'max-height'��Ϊ'height'��ָ��ֵ��
  4. �������߶�С��'min-height'�������������ٴ�ʹ�ã����������'min-height'��ν'height'��ָ��ֵ��

10.8 �иߵļ���/a>��'line-height'��'vertical-align'����

    �����ڸ�ʽ�������������У��û��˽����ڿ�����Ϊ��ֱ������߿��Ķѵ����߿�߶������������ģ�

  1. �����߿���ÿ�����ڿ�ĸ߶ȣ��μ����߶Ⱥͱ߾�ļ��㡱�Լ�'line-height'���ԣ���
  2. ���ڿ������'vertical-align'���Զ��ڴ�ֱ������롣
  3. �߿�ĸ߶���������Ŀ�Ķ��ߵ�������Ŀ�ĵױߵľ��롣

    �յ�����Ԫ�ز����յ����ڿ򣬵�����Щ��Ҳ�����߾࣬�߰ף��߿���иߣ���˺���Щ�����ݵ�Ԫ��һ����Ӱ�������ļ��㡣

    ע�⣬����߿������еĿ򶼶������ǵĵײ����߿�ĸ߶�ǡ�õ�����ߵĿ�ĸ߶ȡ����ǣ���������һ����ͬ�Ļ��߶��룬�߿�Ķ��͵׿��ܽӴ�������ߵĿ�Ķ��͵ס� box.

10.8.1 ����Ͱ����

    ����һ�����ڿ�ĸ߶Ȼ�Ϳ������ֵĸ߶��в�����磬'line-height' > 1em��������Ⱦ�����η��ŵ��Ϸ����·������пհס�����ߴ��'line-height'����ֵ��IJ��ͳ�Ϊ�����������һ��ͳ�Ϊ�������

    �û��˽����η�����һ�����ڿ�Ĵ�ֱ���룬�ڶ��͵׼������졣���磬���һ�����ָ߶�Ϊ'12pt'����'line-height'ֵΪ'14pt'�������2pt�Ķ���հף�1pt�ڶ�����1pt�ڵײ�������Ҳ�����ڿյĿ򣬾ͺ�����һ�յĿ�������ޱ����ĸ����

    ���'line-height'ֵС������ߴ磬�������ڿ�ĸ߶Ƚ�С������ߴ磬����Ⱦ�����ν���������������档���������һ����Ӵ���һ�����ڿ�ıߣ���Ⱦ������Ҳ�ᡰ���롱���ڵ��߿�

    ��Ȼ���滻Ԫ�صı߾ࡢ�߿�ͱ߰ײ����������ڿ�߶ȵļ��㣨Ҳ�Ͳ��μ��߿�߶ȵļ��㣩�����ǻ��������ڿ���Χ�õ���Ⱦ�������ζ�����һ���߿�ĸ߶�С�ڿ������������Լ��߰׺ͱ߿����ɫ���ܻᡰ���롱���ڵ��߿򡣲�������������£���Щ�û��˿���ʹ���߿������ü����߿�ͱ߰����򣨼�������Ⱦ���ǣ���

'line-height'
ֵ��  normal | <number> | <length> | <percentage> | inherit
��ʼֵ��  normal
�����ڣ�  ����Ԫ��
�ɷ�̳У�  ��
�ٷֱȣ�  ����Ԫ������������ߴ�
ý�飺  ͼ��

    ���������������һ������Ԫ�أ������ߵ�����������Ԫ����ɣ���ָ����ÿһ�����ɵ����ڿ����С�߶ȡ�

    ���������������һ������Ԫ�أ���ָ���˸�Ԫ�����ɵ�ÿһ�����ȷ���߶ȡ������������滻Ԫ�أ����Ŀ�ĸ߶���'height'���Ը�������

    ������ȡֵ�ĺ������£�

normal
ָʾ�û��˻���Ԫ�ص�����ߴ罫����ֵ����Ϊһ������������ֵ����ֵ�ĺ����<number>��ͬ�������Ƽ�'normal'�ļ���ֵ��1.0��1.2֮�䡣
<length>
��ĸ߶����õ�����ֵ�������ǷǷ��ġ�
<number>
�����Ե�����ֵ�Ǹ����ֳ���Ԫ�ص�����ߴ硣�����ǷǷ��ġ������������ֶ���������ֵ�����̳С�
<percentage>
�����Ե�����ֵ�ǰٷֱȳ���Ԫ�صļ��������ߴ硣�����ǷǷ��ġ�

���ӣ�

    ����������������������ͬ���иߣ�

DIV { line-height: 1.2; font-size: 10pt }     /* number */
DIV { line-height: 1.2em; font-size: 10pt }   /* length */
DIV { line-height: 120%; font-size: 10pt }    /* percentage */

    ���һ��Ԫ�ذ�����ֹһ��������Ⱦ���ı����û���Ӧ�ø�����������ߴ���ȷ��'line-height'��ֵ��

    һ��أ��������һ�������е��������ڿ�ֻ��һ��'line-height'ֵ�������Ƕ������иߵ�ͼ�Σ����������򽫱�֤�����еĻ������þ���'line-height'����ֵ����һ�����Ҫ�������ڱ����У���ͬ������ı��б����������ʱ��

    ע���滻Ԫ����һ��'font-size'�Լ�һ��'line-height'���ԣ���ʹ���Dz���ֱ������ȷ����ĸ߶ȡ�'font-size'��������'em'��'ex'��λ����'line-height'��'vertical-align'��������һ�������á�

'vertical-align'
ֵ��  baseline | sub | super | top | text-top | middle | bottom | text-bottom | <percentage> | <length> | inherit
��ʼֵ��  baseline
�����ڣ�  ����Ԫ�غͱ���ԪԪ��
�ɷ�̳У�  ��
�ٷֱȣ�  ����Ԫ��������'line-height'
ý�飺  ͼ��

    �����Ծ���һ������Ԫ�ز����Ŀ���һ���߿��ڴ�ֱ�����λ�á��������Щֵ���ڲο�������Ԫ�ػ������Ԫ������һ���������ڿ���������Ԫ��ʱ�������壻��������û���κ����á�

     ע�⡣��Щ���Ե�ֵ�ڱ��������к�����΢������ͬ�ݡ���μ�����߶��㷨���˽����ϸ�ڡ�

baseline
����Ļ��߶��븸��Ļ��ߡ�����ÿ�û�л��ߣ�����ĵ��߶��븸�Ļ��ߡ�
middle
����Ĵ�ֱ�м����븸��Ļ��ߣ����ϸ���x�߶ȵ�һ�롣
sub
����Ļ��߽��͵�������±��ǡ��λ�á�����ֵ��Ԫ���ı�������ߴ�û��Ӱ�졣��
super
����Ļ������ߵ�������ϱ��ǡ��λ�á�����ֵ��Ԫ���ı�������ߴ�û��Ӱ�졣��
text-top
��Ķ����븸Ԫ������Ķ���
text-bottom
��ĵ׶��븸Ԫ������ĵס�
<percentage>
�������ߣ���ֵ���򽵵ͣ���ֵ����һ���루'line-height'ֵ�İٷֱȣ���'0%'��ͬ��'baseline'��
<length>
�������ߣ���ֵ���򽵵ͣ���ֵ����һ���롣'0cm'��ͬ��'baseline'��

    ����ֵ���ڸ����ɵĿ����ڵ��߿�

top
��Ķ������߿�Ķ���
bottom
��ĵ׶����߿�ĵס�