ALIGN = "тэгцлэх"

BGCOLOR = "арын өнгө"

COLSPAN="нүдний тоо"

HEIGHT = "нүдний өндөр"

ROWSPAN = "нүдний тоо"

VALIGN = "босоо зэрэгцүүлэх"

WIDTH = "нүдний өргөн"

ALIGN шинж чанар нь нүдний агуулгыг зэрэгцүүлэхийг тодорхойлдог. Энэ нь ЗҮҮН (зүүн ирмэг), БАРУУН (баруун ирмэг) болон ТӨВ (төв) гэсэн гурван утгын аль нэгтэй байж болно. Өгөгдмөл нь CENTER.

BGCOLOR шинж чанар нь нүдний дэвсгэр өнгийг тодорхойлдог. Үүний утгыг бэлгэдлийн тэмдэглэгээ эсвэл RGB форматаар зааж өгч болно.

COLSPAN шинж чанар нь хэд хэдэн зэргэлдээ нүдийг хэвтээ байдлаар нэгтгэх боломжийг олгодог. Энэ шинж чанарын утга нь нэгтгэх нүднүүдийн тоо юм.

HEIGHT шинж чанар нь нүдний өндрийг пикселээр тодорхойлно.

ROWSPAN шинж чанар нь хэд хэдэн зэргэлдээ нүдийг босоо байдлаар нэгтгэх боломжийг олгодог. Энэ шинж чанарын утга нь нэгтгэх нүднүүдийн тоо юм.

VALIGN шинж чанар нь эсийн агуулгын босоо байрлалыг тодорхойлдог. Энэ нь дараах утгатай байж болно: TOP (дээд ирмэг), дун (дунд) ба BOTTOM (доод ирмэг). Өгөгдмөл нь дунд байна.

WIDTH шинж чанар нь нүдний өргөнийг пикселээр тодорхойлдог.

Нэгтгэх асуултууд.

1. Догол мөр нь гарчигнаас юугаараа ялгаатай вэ?

   Ямар төрлийн жагсаалт байдаг вэ?

   Үсгийн фонтыг өөрчлөхөд ямар шошго ашигладаг вэ?"Мэдээлэл" гэж юу вэ?

4. Гэрийн даалгавар:

1. Эхний мөрөнд нэг нүд, хоёр дахь мөрөнд хоёр, гурав дахь мөрөнд гурван нүд агуулсан хүснэгт үүсгэ.

2. Тагийн ALIGN шинж чанарт өөр өөр утгыг ашиглах үр нөлөөг практик дээр ажиглаарай .

html шошго (8)

Би одоогоор html/css-г сурч байгаа бөгөөд ерөнхий div контейнерийг үндсэн тагны үндсэн дээр байрлуулах нийтлэг арга гэдгийг анзаарсан:

Үүнд сайн шалтгаан байгаа юу? Яагаад css үндсэн шошгон дээр лавлаж болохгүй гэж?

Энэ бол гуравдагч этгээдийн кодлогчдын гаргадаг хамгийн том муу зуршлуудын нэг юм.

Миний дээрх бүх хариулт буруу байна. Бие нь өргөн, зах, хүрээ гэх мэтийг авдаг бөгөөд таны анхны сав шиг ажиллах ёстой. Html элемент нь зориулалтын дагуу таны дэвсгэр "зураг" болж ажиллах ёстой. Миний хийсэн олон арван сайтууд дээр би зөвхөн div контейнер ашиглах хэрэгтэй болсон.

divs савыг ашигладаг эдгээр кодлогч нар хаа сайгүй divs дотор divs-ээр тэмдэглэгээ хийдэг гэдэгт би мөрийцөхөд бэлэн байна.

Битгий хий. Divs-ийг бага зэрэг ашиглаж, нарийн зохион байгуулалтыг зориорой.

ШИНЭЧЛЭЛТ - Би 5 жилийн өмнөх энэ хариултыг засаж чадах тул SO-д юу нь буруу байгааг мэдэхгүй байна, гэхдээ би үүнийг хийхээс өмнө 50 төлөөлөгч хэрэгтэй гэж бичсэн тул сэтгэгдэлд хариулж чадахгүй байна. Үүний дагуу би энд ирсэн хариултуудад хариултаа нэмж оруулах болно. - = - = -

Би хариултаа өгснөөс хойш олон жилийн дараа үүнийг олж харлаа. Мэдээжийн хэрэг, чи тоглож байна уу?

Миний домэйн дээр олсон орлуулагч сайтын тохиргоо нь миний тэмдэглэгээ, хэв маяг гэж би хэзээ ч мэдэгдээгүй эсвэл миний нийтлэлд дурдагдсан нь нэг үгийн агуулга бүхий үндсэн CMS-ийн тохиргоо байсан нь тодорхой байна (тэр ижил зүйл дээр хэлсэн. нүүр хуудас). Энэ бол миний тэмдэглэгээ, хэв маяг биш юм. Энэ бол Silverstripe-ийн анхдагч загвар байсан. Мөн би үүнд хариуцлага хүлээхгүй. Гэсэн хэдий ч энэ нь div контейнер шаарддаг хоёр жишээний нэг байж магадгүй юм.

Жишээ 1: Үл мэдэгдэх зүйлсийг багтаах зориулалттай ерөнхий загвар. Энэ тохиолдолд та div дотор div дотор div байгаа өгөгдмөл CMS загварыг харах болно.

Жишээ 2: Хөлийн хэсгийг зөв цэвэрлэхийн тулд гурван баганатай зохион байгуулалт (Би энэ нь олон жилийн өмнө байсан учраас би чингэлэг савыг санахад хэцүү байх шаардлагатай хувилбар байсан гэж бодож байна.)

Би дөнгөж сая (хараахан дуусаагүй) өөрийн домэйны сэдэв үүсгээд контент байршуулж эхлэв. Семантик тэмдэглэгээг хялбархан олж авахын тулд холбоос дээр дарна уу.

Үнэнийг хэлэхэд, хүмүүс танд чингэлэг сав хэрэгтэй гэж бодож, биеийг бүтээх гэж оролдохоосоо өмнө үүнээс эхэлдэг гэж би гайхаж байна. CSS-ийн анхны зохиогчдын нэг нь тайлбарлахыг сонссоноор уг бие нь "эх сав" байх зорилготой байсан.

Тэмдэглэгээ нь таны харсан байдлаар биш, шаардлагатай бол нэмэх ёстой.

Анхдагч байдлаар ихэнх хөтөч вэб хуудасны хэмжээг авдаг. Тиймээс зарим хуудас ижил харагдахгүй өөр өөр хөтөч. Тиймээс хэрэглэгчийн хэрэглээ тодорхой нэг зүйлд өөрчлөгдөж болно HTML элемент. Жишээлбэл, хэрэглэгч тодорхой HTML тагийн тэмдэглэгээ, хэмжээ, өргөн, өндрийг нэмж болно.

Зарим хөтөч ( Internet Explorer) биеийн зарим шинж чанарыг дэмждэггүй, ялангуяа өргөн ба хамгийн их өргөн.

Миний хувьд хамгийн нийтлэг шалтгаанууд нь:

1. Байршил нь тогтмол өргөнтэй байж болно (тиймээ, би мэднэ, би тогтмол өргөнд дуртай дизайнеруудын хувьд маш их ажилладаг) ба
2. Ийм байдлаар текстийг тэгшитгэх: голыг үндсэн дээр, дараа нь div контейнерийн зүүн ба баруун талд margin: auto-г ашиглан байршлыг голчлон байрлуулж болно.

Энэ бол хуучин асуулт гэдгийг би мэдэж байгаа ч вэбсайтыг дахин төлөвлөх явцад ийм асуудалтай тулгарсан. Трой Далмассо намайг бодоход хүргэв. Тэр сайн санааг хэлдэг. Тиймээс би үүнийг див контейнергүйгээр ажиллуулж чадах эсэхийг хайж эхэлсэн.

Би биеийн өргөнийг тохируулах үед би чадна. Миний хувьд - 960 пиксел.

Энэ бол миний ашиглаж байгаа css:

Энэ нь тогтмол өргөнтэй шугаман блокуудыг төгс төвлөрүүлдэг.

Энэ нь хүн бүрт хэрэгтэй гэж найдаж байна.

