CSS болон HTML ашиглан гүйлгэх текст бүхий хайрцгийг үүсгэ
HTML гүйлгэх хайрцаг нь хайрцагны хэмжээнээс их байгаа тохиолдолд нүдний баруун болон доод хэсэгт гүйлгэх блокуудыг нэмдэг хайрцаг юм. Өөрөөр хэлбэл, хэрэв та 50 орчим үсгээр бичигдсэн хайрцгийг агуулсан хайрцагтай бөгөөд танд 200 үсгээр бичигдсэн бол HTML-ийн гүйлгэх хайрцаг нь нэмэлт 150 үгийг харж болно. Стандарт HTML нь ердийн хайрцагт гадуур нэмэлт текстийг түлхэх болно.
HTML гүйлгэх нь харьцангуй хялбар юм. Та зөвхөн гүйлгэх элементийн өргөн, өндрийг тохируулах хэрэгтэй бөгөөд дараа нь гүйлгэхийг хүсч байгаагаа тохируулахын тулд CSS дүүрсэн шинж чанарыг ашиглана.
Нэмэлт текстийг яах вэ?
Хэрвээ таны байршлын зай илүү багтсан бол илүү олон тексттэй байх болно.
- Текстийг дахин бичсэнээр богино байх ба таарах болно.
- Текстийг хязгаараас хэтрэхийг зөвшөөрч, байршуулалтыг дэмжихэд уян хатан байхыг найдаж байна.
- Текстийг устгана.
- Нэмэлт текстийг үзүүлэхийн тулд гүйлгэх баар (ихэвчлэн босоо текстийн хувьд) нэмнэ.
Хамгийн сайн сонголт бол хамгийн сүүлчийн сонголт юм: галт тэрэгний гүйлгэх текстийг үүсгэ. Дараа нь нэмэлт текстийг уншиж болно, гэхдээ таны загвар эвдэгдээгүй байна.
HTML болон CSS нь дараах байдалтай байна:
Халих: авто; Вэб хөтөч нь текстийг div-ийн хил хязгаарыг дүүргэхээс сэргийлж гүйлгэх баар нэмэхийг хэлдэг. Гэхдээ энэ нь ажиллахын тулд та бас div дээр тавигдсан өргөн, өндөр хэв маягийн шинж чанарууд хэрэгтэй бөгөөд ингэснээр халих хязгаарууд байх болно.
Та мөн текстийг халих: халих; халих: далд; Хэрэв та overflow property-г орхих юм бол текст нь div-ийн хил хязгаар дээр асгарна.
Та текстээс илүү текстийг нэмж болно
Хэрэв та жижиг зайнд харуулах том зурагтай бол текстэн тексттэй ижил төстэй байдлаар гүйлгэх тээгийг нэмж болно.
Энэ жишээнд 400x509 зураг 300x300 дотор байна.
Хүснэгтийг Scroll Bar-аас ашиг олох боломжтой
Мэдээллийн урт хүснэгтүүд нь маш хурдан уншихад маш хэцүү болж болох ч, тэдгээрийг хязгаарлагдмал хэмжээгээр оруулж дараа нь overflow property нэмж өгснөөр та хүснэгт дээр хэтэрхий зай авдаггүй олон тооны өгөгдөл үүсгэх боломжтой. .
Хамгийн хялбар арга бол зураг, тексттэй адилхан бөгөөд доогуур нь див нэмэх, диверийн өргөн ба өндөрийг тохируулах, overflow шинж чанарыг нэмэх:
| Нэр | Phone Женифер | 502-5366 Хөтөч цонхны хромын хром нь давхцаж байгаа гэж үздэг учраас үүнийг хийхийн тулд хэвтээ гүйлгэх цонх ихэвчлэн гарч ирдэг. Хүснэгт болон бусад хүмүүсийн өргөнийг өөрчлөхөд засах олон арга зам байдаг. Гэхдээ миний дуртай зүйл бол CSS 3 property overflow-x-т хэвтээ гүйлгэхийг болиулах явдал юм. Зүгээр л overflow-x: далд; Див руу шилжих бөгөөд энэ нь хэвтээ гүйлгэх барыг устгах болно. Үүнийг туршиж үзээрэй, учир нь агуулга алга болсон байж магадгүй юм. Firefox-г дэмждэг бол TBODY товчлуурыг ашиглан Overflow ашиглах боломжтойFirefox-ийн хөтөч нь үнэхээр гайхамшигтай шинж чанар бөгөөд та overflow property нь tbody, thead эсвэл tfoot шиг дотоод хүснэгтийн хаяг дээр ашиглаж болно. Энэ нь та хүснэгтийн агуулгын дагуу гүйлгэх боодолд тохируулж болох бөгөөд толгойн хэсгүүд нь тэдгээрийн дээр байрладаг. Энэ нь зөвхөн Firefox- д ажилладаг бөгөөд энэ нь хэтэрхий муу байна, гэхдээ таны уншигчид Firefox-г ашиглана. Энэ жишээг Firefox дээр би юу гэж хэлснийг нь үзээрэй.
|
|---|