TA的每日心情 | 擦汗 2020-7-3 13:51 |
---|
签到天数: 19 天 [LV.4]偶尔看看III
|
: h1 z( [7 J- Q<span id="1">A</span>( W: H; [ e9 ^; _ t1 q
<span id="2">B</span>* V2 l) G+ j" U' a1 ?2 E
<span id="3">C</span>
4 H3 A; o: [/ P3 P<span id="4">D</span>
- V$ m; A" c7 \, P3 F y a<span id="5">E</span>
+ G. O5 n/ g6 W) I8 r<span id="6">F</span>1 Z4 J+ b' p0 F' }! g% R
<span id="7">G</span>; h6 H* j+ h5 b/ H
<span id="8">H</span>
) r6 a6 [8 ~( b, `3 s/ O' o0 Z<span id="9">I</span>' A! e5 ]4 [4 g/ c$ U& ^; g
+ }. Y( ^0 A! D$ h* T z9 z对于上面这个HTML,想显示成如下效果:
- X) w) [/ @# |; _1 ?ABC
8 W2 e) e& w# j$ [, P2 FDEF3 m$ \9 x/ J. z- E$ H" G
GHI
r, w$ v2 g' g5 b7 z在CSS中应该如何设置呢?这个小例子是对词库排版时经常可以遇到的问题。
' ~- K6 X! X& d( P6 Q/ O1 ` Q) O. m. m8 L3 I
要想让<span id="4">D</span>相对于前面内容换行,它自己就必须设置成block(不能靠前面的id="3"标签设置成block来实现,否则id="3"标签就与id="2"标签不在同一行了);而后面id="5"要与id="4"同行,id="4"又必须设置成inline —— 这正好是矛盾的,无法实现。
9 K4 Q) i& e# a4 F" W0 ^( T3 L, n# {9 ]' C
CSS规范似乎只能设置某标签是否独占一行,而缺少换行方面的设置机制:如果想对某标签的内容相对于前面标签内容是否换行显示的设置,仅仅影响本标签自己,至于本标签后面的标签相对于本标签是否换行完全由后面标签自己来设置而不受前面本标签样式的影响 —— 这是达不到的?!
. L: u, w L5 Y& S! s
7 P, ]3 i+ `& T6 D/ N: K* ^不知现有规范有何方案能达到以上目的?/ h. q! a/ d5 @ `' C
& Z; F' X) B8 u+ N$ l* `1 Q
' X. V9 e" F6 b/ ~4 W2 e7 J: e0 S7 w# {7 G6 L" T4 d
/ y+ d/ w* M- r |
|