Энэ арга нь бүх агуулгыг илүү уян хатан байдлаар өөрчлөх боломжийг танд олгоно. Ашиглаж болох хоёр савыг үр дүнтэй бүтээх. Арын дэвсгэр болж үйлчилдэг HTML шошго болон таны агуулгыг агуулсан контейнерийн ID-тай div.

Энэ нь танд арын дэвсгэр болон бусад эффектүүдийг арилгахын зэрэгцээ асуудалгүйгээр хуудсан дээр контент байрлуулах боломжийг олгоно. Үүнийг агуулгын хувьд "хүрээ" гэж бодоорой.

Контейнер div нь маш сайн, учир нь хэрэв та сайтыг голчлон байрлуулахыг хүсвэл үүнийг зөвхөн бие эсвэл html-ээр хийх боломжгүй ... Гэхдээ та div-тэй байж болно. Яагаад сав гэж? Энэ нь зөвхөн код нь цэвэр, уншигдахуйц байх ёстой тул ихэвчлэн ашиглагддаг. Тэгэхээр энэ бол чингэлэг... Энэ нь сайтыг бүхэлд нь агуулж байгаа, хэрэв та үүнийг хуурахыг хүсч байвал :)

Div шошго нь вэб хуудасны хэрэглэгчид эсвэл үзэгчдэд харагдахуйц харагдахуйц харагдахуйц болгохын тулд вэб хуудсыг загварчлахад ашиглагддаг. html-д container div ашиглах нь сайтыг илүү мэргэжлийн, сэтгэл татам болгох бөгөөд ингэснээр илүү олон хүмүүс таны хуудсыг судлахыг хүсэх болно.

Контейнер нь HTML хуудасны тодорхой хэсгийг тодруулах зориулалттай элемент юм. Энэ нь догол мөр, гарчиг, ишлэл, текстийн хэсэг гэх мэт байж болно. Хөтөч нь html хуудсан дээрх контейнерийг ямар ч байдлаар тодруулдаггүй.

Контейнер ашиглан вэбмастер HTML хуудасны тодорхой элементтэй хүссэн хэв маягийг "холбох" боломжтой. Нэмж дурдахад, контейнер нь html хуудасны элементэд зан төлөвийг "холбох" боломжийг олгодог.

Хоёр төрлийн сав байдаг: блок сав, доторлогоотой сав.

Баригдсан савнь html хуудасны блок элементийн нэг хэсэг юм. Жишээлбэл, блок контейнер нь догол мөрний текстийн хэсэг, догол мөрөнд байрлуулсан график дүрс гэх мэт байж болно.

Хосолсон шошго нь суулгагдсан контейнер үүсгэхэд ашиглагддаг SPAN. Шаардлагатай блок элементийн фрагментийг шошгон дотор байрлуулна SPAN, хүссэн хэв маягийг CSS дээр үүсгэсэн бөгөөд дараа нь шошгонд "хавсарсан" болно SPAN.

Блок сав

Хосолсон шошгыг ашиглан блокийн савыг үүсгэдэг DIVбөгөөд нэлээд олон удаа ашиглагддаг. Төрөл бүрийн блокийн элементүүдийг блокийн саванд байрлуулна: догол мөр, гарчиг, хүснэгт гэх мэт.

Сайн байна уу, блог сайтын эрхэм уншигчид. -д би түүний зарчмуудын талаар ярьж эхлэхийг оролдсон боловч харамсалтай нь вэбмастерийн үндсэн ойлголтуудыг тайлбарлахдаа маш их анхаарал сарниулах хэрэгтэй болсон.

Би эдгээр үндсэн зүйлийг үл тоомсорлохыг үнэхээр хүсээгүй бөгөөд энэ бүгдийг аль хэдийн мэддэг байсан ч яг тэр яриаг сонсохыг хүсч, сонсоогүй хүмүүсээс уучлалт гуйж байна.

Энэ нийтлэлд би гүйцэж, сайжруулахыг хичээх болно. Би үндсэн сэдвээсээ хэт их хазайхгүй байх гэж найдаж байна. За, бид уучлалт гуйх, наманчлах нь дууссан гэж үзэх бөгөөд эцэст нь ажилдаа орох цаг болжээ.

Бид DIV байршилд тулгуурлан 2 баганад вэбсайтын байршлыг бий болгодог

