CSS eta HTML erabiliz testu zurrunarekin kutxa bat sortu
HTML korritze koadroa kurbatzeko barra bat gehitzen du, eskuineko eta beheko aldean, koadroaren edukiak koadroko dimentsioak baino handiagoak direnean. Beste era batera esanda, 50 hitz inguru egon daitezkeen kutxa bat baduzu eta 200 hitzaren testua baduzu, HTML korritze-koadro bat korritze-barra batzuk jarriko ditu gora 150 hitz gehiago ikusteko. HTML estandarraren bidez, testu gehigarria bultza egingo litzateke kanpoan.
HTML korritzea egitea nahiko erraza da. Mugitu nahi duzun elementuaren zabalera eta altuera zehaztu besterik ez duzu egin behar, eta CSS desbideratze-propietatea erabili ezazu korritze hori nola gertatu nahi duzun zehazteko.
Testu gehigarriarekin zer egin?
Diseinuaren espazioan sartzen den testurik baduzu, aukera gutxi dituzu:
- Berriro idatzi testua, laburragoa eta doitzeko.
- Baimendu testu bat mugetatik kanpo jaistea eta diseinua babestea ahalbidetzen duela.
- Itzali egiten den testua moztu.
- Gehitu korritze-barra (normalean testua bertikalki), beraz, zuriuneak testu gehigarria erakusteko mugitzen du.
Aukera onena normalean azken aukera da: sortu korritze-koadroko testua. Ondoren testu gehigarria irakur daiteke oraindik, baina zure diseinua ez da arriskutsua.
Horretarako HTML eta CSS hau izango litzateke:
Desbordaketa: auto; korritze-barrak gehitzeko nabigatzaileari kontatzen dio idazketaren mugak desbideratzeko testua mantentzeko beharrezkoak diren. Hala ere, lan egiteko, zabalera eta altuera estiloaren propietateak ere behar dituzu div-en gainean, gainazalaren mugak badira.
Testua ere moztu dezakezu gainezkapena aldatuz: auto; desbideratu: ezkutatuta; Gainazaleko propietateak utziz gero, testua div mugaren gainetik isuri egingo da.
Korritu barrak Gehitu Testua baino gehiago gehi ditzakezu
Espazio txikiagotan erakutsi nahi duzun irudi handiak badituzu, korritze-barrak gehi ditzakezu inguruan testuarekin batera.
Adibide honetan, 400x509 irudia 300x300 paragrafo barruan dago.
Mahaiak mugitu ditzakezu tabernetan
Informazio-taulen luzera oso zaila da oso azkar irakurtzea, baina tamaina mugatu baten barnean sartuz eta gainazalaren propietatea gehituz, mahaiak sor ditzakezu zure webguneko muturreko tokia hartzen ez duten datu asko. .
Modu errazena irudiekin eta testurakoa bezalakoa da, taula gaineko div bat gehitu, div zabalera eta altuera ezartzeko, eta gainjarritako propietatea gehitu:
| Izena | Telefonoa | ||||
|---|---|---|---|---|---|
| Jennifer | 502-5366 .... Gauzak horrela gertatzen direnean korritze barra horizontal bat normalean agertzen da, nabigatzaileak bere gain hartzen du korritze tabernen chrome taula gainjarrita dagoela. Mahaiaren zabalera eta beste batzuk aldatzeko modu asko daude konpontzeko. Baina nire gogokoena CSS 3 higiezinen gainkarga-x desplazamendu horizontalarekin desaktibatzea besterik ez da. Just gehitu gainezkatzea-x: ezkutatu; div-era eta korritze barra horizontal hori kenduko du. Ziurtatu hau probatzea, desagertuko den edukia egon litekeen moduan. Firefoxek onartzen du TBODY Tags desbideratzeak erabiltzeaFirefox arakatzailearen funtzionaltasuna oso ona da barneko taula-etiketak kontrolatzeko propietateak erabil ditzakezula, hala nola tbody eta thead edo tfoot. Horrek esan nahi du korritze tabernak mahaiaren edukietan ezar ditzakezula eta goiburuko gelaxkak gainetik ainguratuta geratzen dira. Firefoxek bakarrik funtzionatzen du, hau txarra da, baina irakurleek Firefox bakarrik erabiltzen badute, ezaugarri atsegina da. Ikusi adibide hau Firefoxen zer esan nahi dudan ikusteko.
|