<< Previous Next >>

CSS Padding

ఒక మూలకానికి దాని border కు మధ్యలో ఉండే ఖాళీ ప్రదేశాన్ని padding అనేది clear చేస్తుంది. దీనిపై కలర్ ప్రభావం ఉంటుంది. అనగా ఇది margin వలె పారదర్శక స్వభావాన్ని కలిగి ఉండదు. దీనికి shorthand property వర్తిస్తుంది.

Padding Shorthand Property

Click for
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
p{padding-top: 10px; padding-right: 15px; padding-bottom: 20px; padding-left: 25px;
border:1px solid #B2246B;
background-color: #CCFF99;}
</style>
</head>
<body>
<p>The top, right, bottom, and left padding can be changed independently using separate properties.</p>
</body>
</html>
బయటికి మాత్రం ఇలా కనబడుతుంది.

The top, right, bottom, and left padding can be changed independently using separate properties.


padding అనేది క్రింది నాలుగు property లలో ఏదో ఒక property ని కలిగి ఉంటుంది.

Padding Shorthand Property Description
padding : 5px 10px 15px 20px ; top padding 5px
right padding 10px
bottom padding 15px
left padding 20px
padding : 5px 10px 15px ; top padding 5px
right మరియు left padding ల విలువ 10px
bottom padding 15px
padding : 5px 10px ; top మరియు bottom padding ల విలువ 5px
right మరియు left padding ల విలువ 10px
padding : 5px ; top, right, bottom మరియు left ల యొక్క అనగా అన్నింటి యొక్క విలువ 5px అని అర్థం

తదుపరి CSS Boxmodel Property గురించి...

<< Previous Next >>
Back to Top