Креирајте просторе и физичко раздвајање елемената у ХТМЛ-у помоћу ЦСС-а
Стварање простора и физичко раздвајање елемената у ХТМЛ-у може бити тешко разумљиво за почетни веб дизајнер. То је зато што ХТМЛ има својство познато као "колапс простора". без обзира да ли уносите 1 размак или 100 у ХТМЛ код, веб претраживач аутоматски сруши те просторе на само један простор. Ово се разликује од програма као што је Мицрософт Ворд , који дозвољава креаторима документа да додају више размака да раздвоје речи и друге елементе тог документа.
Ово није начин на који се креира размак медија.
Дакле, како додате места у ХТМЛ који се појављују на веб страници ? Овај чланак разматра неке од различитих начина.
Простори у ХТМЛ-у са ЦСС-ом
Жељени начин додавања размака у ХТМЛ-у је са Цасцадинг Стиле Схеетс-ом (ЦСС) . ЦСС треба да се користи за додавање било каквих визуелних аспеката веб странице, а пошто је размак део графичке карактеристике странице, ЦСС је тамо где желите да се ово уради.
У ЦСС-у можете користити или маргине или опције за додавање да бисте додали простор око елемената. Поред тога, својство текста-додавање додаје простор предњем делу текста, као што је за стављање параграфа.
Ево примера како користити ЦСС да додате простор испред свих ваших параграфа. Додајте следеће ЦСС на спољашњи или интерни стилски лист:
п {
текст-индент: 3ем;
}
Простори у ХТМЛ-у: Унутар вашег текста
Ако желите само да додате додатни простор или два вашем тексту, можете користити простор који не расте.
Овај лик делује као стандардни просторски знак, само се не сруши унутар претраживача.
Ево примера како додати пет простора унутар линије текста:
Овај текст има пет додатних простора унутар ње
Користи ХТМЛ:
Овај текст има & нбсп; & нбсп; & нбсп; & нбсп; & нбсп; пет додатних простора унутар ње
Такође можете да користите ознаку <бр> да додате додатне линије паузе.
Ова реченица има пет прекида линија на крају <бр/> <бр/> <бр/> <бр/> <бр/>
Зашто је размак у ХТМЛ-у лоша идеја
Иако ове опције функционишу - елемент који не прелази простор ће заиста додати размаке у вашем тексту, а преломи линије ће додати размаке испод горе приказаног параграфа - то није најбољи начин за креирање размака на вашој веб страници. Додавање ових елемената у ХТМЛ доприноси код уместо да одваја структуру странице (ХТМЛ) из визуелних стилова (ЦСС). Најбоље праксе указују на то да би требало да буду одвојене из више разлога, укључујући лако ажурирање у будућности и укупну величину датотеке и перформансе страница.
Ако користите спољашњи стилски стил да бисте диктирали све своје стилове и размаке, онда је промена тих стилова за целу локацију једноставна, јер једноставно морате ажурирати тај стилски стил.
Размотрите пример изнад реченице са пет тагова на крају. Ако сте желели ту количину размака на дну сваког од параграфа, ви бисте требали додати тај ХТМЛ код у сваки параграф на целом сајту. То је добар износ додатног означавања који ће вам гурати своје странице.
Поред тога, ако се одлучите за пут којим је овај размак превише или премало, а желите мало променити, потребно је изменити сваки појединачни пасус на целој веб локацији. Не хвала!
Уместо да додате ове елементе размака у свој код, користите ЦСС.
п {
паддинг-боттом: 20пк;
}
Та једна линија ЦСС-а би додала размаке испод пасуса ваше странице. Ако сте желели да промените тај размак у будућности, уредите ову линију (уместо кодова цијелог сајта) и добро је ићи!
Сада, ако вам треба додати један простор у једном делу ваше веб странице, помоћу ознаке <бр /> или јединственог непропадајућег простора није крај света, али морате бити пажљиви.
Коришћење ових инлине ХТМЛ размака између размака може бити клизав нагиб. Док један или два можда не повреде вашу локацију, ако наставите низ путању, уводите проблеме на своје странице. На крају, боље је да се окренете на ЦСС за размак ХТМЛ-а, као и све остале визуелне потребе веб странице.