क्या आप भी अपने पैराग्राफ के लिए आई-मैजिक बैकग्राउंड का प्रयोग करना चाहते हैं ?

इस पोस्ट का टाइटल देख कर चौंक गए !

   जी हाँ ! ये सच है खासकर नए ब्लॉगर के लिए तो सचमुच ही ये आश्चर्यजनक होगा परन्तु पुराने ब्लॉगर के लिए भी ज्यादा न हो तो थोड़ा सा तो आश्चर्यजनक होगा | जिनको यकीन न हो वो मेरी पिछली पोस्ट पर इस प्रकार की बैकग्राउंड लगी देख सकते हैं |

     यदि आप भी चाहते हैं इस प्रकार की बैकग्राउंड अपने ब्लॉग के पैराग्राफ पर प्रयोग करना ! तो बहुत ही आसान है इस का प्रयोग | HTML की कोई ज्यादा जानकारी की जरूरत नहीं |

पहला स्टेप : बस आप निम्नलिखित कोड कापी कीजिये | आप इस निम्न बाक्स में दिखाई दे रहे कोड को टेम्पलेट के एडिट मोड में जाए बिना भी लगा सकते हैं |

<style type="text/css"> .vaneet {position:relative;width:545px;font-size:17px; line-height:25px;text-align:justify;padding:1em 1.5em; margin:2em auto;color:#fff;background:#1B6A05;overflow:hidden;} .vaneet:before {content:"";position:absolute;top:0;right:0; border-width:0 25px 25px 0;border-style:solid; border-color:#fff #fff #658E15 #658E15;background:#658E15; -webkit-box-shadow:0 1px 1px rgba(0,0,0,0.3), -1px 1px 1px rgba(0,0,0,0.2); -moz-box-shadow:0 1px 1px rgba(0,0,0,0.3), -1px 1px 1px rgba(0,0,0,0.2); box-shadow:0 1px 1px rgba(0,0,0,0.3), -1px 1px 1px rgba(0,0,0,0.2); display:block; width:0; /* Firefox 3.0 damage limitation */} .vaneet.rounded {-webkit-border-radius:5px 0 5px 5px; -moz-border-radius:5px 0 5px 5px; border-radius:5px 0 5px 5px;} .vaneet.rounded:before {border-width:8px; border-color:#fff #fff transparent transparent; -webkit-border-bottom-left-radius:5px; -moz-border-radius:0 0 0 5px;border-radius:0 0 0 5px;} .nagpal {position:relative;width:545px;font-size:17px; line-height:25px;text-align:justify;padding:1em 1.5em; margin:2em auto;color:#fff;background:#6F0352;overflow:hidden;} .nagpal:before {content:"";position:absolute;top:0; right:0;border-width:0 25px 25px 0;border-style:solid; border-color:#fff #fff #B50485 #B50485;background:#B50485; -webkit-box-shadow:0 1px 1px rgba(0,0,0,0.3), -1px 1px 1px rgba(0,0,0,0.2); -moz-box-shadow:0 1px 1px rgba(0,0,0,0.3), -1px 1px 1px rgba(0,0,0,0.2); box-shadow:0 1px 1px rgba(0,0,0,0.3), -1px 1px 1px rgba(0,0,0,0.2); display:block; width:0; /* Firefox 3.0 damage limitation */} .nagpal.rounded {-webkit-border-radius:5px 0 5px 5px; -moz-border-radius:5px 0 5px 5px;border-radius:5px 0 5px 5px;} .nagpal.rounded:before {border-width:8px; border-color:#fff #fff transparent transparent; -webkit-border-bottom-left-radius:5px; -moz-border-radius:0 0 0 5px;border-radius:0 0 0 5px;} </style>

दूसरा स्टेप : यदि आप इस कोड को टेम्पलेट के एडिट मोड में जाए बिना प्रयोग करना चाहते हैं तो इस कोड को कापी करने के बाद "HTML/JAVA SCRIPT" विजेट का चयन करें व ये कोड इस विजेट में पेस्ट कर दें | "HTML/JAVA SCRIPT" का स्क्रीनशाट आप निम्न तस्वीर में देख सकते हैं | यदि ये प्रक्रिया आपने आसानी से पूरी कर ली तो बस आपको एक और स्टेप और पूरा करना होगा |

तीसरा स्टेप :
अब आप पर्पल रंग की बैकग्राउंड के लिए इस कोड का इस्तेमाल करेंगे :-

<p class="nagpal rounded">अपना टेक्स्ट यहाँ पर लिखें </p>


व हरे रंग की बैकग्राउंड के लिए निम्न कोड का इस्तेमाल करेंगे :-

<p class="vaneet rounded">अपना टेक्स्ट यहाँ पर लिखें </p>

ई-मेल मी

क्या आपको ये आई-मैजिक अंदाज़ पसंद आया ? यदि हां !!! तो अपने विचारों से अवगत कराएं | हैपी ब्लॉगगिंग !!!!!

"टिप्स हिन्दी में ब्लॉग" की हर नई जानकारी अपने मेल-बॉक्स में मुफ्त पाएं !!!!!!!!!!