Тиймээс, өмнөх нийтлэлд бид хостинг дээрээ TEST хавтас үүсгэсэн (хэдийгээр эдгээр зорилгын үүднээс түүний боломжуудын тоймыг харна уу) TEST хавтас дотор ирээдүйн байршлынхаа үндсэн хоёр файлыг байрлуулсан: Index.html болон Style. .css. Үнэндээ тэд хүрээний хамгийн энгийн хувилбарыг бүрдүүлэх болно.

Дахин хэлэхэд, та бодит зохион байгуулалтаас бага зэрэг завсарлага авах хэрэгтэй болно, учир нь ... дээр байрлах үндсэн директорт TEST хавтас хэрхэн үүсгэхийг хүн бүр ойлгодоггүй жинхэнэ хостинг. Мөн энэ нь юу вэ - сайтын үндэс, FTP-ээр нэвтрэх үед хаанаас хайх вэ. Гэхдээ үнэндээ анх удаа хостингтой тулгарсан хэрэглэгчийн хувьд энэ асуулт тийм ч чухал биш юм.

Тиймээс та эхлээд FTP-ээр холбогдох хэрэгтэй болно. FTP-ээр холбогдох дэлгэрэнгүй мэдээллийг таны хостинг үйлчилгээ үзүүлэгчээс өгсөн байх ёстой (ерөнхийдөө уншина уу, a).

Та FTP-ээр холбогдсоны дараа (би энэ зорилгоор FileZilla програмыг ашигладаг - энэ талаар бүх үнэнийг бичсэн бөгөөд би түүний жишээг ашиглан бүгдийг хэлэх болно), дараа нь энэ програмын баруун цонхонд та лавлахын агуулгыг харах болно. Таны сайтууд, скриптүүд болон бусад зүйлсэд зориулж байршуулсан.

Гэхдээ энэ директор нь үндсэн хавтас болохгүй. Root нь Index.php файл болон таны ашиглаж буй хөдөлгүүрийн бусад бүх файл, фолдеруудыг агуулсан байх ёстой.

Энэ зорилгоор тусдаа лавлахыг ашигладаг, гэхдээ нэр нь тодорхой хостингоос хамаарч өөр өөр байж болно. Үндсэн лавлах дахь дотоод хавтасны бүтэц (FTP-ээр сайт руу холбогдох үед нээгддэг) өөр өөр байж болох ч мөн чанар нь ижил хэвээр байна.

Жишээлбэл, та дараах зургийг харж болно.

Та хөдөлгүүрийн файлуудыг FTP-ээр дамжуулан хандах боломжтой энэ дээд директор руу биш, харин үндсэн хавтас гэж нэрлэгдэх ёстой. Энд байгаа лавлахуудын аль нь үндэс болохыг хэрхэн олж мэдэх вэ?

За, хамгийн сүүлчийн арга бол та хостинг эзэмшигчээс өөрөөс нь асууж болно. За, тэд танд ийм асуудалд туслах үүрэгтэй. Гэхдээ ерөнхийдөө үүнийг ихэвчлэн дуудах болно PUBLIC_HTML эсвэл HTMLDOCS.

Хэрэв та ийм лавлахыг олоогүй бол хостинг эзэмшигчээс асуулт асуух хэрэгтэй бөгөөд үүнтэй төстэй зүйл байгаа бол энэ нь алдартай. үндэсҮүний дотор та миний бичсэн бидний удаан хүлээсэн TEST хавтас үүсгэх хэрэгтэй болно, та эдгээр хэдэн догол мөрийг уншина уу гэж найдаж байна.

FileZilla ашиглан лавлах хэрхэн үүсгэх вэ? Тийм ээ, маш энгийн. Та зүгээр л програмын баруун талд байрлах эцсийн лавлахыг нээж, хоосон зай дээр хулганы баруун товчийг дараад контекст цэснээс "Create Directory" -г сонгох хэрэгтэй.

Өө, бид сайтын үндсэн директорт TEST хавтас үүсгэсэн. Үүний төлөө баярлалаа. Ер нь үүн дээр санаа зовох шаардлагагүй байсан. Яаж тэгэх вэ? Бас үүн шиг. TEST лавлахыг вэб сайтын зарим дотоод хавтсанд үүсгэж болох ч root-д илүү хялбар байх болно.

Орон нутгийн Денвер серверийн хувьд та дараах директорт TEST лавлах үүсгэх шаардлагатай.

C:\server\home\localhost\www\

"С" дискний оронд та дотоод сервер суулгасан компьютер дээрээ драйвераа зааж өгөх хэрэгтэй. Дараа нь бидний Div layout дээр үндэслэн үүсгэж буй 2 баганатай бүдүүвчийг үзэхийн тулд та хөтөчийн хаягийн мөрөнд дараах замыг бичих хэрэгтэй.

http://localhost/test/

Хараал ид, бүх юмыг ингэж дэлгэрэнгүй яривал блок layout гэсэн жижиг ном гарна, ихэнхийг нь вэбмастерийн анхан шатны хичээлд зориулах болно, гэхдээ би өөр аргаар бичиж чадахгүй, ангилж сурсан. тавиур дээрх бүх нарийн ширийн зүйлс. Санаа зоволтгүй, бид энэ бүхний талаар шинэ зүйл биш, нэлээд ухаалаг вэбмастерууд юм.

Байршлын талаар яриагаа үргэлжлүүлье. Index.html файлд бид өөрсдийн хүрээ баригдах DIV контейнеруудыг өөрсдөө тодорхойлох ба Style.css файлд бид байрлал болон Гадаад төрхэдгээр DIV савнууд. Энэ бол товчхон боловч бодит байдал дээр хэрхэн өрнөхийг та хэсэг хугацааны дараа харах болно.

Хөтөч дээр хийсэн ажлынхаа үр дүнг харахын тулд бид тантай үе үе холбогдох болно хаягийн мөрхөтчийг өөрийн хостинг эсвэл дээр байрлах TEST хавтас руу оруулна уу локал сервер. Жинхэнэ хостын хувьд та хөтөчийнхөө хаягийн мөрөнд дараах зүйлийг бичих хэрэгтэй.

https://site/test

Гэхдээ энд хоёр "гэхдээ" байна. Нэгдүгээрт, https://site/-ийн оронд та URL хаягаа оруулах хэрэгтэй, хоёрдугаарт, TEST лавлахынхаа нэрийг бүрдүүлдэг латин үсгийн тохиолдлыг анхаарч үзээрэй.

Хэрэв та хавтасны нэрийг том үсгээр бичсэн бол хаягийн мөрөнд хавтасны нэрийг том үсгээр бичих хэрэгтэй (би энд TEST гэж том үсгээр бичсэн, зөвхөн хавтасны дэвсгэр дээр тодотгох зорилгоор текстийн үлдсэн хэсэг).

Бодит хостинг дээр ихэнх тохиолдолд серверүүд UNIX шиг ажилладаг үйлдлийн систем, үүнд том, жижиг үсэг нь ялгаатай(Бидний ажиллаж дассан Windows-ээс ялгаатай).

Бид вэбсайтын байршлыг divs дээр 2 баганад байрлуулж эхэлдэг

Өмнө дурьдсанчлан, эхлээд бид хоёр баганатай зохион байгуулалтыг бий болгохыг хичээх бөгөөд үүнийг схемийн дагуу дараах байдлаар дүрсэлж болно.

Бид бүх элементүүдийг нэг том Div саванд байрлуулах бөгөөд ингэснээр та энэ савны шинж чанараар дамжуулан бүхэл бүтэн байршлын хэмжээ, зэрэгцүүлэлтийг өөрчлөх боломжтой болно. Үндсэн Div дотор тусдаа блокуудыг (толгой, зүүн багана, агуулгын хэсэг, доод хэсэг) үүсгэх үүрэгтэй савнууд байх болно.

Бид тэдгээрийн хэмжээг тохируулж, хуудсан дээрх байршлыг нь тохируулна CSS ашиглан. Ингээд эхэлцгээе.

Index.html-ээс эхэлцгээе. Үүнийг өөрт тохирсон засварлагчаар нээнэ үү (би энэ зорилгоор хамгийн сайн үнэгүй хувилбарыг ашигладаг текст засварлагчид Notepad++ - ).

