过期域名预定抢注

 找回密碼
 免费注册

問一個CSS中行內框高度的問題!

[複製鏈接]
發表於 2010-12-15 17:11:56 | 顯示全部樓層 |閱讀模式
CSS有曰:% k+ c& T6 L! z

/ m6 g- S$ v$ `3 A3 }+ f$ ^行內框在一行中水平佈置。可以使用水平內邊距、邊框和外邊距調整它們的間距。# @5 p7 A6 }. \# w

1 }8 H. y4 B2 G: c( \3 t但是,垂直內邊距、邊框和外邊距不影響行內框的高度。
9 t) b7 {; v0 G  C' X% O8 X6 H  d' Q; z2 A) C7 j( k! l/ _
由一行形成的水平框稱為行框(Line Box),行框的高度總是足以容納它包含的所有行內框。不過,設置行高可以增加這個框的高度。
. f3 {1 w. ?, I! h  ~2 E: j
& T5 F9 m0 F  r9 ~/ L" M-----------------------------曰完了--------------------問問題,百思不得其解------------------的問題---------------------------------------
2 n! w0 w' J8 e( R
" @2 K4 A- Q- G4 M5 W行內框諸如<span>和<strong>,這個沒問題。
) o- s/ M% h# Z& @- W) D5 u" d2 ?5 `9 @9 H( t% b1 m3 k# T
第一行「行內框在一行中水平佈置。可以使用水平內邊距、邊框和外邊距調整它們的間距。」也好理解,增加或減少填充 框的寬度 外邊距調整行內框的間距;
$ u& U& F# P- ]' k+ P) g1 e8 w2 z& I& ~* a  D5 n
第二行問題大了,非常頭大,什麼叫「但是,垂直內邊距、邊框和外邊距不影響行內框的高度。」& G+ A: a& I2 e* {( m1 V; l

# ?% [. t$ o* @6 N+ i我在想,這個問題遲遲理解不了,存在兩種情況,我對框的高度定義理解錯誤,第二種,這個解釋錯了。先自我檢查下,什麼叫行內框的高度,我的理解是行內框的高度是元素內容高度+padding+margin+border width。因為在 CSS 中,width 和 height 指的是內容區域的寬度和高度。增加內邊距、邊框和外邊距不會影響內容區域的尺寸,但是會增加元素框的總尺寸。【我覺得我的這個理解沒問題的吧】,但是究竟為何「但是,垂直內邊距、邊框和外邊距不影響行內框的高度。」這句話非常糾結,糾結至今,無法解決,求解各位大大,這句話咋理解。
' x7 k; V% A0 m6 K  b, r( J, P6 A& a4 U7 _" \7 T
第三行「由一行形成的水平框稱為行框(Line Box),行框的高度總是足以容納它包含的所有行內框。不過,設置行高可以增加這個框的高度。」理解的似是而非,有一行形成的水平框稱謂行框,這個是否意味著段落中的一行一行的每一行就是一個行框?我按照這個邏輯,這個行框當然可以包含行內框了,不然沒有行框哪裡來的行內框呢?' A; Z; c3 S& h5 N) F

: L0 O$ y9 W( Z( {% b9 l最後一句「不過,設置行高可以增加這個框的高度。」這個框的高度指的是行內框呢?還是行框呢?目前理解的是行框。
" r% a/ H0 M: q, u1 k% v3 N3 O5 F3 u% n
說到了行框,by the way 看看這個無比糾結的解釋,高手請通俗的講下什麼是行高和行間距
( }, G6 n0 Z1 L- _7 A3 j, S) M  z3 c1 w" s8 i  G0 S: b& s2 g' ^4 j
CSS line-height 屬性3 h( k$ x  H9 H/ ~2 k/ B: y
定義和用法
% i: w6 s+ r7 u( S' @) [( \2 m
9 I3 G& e: s; {; E5 |3 l% P- Z9 y0 fline-height 屬性設置行間的距離(行高)。1 R; i/ j: j8 x
) e$ z  A$ M* s' A, M) O: A
8 A9 m0 v7 S; B0 w5 d" m
說明《糾結開始》
) s: @$ T6 U* y0 C6 q1 e+ I8 r3 |( L1 j
該屬性會影響行框的佈局。在應用到一個塊級元素時,它定義了該元素中基線之間的最小距離而不是最大距離。
. X4 C5 L: r/ d, z3 I" {  E4 I; N1 N% {! C* m
line-height 與 font-size 的計算值之差(在 CSS 中成為「行間距」)分為兩半,分別加到一個文本行內容的頂部和底部。可以包含這些內容的最小框就是行框。/ ], p, x9 d3 B/ h6 D1 u' G

* b% i+ S& W' O( V! s; |9 x原始數字值指定了一個縮放因子,後代元素會繼承這個縮放因子而不是計算值。《糾結結束》
3 t/ r# v& O- g0 g
/ J( L" q1 M6 k; Z' T
7 Q$ T  T4 v8 C1 ICSS學習就是一個不斷糾結與反糾結的過程,只有你把他們都反糾結了,豁然開朗。~~等著高手給我醍醐灌頂~
 樓主| 發表於 2010-12-15 17:14:40 | 顯示全部樓層
發完帖子又重新看了一遍,腦子都成漿糊了~
回復 给力 爆菊

使用道具 舉報

發表於 2010-12-15 20:28:32 | 顯示全部樓層
曾經拿過一本CSS書學,結果看了10頁就放一邊了,能體會到你的糾結
回復 给力 爆菊

使用道具 舉報

發表於 2010-12-15 21:22:36 | 顯示全部樓層
樓主最近學CSS發了不少貼啊,這帖問題太複雜,我也看成漿糊了.
回復 给力 爆菊

使用道具 舉報

發表於 2010-12-15 21:48:20 | 顯示全部樓層
CSS都過不了,你就無法做網頁,CSS是網頁中最簡單的,你想的太多了' i& k8 Q5 z1 @) w2 g0 e
我建議你再說簡單的,不要寫那麼多中文,用最簡單的方式來描述你的問題
' Z  y, X" L- u9 ]因為我都沒有看懂你中文裡面的那麼多名詞) L! p7 ?9 z( E) N1 \: }! S" a5 b7 }
, |' f7 W1 ^1 U6 }0 z! ~
是不是就是line-height懂不起嗎,這個很簡單,來個形象的比喻- t  T& F/ {4 P

' h2 ~% a9 I# q  y! K! m8 `* bline-height與height都是表示高,但是這2個詞表示的2個不同物體的高2 f6 C/ v+ a2 s0 f- J3 d

; E: ~2 J# T1 e3 R; Wheight表示外部高,line-height表示內部高
' Z7 s# v$ j, n+ F( D. ^0 [( ]2 ]4 G9 R4 o/ T0 \' q2 y7 Q! ?
好比一個人,他身高1.7米,他的本身高度,我們叫內部高line-height就是1.7米! l) z6 P& k& z" I
6 H7 c& ^( d& _7 u
然後他買了一件衣服加褲子套裝,這個套裝總長度是1.8米,那麼我們可以看成是外部輪廓高height是1.8米7 F; f# v5 f$ g: I% p
' y! X- F  a1 o/ W7 M
line-height為1.7米,height為1.8米,顯然他們結合在一起,衣服長了,內部表現就有有一點變形短縮3 I: I# s6 [7 _: w1 z3 r# K7 y! f
* h7 P  M0 f" J
在html中,line-height表示行高,意思就是實際要裝的html元件的實際高度) X& E' E8 w& N$ ?/ K3 Y  Y* ^4 B4 J
height為裝這個元件的外部輪廓高度
回復 给力 爆菊

使用道具 舉報

發表於 2010-12-16 11:24:31 | 顯示全部樓層
5# 月光飛燕 # E/ B6 b) C* J& `& ~6 [
5 C7 j& C5 ?# C6 Y9 n
8 X( [6 p* a# y1 A
熱心的飛燕,頂
回復 给力 爆菊

使用道具 舉報

您需要登錄後才可以回帖 登錄 | 免费注册

本版積分規則

过期高净值品牌域名预定抢注

點基跨境 數位編輯創業論壇

GMT+8, 2025-2-17 20:14

By DZ X3.5

小黑屋

快速回復 返回頂部 返回列表