Css lecture 5 in urdu Last lecture in Css
Css
Padding
padding use karty hai k border and content me space wazaha ho jay means k bottom me border kaha tak ho top py border kaha tak ho left py kaha ta ho ur content kaha tak ho esk lay ham padding use karty hai
padding use karty hai k border and content me space wazaha ho jay means k bottom me border kaha tak ho top py border kaha tak ho left py kaha ta ho ur content kaha tak ho esk lay ham padding use karty hai
4 types
The padding-bottom specifies the bottom padding of an element.
The padding-top specifies the top padding of an element.
The padding-left specifies the left padding of an element.
The padding-right specifies the right padding of an element.
The padding serves as shorthand for the preceding properties.
Padding-bootom
html>
<head>
</head>
<body>
<p style="padding-bottom: 20px; border:1px solid brown;">
This is a paragraph with a specified bottom padding
</p>
<p style="padding-bottom: 8%; border:1px solid red;">
This is another paragraph with a specified bottom padding in percent </p>
</body>
</html>
html>
<head>
</head>
<body>
<p style="padding-bottom: 20px; border:1px solid brown;">
This is a paragraph with a specified bottom padding
</p>
<p style="padding-bottom: 8%; border:1px solid red;">
This is another paragraph with a specified bottom padding in percent </p>
</body>
</html>
Padding-Top
<html>
<head>
</head>
<body>
<p style="padding-top: 20px; border:1px solid brown;">
This is a paragraph with a specified top padding
</p>
<p style="padding-top: 8%; border:1px solid brown;">
This is another paragraph with a specified top padding in percent
</p>
</body>
</html>
<html>
<head>
</head>
<body>
<p style="padding-top: 20px; border:1px solid brown;">
This is a paragraph with a specified top padding
</p>
<p style="padding-top: 8%; border:1px solid brown;">
This is another paragraph with a specified top padding in percent
</p>
</body>
</html>
Padding-left
<html>
<head>
</head>
<body>
<p style="padding-left: 15px; border:1px solid black;">
<html>
<head>
</head>
<body>
<p style="padding-left: 15px; border:1px solid black;">
This is a paragraph with a specified left padding
</p>
<p style="padding-left: 15%; border:1px solid black;">
This is another paragraph with a specified left padding in percent
</p>
</body>
</html>
</p>
<p style="padding-left: 15%; border:1px solid black;">
This is another paragraph with a specified left padding in percent
</p>
</body>
</html>
This is a paragraph with a specified left padding
This is another paragraph with a specified left padding in percent
Padding-right
<html>
<head>
</head>
<body>
<html>
<head>
</head>
<body>
<p style="padding-right: 15px; border:1px solid black;">
This is a paragraph with a specified right padding
</p>
<p style="padding-right: 8%; border:1px solid black;">
This is another paragraph with a specified right padding in percent </p>
</body>
</html>
This is a paragraph with a specified right padding
</p>
<p style="padding-right: 8%; border:1px solid black;">
This is another paragraph with a specified right padding in percent </p>
</body>
</html>
This is a paragraph with a specified right padding
This is another paragraph with a specified right padding in percent
Marquee
jesa news py footer py jo news chalti us k ly murquee usee karty hai
<marquee type="scroll" direction="right">Muwadat ali form hangu</marquee>
Mt Ali Okz
No comments: