Table of Contents
HTML style attribute
style attribute के उपयोग से HTML के Elements के लिए style set की जाती है| HTML style attribute का उपयोग खास करके सभी elements <div>,<h1>,<p>,<ul>,<li> जैसे सभी element में style attribute का उपयोग करते inline css property add कर सकते है| जिसकी वजह से हमारे elements की desing सेट कर सकते है|
syntax :
style = "property:value;"
CSS font-size
style attribute में font-size css property से text का font size set कर सकते है| HTML element के opening tag के साथ जैसे की <h1>,<p>,<span> में font-size css property सेट कर सकते है|
<p style="font-size:25px">Font size of text</p>
output
Font size of text
CSS color
style attribute में css कि color property add करके text का color सेट कर सकते है|
<div style="color:red">color of text</div>
output
CSS background-color
style attribute में css कि background-color property add करके किसीबी element के background में background color सेट करने के लिए किया जाता है|
<div style="background-color:red">background color of text</div>
output
CSS background-image
style attribute में css कि background-image property add करके element के background में background image सेट करने के लिए किया जाता है|
<div style="background-image:url("/blog/wp-content/uploads/2021/01/HTML-Style-Attribute.jpg")"></div>
text-align
style attribute में css कि text-align property add करके element में text aligment सेट कर सकते है | element में text को center में right-left करने के लिए text-align property का उपयोग होता है|
<div style="text-align:center">Set text into center</div>
output
OR
<div style="text-align:center">Set text into right side</div>
output
OR
<div style="text-align:left">Set text into left side</div>
output
text-decoration
style attribute में css की text-decoration property, text को decorated करने के लिए उपयोग होता है| text decorate का मतलब की text में underline ,overline ,line-through जैसी line इस property से set कर सकते है|
<div style="text-decoration:overline">text decorated css property</div>
output
OR
<div style="text-decoration:underline">text decorated css property</div>
output
OR
<div style="text-decoration:line-through">text decorated css property</div>
output
letter-spacing
letter-spacing property text के character के बीच में space increases और decreases करने के लिए उपयोग होता है|
<div style="letter-spacing:2px;">text letter spacing css property</div>
output
OR
<div style="letter-spacing:-2px;">text letter spacing css property</div>
output
line-height
css की line-height property line box की height specified करती है| line-height property के लिए negative value को add नहीं किया जाता |
<div style="line-height:6px;">text line-height css property<br> the new line of the testing</div>
output
the new line of the testing
OR
<div style="line-height:15px;">text line-height css property<br> the new line of the testing</div>
output
the new line of the testing
text-direction
css direction property block-level element में text direction/writing direction specified करता है| element में text की direction right to left और left to right में set कर सकते है
<div style="direction:rtl">text direction css property</div>
output
OR
<div style="direction:ltr">text direction css property</div>
output
text-shadow
css कि text-shadow property text का shadow add करने के लिए उपयोग होता है|
<div style="text-shadow:2px 2px 5px blue">text shadow css property</div>
output
font-family
css की font-family property element के लिए font specified करता है| font-family जैसे की Times New Roman, sans-serif, etc..
<div style="font-family:Times New Roman">font family css property</div>
output
OR
<div style="font-family:sans-serif">font family css property</div>
output