CSS में border -style property का उपयोग करके आप किसी भी HTML element का border define कर सकते हो। जानकारी के लिए बता दे by default border की width 3px होती है।
Syntax
p{
border-style : style_name;
}
Example
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>CSS background Example by Technalay</title> </head> <body> <p style="border-style:solid">CSS background Example by Technalay</p> </body> </html>
Type of CSS border-style in Hindi
CSS में किसी भी HTML element का border define करते समय आप इसे अलग- अलग प्रकार से style दे सकते है। जो इस प्रकार है :
- solid
- dotted
- dashed
- double
- groove
- ridge
- inset
- outset
- hidden
- none
solid
dotted
dashed
double
groove
ridge
inset
outset
none
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>CSS background Example by Technalay</title> </head> <body> <p style="border-style:solid">solid</p> <p style="border-style:dotted">dotted</p> <p style="border-style:dashed ">dashed</p> <p style="border-style:double">double</p> <p style="border-style:groove">groove</p> <p style="border-style:ridge">ridge</p> <p style="border-style:inset">inset</p> <p style="border-style:outset">outset</p> <p style="border-style:hidden">hidden</p> <p style="border-style:none">none</p> </body> </html>
CSS specify border-style for every side in Hindi
ऊपर में आपने देखा की जो border हम बनाये वो चारो side से same होता है। अब हम जानेंगे कि आगे border के चारो side को अलग – अलग design करना चाहे तो कुछ इस तरह से कर सकते है :
Syntax
{
border-style : top_style right_style bottom_style left_style;
}
Example
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>CSS background Example by Technalay</title> </head> <body> <p style="border-style:solid">solid</p> <p style="border-style:dotted">dotted</p> <p style="border-style:dashed ">dashed</p> <p style="border-style:double">double</p> <p style="border-style:groove">groove</p> <p style="border-style:ridge">ridge</p> <p style="border-style:inset">inset</p> <p style="border-style:outset">outset</p> <p style="border-style:hidden">hidden</p> <p style="border-style:none">none</p> </body> </html>
2 thoughts on “CSS Border in Hindi”