Зөв загварт дасахын тулд HTML баримтууд, стандарт хэсгийг нэн даруй бичье (би зүгээр л өмнөх нийтлэлдээ үүнийг зогсоосон. DOCTYPE () байх болно, хэрэв тэдгээр нь байхгүй бол хөтөч өөрөө нэмж болно (тэд ухаалаг болсон - энэ нь) аймшигтай):

Би энэ кодын бүх мөрийн утгыг өмнөх нийтлэлдээ дэлгэрэнгүй тайлбарласан (энэ нийтлэлийн эхэнд байгаа холбоосыг үзнэ үү), тиймээс одоо би зөвхөн мөрөнд анхаарлаа хандуулах болно:

Энэ мөр нь хөтчийг хаанаас хайх, хөтчөөс бидний төлөвлөж буй ирээдүйн сайтын загвар дизайныг зөв харуулах шаардлагатай шаталсан загварын хуудасны файлын нэрийг (CSS өргөтгөлтэй) гэж нэрлэдэгийг зааж өгдөг. Манай тохиолдолд үүнийг Style.css () гэж нэрлэдэг бөгөөд та үүнийг Index.html байрладаг (үнэндээ энэ мөр бичигдсэн) хавтсаас хайх хэрэгтэй.

Яагаад энэ хавтсанд байгаа юм бэ? Учир нь хэрэв та файл руу ямар нэг замыг заагаагүй бол (зөвхөн нэрийг нь зааж өгнө үү), хөтөч нь одоо ажиллаж байгаа файл байгаа ижил лавлахаас хайх болно (манай тохиолдолд энэ нь Index.html). Тэдгээр. зам байхгүй байх нь би Style.css руу орох замыг дараах хэлбэрээр бичсэнтэй адил байх болно:

Гэхдээ эхний бичлэг хийх сонголт нь богино бөгөөд илүү түгээмэл байдаг, учир нь файл бүхий хавтас руу очих замыг тэнд шууд заагаагүй тул та Index.html болон Style.css файлуудыг өөр директорт байрлуулж, хаягийн мөрнөөс Index.html руу хандах боломжтой бөгөөд Style.css ачаалагдсан хэвээр байх болно. Харьцангуй болон үнэмлэхүй холбоосын талаар дэлгэрэнгүй уншина уу).

Үүнтэй холбогдуулан та хостинг эсвэл локал серверийн талаар огт санаа зовох хэрэггүй гэдгийг тэмдэглэхийг хүсч байна. Зүгээр л компьютер дээрээ үүсгэхдурын хавтсанд манай Index.html болон Style.css-г байрлуул. Эхнийх нь Style.css файл руу орох замыг дараах хэлбэрээр бичнэ үү.

Тэгээд л болоо. Та одоо үндсэн хөтөч дээрээ Index.html файлыг нээх боломжтой (үүн дээр давхар товшино уу). HTML өргөтгөлтаны компьютер дээр, Style.css автоматаар ачаалагдах болно.

Энэ арга нь суралцах үе шатанд тохиромжтой, гэхдээ жинхэнэ хостинг эсвэл локал сервер дээр ажиллах талаар миний хэлсэн бүхэн ирээдүйд танд хэрэгтэй байх болно. Одоо компьютер дээрээ хавтаснаас ажиллах нь хостингоос ч илүү хялбар байх болно. Хэдийгээр хэнд хамаатай юм.

Бид шаардлагатай блокуудын багцыг index.html дээр бүртгэдэг

Одоо бид 2 баганын байршлын бүх хэсэгт (толгой, зүүн багана, агуулгын хэсэг, хөл) дөрвөн DIV контейнер үүсгэж, тэдгээрийг нэг том Div дотор хавсаргах хэрэгтэй болно.

Тодорхой болгох үүднээс эдгээр блокуудын нэрийг Div савны дотор байрлуулж болно. Бид энэ бүгдийг нээх, хаах Html Body хаягуудын хооронд бичих болно. Та Index.html дээр ийм код авах болно:

Тэдгээр. Нээлтийн Body хаягийн дараа бид байршлын контейнерийн үндсэн Div-ийн нээлтийн тагийг бичсэн:

Үнэгүй програмууд, ашигтай зөвлөмжүүдийн ертөнц
2024 whatsappss.ru