HTML5 - Подложка

The подплънки в HTML ни позволява да генерираме пространство между съдържанието и ръбовете на полето, което ги съдържа, по този начин можем да придадем на елемента въздух и да постигнем интересни графични ефекти.

• Подплата: Инициализира подложката за горния ръб, нейните измервания се изразяват в дължина или в проценти.
• Подложка вдясно: Инициализира подложката за десния ръб, нейните измервания се изразяват в дължина или в проценти.
• Подплата отдолу: Инициализира подложката за долния ръб, нейните измервания се изразяват в дължина или в проценти.
• Подложка отляво: Инициализира подложката за левия ръб, нейните измервания се изразяват в дължина или в проценти.
• Подплата: Този пряк път ни помага да извършим инициализацията на пълнежа с всичките му граници в един ред.

Нещо важно, което трябва да ограничим, когато правим инициализацията на a подплънки Използването на процентни измервания е, че този процент ще се взема само въз основа на ширината на елемента, а не на височината.
Нека да видим сега с прост код как да приложим a подплънки в нашия HTML5 документ.

 Пример
Има много различни видове плодове - има само над 500 сорта банани. Докато добавим безбройните видове ябълки, портокали и други добре познати плодове, ние сме изправени пред хиляди възможности за избор.

Както можем да видим от този код, можем да подчертаем доста интересни неща, ако се вгледаме внимателно, вече сме приложили други стилове към елемента, към който подлагаме, и тоест можем да смесваме с други елементи, за да получим резултата си, можем Вижте също, че използваме мерната единица им вместо pxВъпреки че двете са съвместими, въпросът е, че можем да видим тяхната гъвкавост; накрая нека видим как изглежда това в нашия браузър:

Сега нека видим как да приложим пряк път, за да инициализираме нашия подплънки в един ред, за това редът на измерванията на подложката е както следва: нагоре, надясно, надолу, наляво; В допълнение към това, когато пропускаме стойности, другата стойност се коригира към пропуснатата, например ако пропуснем лявата, тя ще вземе стойността на дясната, ако пропуснем долната, тя ще вземе стойността на горната, ако поставим само една стойност, четирите страни ще приемат една и съща стойност.
Ще демонстрираме цялата тази теория с кодекс на практика, нека видим как ще приложим уплътняването в един ред по много прост начин.

 Пример
Има много различни видове плодове - има само над 500 сорта банани. Докато добавим безбройните видове ябълки, портокали и други добре познати плодове, ние сме изправени пред хиляди възможности за избор.

Както виждаме, декларацията за пълнене не се променя много и спестяваме няколко реда, нека да разгледаме как би изглеждала в браузъра:

В този елемент ние го създаваме с доста неправилна граница, ако не бяхме приложили уплътнението, границата щеше да прихване текста, да направи промяната и да провери в браузърите си, за да види разликата.
С това приключваме нашия урок за уплътняване на HTML5, сега можем да създаваме интервали в елементите, които съдържат нашето съдържание в HTML документа, и това, което ни остава, е да продължим да практикуваме, докато не усвоим наученото в този урок.Хареса ли ви и помогнахте на този урок?Можете да възнаградите автора, като натиснете този бутон, за да му дадете положителна точка