TechCodeview

Ако искаме да добавим подложка в Html документа с помощта на вътрешния CSS, тогава трябва да следваме стъпките, дадени по-долу. Използвайки тези прости стъпки, можем лесно да добавим подложката.

foreach машинопис

Етап 1: Първо, трябва да напишем Html кода във всеки текстов редактор или да отворим съществуващия Html файл в текстовия редактор, в който искаме да добавим подложката.

 Add the Padding in Html Hello User!... You are at JavaTpoint Site... The text on which we want to add padding. 

Стъпка 2: Сега трябва да поставим курсора в тага head точно след тага title на Html документа и след това да дефинираме етикет, както е показано в следващия блок.

 Add the Padding in Html 

Стъпка 3: Сега трябва да дефинираме свойството на padding в този id селектор, който е посочен точно преди текста, към който искаме да добавим padding.

Следват петте различни свойства, от които можем да приложим подложката от всяка страна:

аз Padding-left:

Ако искаме да приложим само лява подложка към елемент, тогава трябва да използваме само padding-left свойство в селектора на id. И тогава трябва да зададем само една стойност на свойството, както е показано в следния пример:

 Add the left Padding in Html div { border: 3px solid blue; padding-left: 75px; background-color: yellow; } Hello User!... You are at JavaTpoint Site... The text on which we add the 75pixel left padding. 

Резултатът от горния код, който използва свойството padding-left, е показан на следната екранна снимка:

ii. Padding-right:

списък към масив java

Ако искаме да приложим само дясната подложка към елемент, тогава трябва да използваме само padding-right свойство в селектора на id. И тогава трябва да зададем само една стойност на свойството, както е показано в следния пример:

 Add the right Padding in Html div { border: 3px solid blue; padding-right: 250px; background-color: yellow; } Hello User!... You are at JavaTpoint Site... The text on which we add the 250pixel right padding. 

Резултатът от горния код, който използва свойството padding-right, е показан на следната екранна снимка:

iii. Подплата отгоре:

Ако искаме да приложим само горна подложка към елемент, тогава трябва да използваме само подложка-отгоре свойство в селектора на id. И тогава трябва да зададем само една стойност на свойството, както е показано в следния пример:

 Add the Top Padding in Html div { border: 3px solid orange; padding-top: 25px; background-color: green; } Hello User!... You are at JavaTpoint Site... The text on which we add the 25pixel top padding. 

Резултатът от горния код, който използва свойството padding-top, е показан на следната екранна снимка:

iv. Подложка отдолу:

Ако искаме да приложим само долна подложка към елемент, тогава трябва да използваме само подплънка-отдолу свойство в селектора на id. И тогава трябва да зададем само една стойност на свойството, както е показано в следния пример:

 Add the Bottom Padding in Html div { border: 3px solid orange; padding-bottom: 250px; background-color: green; } Hello User!... You are at JavaTpoint Site... The text on which we add the 250pixel bottom padding. 

Резултатът от горния код, който използва свойството padding-bottom, е показан на следната екранна снимка:

v. Подложка:

пружинни модули

Ако искаме да приложим различните подложки към всичките четири страни (отгоре, отдолу, отляво, отдясно), тогава трябва да посочим четирите стойности в свойството за подложка.

 padding: 10px 50px 75px 200px; 

Ако посочим двете стойности, тогава Html редакторът прилага първата подложка отгоре и отдолу и втората подложка отляво и отдясно.

превъртането на мишката не работи

 padding: 100px 50px; 

Ако посочим само стойност в атрибута за подложка, тогава Html редакторът прилага една и съща подложка към четирите страни.

 padding: 100px; 

Примери за свойство Padding:

Пример 1: Следващият пример използва една стойност в свойството за подложка, за да зададе една и съща подложка за всичките четири страни.

 Set one value to apply same padding div { border: 3px solid gray; padding: 100px; background-color: orange; } Hello User!... You are at JavaTpoint Site... The text on which we set the 100pixel padding to all the four side. 

Резултатът от пример 1 е показан на следната екранна снимка:

Пример 2: Следващият пример използва две стойности в подплата свойство за задаване на същата подложка на противоположните страни.

 Specify two value to apply same padding on opposite sides div { border: 3px solid black; padding: 100px 50px; background-color: gray; } Hello User!... You are at JavaTpoint Site... This is a text on which we set the 100 pixel padding to top and bottom and 50 pixels to left and right side. 

Резултатът от пример 2 е показан на следната екранна снимка:

Пример 3: Следващият пример използва четири стойности в свойството за подложка, за да зададе различни подложки за всичките четири страни.

 Specify four value to apply different padding on opposite sides div { border: 3px solid blue; padding: 10px 50px 75px 200px; background-color: red; } Hello User!... You are at JavaTpoint Site... This is a text on which we set the 10 pixel padding to top, 50 pixel padding to right, 75 pixel padding to bottom and 200 pixels padding to left side. 

Резултатът от пример 3 е показан на следната екранна снимка: