fit lapā bieži vien ir nepieciešams, lai padarītu centrs izlīdzināšanas CSS veidā: piemēram, lai centrētu galveno ierīci.Ir vairāki risinājumi šai problēmai, no kuriem katrs agrāk vai vēlāk ir izmantot jebkuru coder.
līdzinātu tekstu centrēta
bieži dekoratīviem nolūkiem vēlaties iestatīt teksta saskaņošanu centrā, CSS šajā gadījumā, samazina laiku uzlikšanu.Iepriekš tas tika darīts, izmantojot HTML atribūtus, tagad standarts nosaka, savietojot tekstu, izmantojot stilu lapas.Atšķirībā no bloka, par kuru vēlaties mainīt ārējās starpības, ar CSS teksta saskaņošanu vidū ir ar vienu līniju:
- teksta-saskaņot: Centrs;
Šis īpašums ir mantots un nodots no vecākiem uz visiem bērniem.Tas ietekmē ne tikai tekstu, bet arī uz citiem elementiem.Lai to izdarītu, viņiem ir jābūt ar mazajiem burtiem (piemēram, kalibrēšanas) vai line-bloka (kādi bloki, kas nosaka īpašuma display: block).Pēdējā iespēja arī ļauj mainīt platumu un augstumu elastīgāku konfigurāciju padziļinājuma.
Bieži lapas saskaņot atribūtu tag pati.Tas uzreiz padara kodu nederīgs kā W3C atzina align atribūts novecojis.Tās lietošana nav ieteicama lapā.
centrēšanas centrā
Ja vēlaties norādīt saskaņošanu centra div, CSS var piedāvāt diezgan vienkāršu veidu: izmantot ārējās iespiedumiem starpību.Polsterējums var iestatīt kā bloka līmeņa elementiem un line-bloku.Svoysva vērtība ir iestatīts uz 0 (izrobota vertikāli) un auto (automātiskās horizontālās ievilkumi):
- margin: 0 auto;
Tagad šī iespēja ir atzīts par absolūti spēkā.Izmantojot ārējo polsterējums arī ļauj norādīt saskaņošanu centra: CSS-starpība īpašums ļauj atrisināt daudzas problēmas, kas saistītas ar pozicionēšanas elements lapā.
Saskaņot bloks kreisajā vai labajā malā
Dažreiz centrs pielīdzināšana CSS-way nav nepieciešama, bet tas ir nepieciešams, lai divas vienības blakus vienai no kreisās puses un no otras puses - no labās puses.Par šo īpašumu ir pludiņš, kas var veikt vienu no trim vērtībām: pa kreisi, pa labi, vai nav.Pieņemsim, ka jums ir divas vienības, kas ir nepieciešams, lai būtu kopā.Tad kods būs:
- .left {float: left;}
- .right {float: right}
Ja ir trešā vienība, kas jānovieto zem pirmajos divos blokos (piemēram, kājenes), viņšJums ir jāreģistrējas īpašums skaidra:
- .left {float: left;}
- .right {float: right}
- footer {skaidrs: gan}
fakts, ka bloki ar kreiso klasēm un labajā izkrist no kopējāplūsmas, tas ir, visi citi elementi ignorēja pastāvēšanu elementu jāsaskaņo.Īpašums skaidrs: gan ļauj kājeni vai kādu citu ierīci, lai redzēt samazinājās no plūsmas elementiem un aizliedz ietīšanu (float) abās pa kreisi un pa labi.Tāpēc mūsu Piemēram, footer mainīs uz leju.
Vertical saskaņošana
Ir gadījumi, kad nepietiekamas kopums centrs regulēšanas CSS veidi, jums ir vēl mainīt vertikālo stāvokli bērnu bloku.Jebkurš līnija vai līnija-bloks elements var nospiest pret augšējās vai apakšējās malas, kas atrodas vidū mātes elementa, vai būt jebkurā vietā.Biežāk prasa sakārtošanu lodziņa centrā, šo atribūtu izmanto vertikālo-saskaņot.Pieņemsim, ka ir divas vienības, viens iekšā citu.Iekšējā vienība - line-block elements (displejs: inline-block).Ir nepieciešams saskaņot vienības vertikāli bērnam:
- saskaņošanu attiecībā uz augšējo robežu - .child {vertikāli-align: top};
- centrs izlīdzināšana - .child {vertikālais-align: middle};
- saskaņošana apakšējā galā - .child {vertikālā-saskaņot: bottom};
par bloka līmeņa elementiem vai teksta izlīdzināt vai vertikāli-saskaņot nepiemēro.
Iespējamās problēmas ar izlīdzinātas gab
Dažreiz div saskaņot centru CSS-veidā, var izraisīt nelielas problēmas.Piemēram, izmantojot pludiņu: piemēram, ir trīs bloki: .first, .second un .third.Otrais un trešais bloki ir pirmais.Elements ar klasi otrā kreisā līdzināts, un pēdējo bloku - labajā pusē.Pēc tam saskaņojot divi izkrita no strauta.Ja vecāks nav definēts augstumu (piemēram, 30em), tas vairs stiept augstumu meitas vienību.Lai izvairītos no šīs kļūdas, izmantojiet "starpliku" - īpaša vienība, kas redz .second un .third.CSS-kods:
- .second {float: left}
- .third {float: right}
- .clearfix {augstums: 0;skaidra: gan;}
bieži izmanto pseido: pēc, kas arī ļauj atgriezties bloki vietā, izveidojot psevdorasporki (šajā piemērā ar div ar klases konteineru atrodas šajā .first un satur .left un .right):
- .atstāja {float: left}
- .right {float: right}
- .container: pēc {saturs: '';displejs: galda;skaidra: gan;}
virs iespējas - visbiežāk, lai gan ir dažas atšķirības.Jūs vienmēr varat atrast vienkāršākais un ērtākais veids, kā izveidot psevdorasporki ar eksperimentiem.
Vēl viena problēma bieži sastopas izkārtojums - sakārtošana line-bloka elementiem.Pēc katras no tām pievienoti automātiski telpā.Lai tiktu galā ar šo objektu palīdzības rezervi, kas tiek definēts negatīvā iespiedumiem.Ir arī citas metodes, kas tiek izmantotas retāk, piemēram, atiestatot fonta lielumu.Šajā gadījumā, īpašības mātes noteikts burti: 0.Ja atrodas teksta blokus, īpašības line-bloka elementi ir atgriezušies līdz vajadzīgajam izmēram.Piemēram, font-size: 1em.Šī metode ne vienmēr ir ērta, lai daudz biežāk izmanto iespēju ar ārējām rezervēm.
centrēšanas ļauj izveidot skaistu un funkcionālu lapas izkārtojumu, un tas ir vispārējs izkārtojums un preču atrašanās vieta veikalos, un fotogrāfijas uz mazas mājas lapā.
