Oħloq kaxxa bi scrolling tat-test billi tuża CSS u HTML
Kaxxa ta 'scroll HTML hija kaxxa li żżid il-vireg tal-iscroll fuq in-naħa tal-lemin u l-qiegħ meta l-kontenuti tal-kaxxa huma akbar mid-dimensjonijiet tal-kaxxa. Fi kliem ieħor, jekk ikollok kaxxa li tista 'toqgħod madwar 50 kelma, u għandek it-test ta' 200 kelma, kaxxa ta 'skrolljar HTML se tpoġġi vireg tal-iscroll biex tavżak tara l-150 kelma addizzjonali. Fl-HTML standard li sempliċement imbotta t-test żejjed barra mill-kaxxa.
Nagħmlu l-iscroll tal-HTML huwa pjuttost faċli. Inti sempliċiment għandek issettja l-wisa 'u l-għoli tal-element li trid tiskrollja u mbagħad tuża l-proprjetà ta' overflow tas - CSS biex tistabbilixxi kif trid li l-iscrolling iseħħ.
X'għandek tagħmel b'Test Extra?
Meta jkollok aktar test milli jaqbel fl-ispazju fuq it-tqassim tiegħek, għandek ftit għażliet:
- Irrevedi t-test sabiex ikun iqsar u jkun jaqbel.
- Ħalli t-test jiċċaqlaq lil hinn mill-limiti u jittama li t-tqassim jista 'jiffinanzja biex jappoġġaha.
- Aqta 't-test fejn jinfirex.
- Żid vireg tal-iscroll (ġeneralment vertikali għat-test) sabiex l-ispazju iscrolls biex juri t-test żejjed.
L-aħjar għażla hija tipikament l-aħħar għażla: toħloq kaxxa tat-test ta 'scrolling. Imbagħad test żejjed xorta jista 'jinqara, iżda d-disinn tiegħek mhux kompromess.
L-HTML u CSS għal dan ikunu:
L-overflow: auto; jgħidlek lill-browser biex iżżid il-vireg tal-iscroll jekk ikunu meħtieġa biex iżommu t-test milli jinfluwenza l-konfini tad-div. Iżda sabiex dan jaħdem, għandek bżonn ukoll il-proprjetajiet tal-wisa 'u l-istil tal-għoli stabbiliti fuq id-div, sabiex ikun hemm konfini għall-overflow.
Tista 'wkoll tnaqqas it-test billi tibdel il-kurrent: auto; għall-overflow: moħbija ;. Jekk tħalli barra l-proprjetà ta 'overflow, it-test jinfirex fuq il-konfini tad-div.
Tista 'Żżid Bars Skrollja għal Aktar minn sempliċi Test
Jekk ikollok xbieha kbira li tixtieq turi fi spazju iżgħar, tista 'żżid vireg tal-vireg madwarha bl-istess mod li kieku bit-test.
F'dan l-eżempju, l-immaġini ta '400x509 hija ġewwa paragrafu 300x300.
Tabelli jistgħu jibbenefikaw minn Bars Skrollja
Tabelli twal ta 'informazzjoni jistgħu jiksbu diffiċli ħafna biex jinqraw malajr ħafna, iżda billi jitqiegħdu ġewwa div ta' daqs limitat u mbagħad billi żżid il-proprjetà ta 'overflow, tista' tiġġenera tabelli b'numru ta 'dejta li ma tieħux spazju estrema fuq il-paġna tiegħek .
L-eħfef mod huwa bħad b'immaġnijiet u test, żid div madwar it-tabella, issettja l-wisa 'u l-għoli ta' dik id-div, u żid il-proprjetà ta 'overflow:
| Isem | Telefon | ||||
|---|---|---|---|---|---|
| Jennifer | 502-5366 .... Ħaġa waħda li jiġri meta tagħmel dan hija orizzontali barra l-iscroll normalment tidher għax il-browser jassumi li l-chrome tal-vireg tal-iscroll qed jikkoinċidi mat-tabella. Hemm bosta modi biex dan jiġi ffissat billi tinbidel il-wisa 'tat-tabella u oħrajn. Imma favorit tiegħi huwa li sempliċement itfi l-iscrollling orizzontali bil-overflow tal-proprjetà CSS 3-x. Sempliċiment żid overflow-x: moħbija; għad-div, u li se tneħħi l-iscroll bar orizzontali. Kun żgur li tittestja dan, għax jista 'jkun hemm kontenut li jisparixxi. Jappoġġja Firefox bl-użu tat-TBODY Tags għal OverflowKaratteristika tassew sbieħ tal-browser Firefox hija li tista 'tuża l-proprjetà ta' overflow fuq tabelli tal-mejda ta 'ġewwa bħal tbody u thead jew tfoot. Dan ifisser li tista 'ssettja vireg tal-iscroll fuq il-kontenuti tal-mejda, u ċ-ċelluli tal-header jibqgħu ankrati fuqhom. Dan jaħdem biss fuq Firefox , li huwa ħażin wisq, iżda hija karatteristika sbieħ jekk il-qarrejja tiegħek jużaw biss Firefox. Fittex għal dan l-eżempju fil-Firefox biex tara dak li jfisser.
|