Computer >> कंप्यूटर ट्यूटोरियल >  >> प्रोग्रामिंग >> CSS

CSS से आउटलाइन स्टाइल को सॉलिड सिंगल लाइन बनाना

परिचय

`outline-style: solid` आउटलाइन को ठोस एकल रेखा बनाता है।

उदाहरण

<html>
<head>
    <style>
        .solid-outline {
            outline-width: 3px;
            outline-style: solid;
            outline-color: #0066cc;
            padding: 20px;
            margin: 20px;
        }
    </style>
</head>
<body>
    <p class="solid-outline">
        इस टेक्स्ट में 3px सॉलिड आउटलाइन है।
    </p>
</body>
</html>

शॉर्टहैंड

outline: 3px solid #0066cc;

सभी आउटलाइन स्टाइल्स

  • `none` / `hidden` - कोई आउटलाइन नहीं
  • `dotted` - बिंदीदार
  • `dashed` - धराशरेखा
  • `solid` - ठोस रेखा
  • `double` - दोहरी रेखा
  • `groove` - खांचेदार (3D)
  • `ridge` - उभरी हुई (3D)
  • `inset` - अंदर धंसा (3D)
  • `outset` - बाहर उभरा (3D)
  1. CSS से आउटलाइन बटन कैसे स्टाइल करें? CSS से आउटलाइन बटन कैसे स्टाइल करें?

    CSS से आउटलाइन बटन स्टाइल करने का कोड निम्नलिखित है:उदाहरण<!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1" /> <style> button {    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, san

  1. CSS से hr एलिमेंट स्टाइल करना CSS से hr एलिमेंट स्टाइल करना

    hr स्टाइलिंग CSS से <hr> एलिमेंट को स्टाइल करने के लिए निम्न कोड उपयोग करें: उदाहरण <!DOCTYPE html> <html> <meta name=viewport content=width=device-width, initial-scale=1> <head> <style> body{ font-family: Segoe UI, Tahoma, Geneva, Verdana, sans-serif; margin: 20

  1. CSS से लेबल्स स्टाइल करना CSS से लेबल्स स्टाइल करना

    लेबल स्टाइल्स CSS से लेबल्स स्टाइल करने के लिए निम्न कोड उपयोग करें: उदाहरण <!DOCTYPE html> <html> <head> <meta name=viewport content=width=device-width, initial-scale=1 /> <style> body { font-family: Segoe UI, Tahoma, Geneva, Verdana, sans-serif; margin: 20px; } span