HomeBlogger

10 Best and Stylish Sub Heading Design For Blogger Posts

Like Tweet Pin it Share Share Email
10 Best and Stylish Sub Heading Design For Blogger Posts जब भी कोई ब्लॉगर पोस्ट लिखता है तो वो चाहता है की उसका पोस्ट Professional दिखे और उसमे कोई गलती नही हो .पोस्ट के important part को highlight करने के लिए वो Sub-Heading का use करता है जिससे Readers भी उस पोस्ट को आसानी से पढ़ पाते हैं . लेकिन Blogger के अधिकतर Templates में Sub-Heading के लिए कोई ख़ास Design नही रहता है ऐसे में वह Sub-Heading को Customize करना चाहता है .
इसलिए यहाँ मै 10 Best और Stylish Sub-Heading Design दे रहा हूँ जिसे add कर आप अपने ब्लॉग को एक अलग Look दे सकते हैं .
आपको अपने  ब्लॉग में इनमे से कोई एक CSS Code Add करना है .Code add करने के लिए आप दिए गए steps फॉलो करें .
10 best and stylish subheading design for blogger

 

How to add Stylish Subheading in Blogger

Step 1. अपने blogger account में Log in कर Dashboard में जाएँStep 2. अब Template में जाकर Edit HTML को Select करें .

Step 3. फिर Ctrl+F दबाएँ और </b:skin> Search करें

Step 4. अब निचे दिए गए कोड्स में से कोई भी कोड copy करें और उसे </b:skin> के ऊपर Paste करें .

10 Stylish Subheading Design For Blogger Blog

Style 1

blogger stylish subheading


.post h3{margin-top:10px;max-width:95%;padding:6px 2px;color:#000000;padding-left:10px;margin-bottom:10px;font-size:20px;font-family:’Oswald’,sans-serif;background-color:#F8FAFD;text-decoration:none;border-left:10px solid #05A8FC;box-shadow:1px 1px 2px gainsboro;transition:border-left .777s;-webkit-transition:border-left .777s;-moz-transition:border-left .777s;-o-transition:border-left .777s;-ms-transition:border-left .777s}.post h3:hover{border-left:10px solid #FC2B2C}
Style 2

stylish and best subheading for blogger


.post h3{
background: #F9F9F9;
font-family:’Oswald’,sans-serif;
font-size: 120%;
padding: 6px 12px;
color: #333;
text-shadow: 1px 1px 1px #AAA;
border-bottom: 4px solid #03DA03;
-webkit-border-radius: 0 0 6px 6px;
-moz-border-radius: 0 0 6px 6px;
border-radius: 0 0 6px 6px;
-webkit-box-shadow: 1px 1px 2px #AAA;
-moz-box-shadow: 1px 1px 2px #AAA;
box-shadow: 1px 1px 2px #AAA;
margin: 6px 3px;
text-transform: capitalize;
width: 95%;
line-height:1.0em;
}
.post h3:hover {
border-bottom: 4px solid #003F80;
}

Style 3

stylish subheading for blogger blog

 

.post h3 {
border:3px dashed #000000;
border-bottom:5px solid #000000;
padding: 0px 1px 4px 14px;
box-shadow: rgb(251, 10, 38) 3px 3px 3px;
color: rgb(251, 10, 38);
font-family:’Oswald’,sans-serif;
font-size:110%;
font-weight:400;
margin: 0px 0px 1em;
text-transform: uppercase;
text-shadow: rgb(0, 0, 0) 1px 1px 0px;
}

Style 4

Stylish subheading design for blogger
.post h3 {
padding:5px;
border:5px outset #000000;
color:#000000;
font:140% ‘Oswald’,Sans-Serif;
}

Style 5

10 stylish subheading for blogger


.post h3 {
padding:5px;
border:5px dashed #000000;
color:#000000;
font:140% ‘Oswald’,Sans-Serif;
}

Style 6


Blogger ke liye stylish Subheading


.post h3 {
padding:5px;
border: 1px solid #cccccc;
-moz-box-shadow: 0 0 20px rgba(0, 0, 0, .2);
-webkit-box-shadow: 0 0 20px rgba(0, 0, 0, .2);
box-shadow: 0 0 20px rgba(0, 0, 0, .2);
color:#333333;
font:140% ‘Oswald’,Sans-Serif;
text-transform: uppercase;
}

Style 7


10 awesome subheading design for blogger


.post h3 {
border-bottom-right-radius: 15px;
border-top-left-radius: 15px;
border: 3px solid rgb(251, 10, 38);
padding: 0px 1px 4px 14px;
box-shadow: rgb(251, 10, 38) 3px 3px3px;
color: rgb(251, 10, 38);
font-family:’Oswald’,sans-serif;
font-size:120%;
font-weight:400;
margin: 0px 0px 1em;
text-transform: uppercase;
text-shadow: rgb(0, 0, 0) 1px 1px 0px;
}

Style 8


10 stylish sbheading design for blogger blog


.post h3 {
color:#222222;
border-left:10px solid #222222;
border-right:10px solid #222222;
padding:3px 5px 3px 20px;
border-radius:15px;
-moz-border-radius:15px;
box-shadow:0px 0px 13px #222222;
-webkit-box-shadow:0px 0px 13px #222222;
-moz-box-shadow:0px 0px 13px #222222;
}
.post h3:hover {
color:#219DFC;
border-left:10px solid #219DFC;
border-right:10px solid #219DFC;
box-shadow:0px 0px 13px #219DFC;
-webkit-box-shadow:0px 0px 13px #32A4FC;
-moz-box-shadow:0px 0px 13px #32A4FC;
}

Style 9


10 best and stylish blogger subheading design


.post h3 {
padding:5px;
border:5px dotted rgb(251, 10, 38);
color:#000000;
font:140% ‘Oswald’,Sans-Serif;
}

Style 10


10 stylish subheading design for blogger


.post h3 {
background:#333;
margin:5px 4px 5px 0;
padding:9px 0 9px 10px;
border:0;
color:white;
font-size:120%;
line-height:16px;
font-family:’Oswald’,sans-serif;
text-decoration:none;
text-transform:uppercase;
box-shadow:4px 4px 0px rgba(33,33,33,0.45);
}

आपको इन 10 Css Codes में से कोई एक Code  </b:skin> के ऊपर Paste करना है . यदि आपके Template में पहले से ही .post h3 का CSS Code है तो सबसे पहले उसे Remove करें और फिर इनमे से कोई एक कोड add करें .
आपको यदि Code Install करने में कोई Problem आ रही है तो निचे Comment करें .

हमारे फेसबुक पेज को लाइक करें – Techredefining On FB

Comments (1)

Leave a Reply

Your email address will not be published. Required fields are marked *

%d bloggers like this: