Хөдөлгөөнд HTML дэх цагаан зай хэрхэн хандах талаар үзэх
Хэрэв та вэбсайт хийдэг дизайнер бол эхнээсээ сайтар ойлгох олон зүйлүүдийн нэг нь сайтын кодын цагаан зайд вэб хөтчүүдээр зохицуулагддаг арга зам юм.
Харамсалтай нь, браузерууд цагаан зайг зохицуулах арга нь эхлээд маш их төвөгтэй байдаггүй, ялангуяа хэрэв та HTML-т орж, цагаан орон зайг хэрхэн боловсруулах талаархи программуудтай харьцуулбал харьцуулах нь илүү хялбар байдаг.
Word processing программд баримт бичгийн доторх зай эсвэл табууд нэмж болох бөгөөд энэ зай нь баримт бичгийн агуулгын дэлгэцэнд харагдана. Энэ нь HTML болон вэб хуудастай адил биш юм. Иймээс цагаан орон зай хэрхэн хөгжихийг суралцах нь маш чухал юм.
Хэвлэх зай
Word processing software дээр гурван үндсэн цагаан орон зайны тэмдэгтүүд нь зай, таб, тэрэг буцах. Эдгээр үйлдэл тус бүр нь ялгаатай байдлаар боловч HTML хэлбэрээр хөтөч нь бүгдийг яг адилхан болгодог. Хэрвээ та HTML тэмдэглэгээндээ нэг зай эсвэл 100 зайг байрлуулж байгаа эсэх, эсвэл зай аваад цонх, зайны тусламжтайгаар буцааж хийвэл эдгээр бүх хуудсыг браузераар дамжуулан хуудсыг нь өгнө. Вэб дизайн нэр томъёонд энэ нь цагаан орон зай нурах гэж нэрлэдэг. Вэбсайт дээрх вэбсайт дахь хоосон зайг нэмэхийн тулд эдгээр ердийн зайны товчлуурыг ашиглаж болохгүй. Учир нь хөтөч нь хөтөч дээр олон зайд нэг зайд ногдсон байна,
Яагаад хэн нэгэн Tab ашигладаг вэ?
Ихэвчлэн хүмүүс текст баримт бичигт таб хэрэглэдэг бол байршлын шалтгааны улмаас тэдгээрийг ашиглаж байгаа эсвэл текстийг тодорхой газар руу шилжих эсвэл өөр нэг элементээс тодорхой зайд авах боломжтой байдаг. Вэб дизайн хийхдээ дээр дурдсан эдгээр орон зайны тэмдэгтүүдийг ашиглах боломжгүй юм.
Вэб дизайнд кодын доторхи зайны зайг ашиглах нь тухайн кодыг уншихад хялбар байх болно. Вэб дизайнерууд болон хөгжүүлэгчид нь аль элементүүд нь бусад элементийн хүүхдүүд байгааг харах боломжтой болгохын тулд индикатор руу нь tab-ыг ашигладаг. Гэвч тэдгээр индентүүд нь хуудасны нүүрний зохион байгуулалтад нөлөөлдөггүй. Нүдний харааны өөрчлөлтөд шаардлагатай зүйлсийн хувьд та CSS (cascading style sheets) руу хандах хэрэгтэй болно.
CSS-г HTML-ууд болон зайг үүсгэх
Өнөөдөр вэбсайтууд нь бүтэц, хэв маягийг ялгаж салгахаар бүтээгдсэн. Хуудасны бүтцийг HTML-ээр зохицуулдаг бол хэв маяг нь CSS-ээр тодорхойлогддог. Өөрөөр хэлбэл зай авалт эсвэл тодорхой байрлуулалт хийхэд CSS-ээр хандах хэрэгтэй бөгөөд зүгээр л HTML тэмдэгт рүү зайны тэмдэгт нэмэхийг оролдох гэсэн үг биш юм.
Хэрвээ та текстийн баганыг үүсгэхийн тулд таб хэрэглэхийг оролдож байгаа бол оронд нь CSS баганад байгаа элементүүд нь баганын байршлыг авах боломжтой. Энэ байрлуулалтыг CSS хөвөгч, үнэмлэхүй, харьцангуй байрлалаар, Flexbox эсвэл CSS Grid шиг CSS-ийн шинэ хэлбэрийн аргаар хийж болно.
Хэрвээ таны өгөгдөл оруулах хүснэгт бол та өгөгдлөө нэгтгэхийн тулд хүснэгт ашиглаж болно. Хүснэгтүүд нь ихэвчлэн олон жилийн турш цэвэр зохион байгуулалтын хэрэгсэл болж хүчирхийлэлд өртсөн учраас вэб дизайнд муухай реп авч чаддаг. Гэхдээ таны агуулга дээр дурдсан хүснэгтэн өгөгдлүүдийг агуулдаг бол хүснэгтүүд хүчин төгөлдөр хэвээр байна.
Хэмжээ, Padding, болон Text-Indent
CSS-тай зайгаар үүсгэх хамгийн түгээмэл аргууд бол дараах CSS загваруудын аль нэгийг ашиглана:
- маржин
- Дэвсгэр
- текст оруулах
Жишээлбэл, та дараах CSS-тай ижил текстийн эхний мөрийг таньж болно (энэ нь таны догол мөрөнд "эхний" хавсаргасан ангиллын шинж чанарыг харуулсан болохыг анхаарна уу):
p.first {
текст оруулах: 5em;
}
Энэ догол мөр нь одоо 5 тэмдэгт орчим хэвлэгдэх болно.
Мөн элемент эсвэл матрицын элементийг элементийн дээд, доод, зүүн, баруун талд (эсвэл талуудын хослол) зайгаар нэмэхийн тулд CSS-д ашиглаж болно. Эцэст нь CSS-ыг асаах замаар ямар ч зай авах боломжтой.
Нэгээс илүү олон текстийг CSS-ээр хийлгүйгээр шилжүүл
Хэрэв таны хүссэн бүх зүйл бол таны текст өмнөх зүйлээс нэгээс илүү зайг зөөхөд зориулагдана гэвэл эвдрээгүй зайг ашиглаж болно.
Муу таславч зай ашиглахын тулд та ердөө л & nbsp; Үүнийг HTML тэмдэглэгээн дээрээ олон удаа ашиглах хэрэгтэй.
Жишээлбэл, хэрэв та таван үгний зайг дээшлүүлэхийг хүсвэл дараах үгсийг нэмж болно.
& nbsp; & nbsp; & nbsp; & nbsp; & nbsp;HTML нь эдгээрийг хүндэтгэдэг бөгөөд тэднийг нэг орон зайнд нураахгүй. Гэсэн хэдий ч, энэ нь нэн ядуу практик гэж үзэж байгаа бөгөөд энэ нь зөвхөн HTML тэмдэглэгээг нэмж байршлын хэрэгцээнд зориулж баримт бичигт нэмж оруулсаар байгаа юм. Бүтцийн болон хэв маягийн тусгаарлалтыг эргэж харахын тулд эвдэрч эвдэрч эвдэрч эвдэрч эвдэрч эвдэрч эвдэрч, эвдэрч эвдэрч, эвдэрч, эвдэрч, эвдэрч, эвдэрч гэмтэхээс зайлсхийх хэрэгтэй.