Easiest way to write html code:Emmet

use of emmet in html, what is doctype in html, what is meta tag and its element explanation how write code in speedy html fast, parent child,sibling brotherhood, multiplication of tag in short form,grouping, element[attribute]duplicate up and down

Html, css में कोड ओपेन टैग और close टैग के रूप में लिखा जाता है। Emmet के आ जाने से developer को कोड लिखना आसान हो गया है। बार-बार वही टैग लिखने की जरूरत नहीं पड़ती है। Emmet के माध्यम से कुछ character लिखते ही बाकी के closing tag वगैरह खुद ही आ जाते हैं।

what is emmet in hindi?advantages of emmet in hindi

Emmet एक तरह की coding की लिखावट है, जो थोड़े बहुत character के लिखने के बाद ही पूरी कोडिंग लिख देती है। अब कई तरह के websites पर बने बनाये Emmet उपलब्ध हो जाते हैं। पर text editor में बहुत आसानी से shortcut इस्तेमाल करके emmet लिखा जा सकता है। 1. यह developer का बहुत समय बचा देता है। 2. developer को कम keys दबाने पड़ते हैं। 3. Emmet auto completion की सुविधा प्रदान करता है, जिससे closing tag वगैरह स्वतः लग जाते हैं।

Shortcuts of emmet in hindi:

Shortcut of Id/class:

उदाहरण के लिए यदि हमें p में class लगानी है, तो p.class name लिखना होता है। और फिर tab press किया जाता है, तो यह स्वतः ही लिख जाता है। मान लीजिए class name header है, तो <p class="header"></p> लिख उठता है। और यह Emmet आ जाता है। उसी तरह Id p#id name लिखा जाता है, और फिर tab press किया जाता है। मान लीजिए id name footer है, तो <p id="footer"></p> लिख उठता है।
Shortcut of element[attribute]:

इस तरह के शार्टकट emmet में element और उसके साथ उसका attribute [] में लिख कर tab दबाया जाता है। उदाहरण के लिए p[class="para"] के बाद tab दबाया जाता है, तो <p class="para"></p> लिख उठता है।
Shortcut of element{content}:

मान लीजिए Html में पैराग्राफ में anurag tiwari िलखना है, तो p{anurag tiwari} लिखकर Tab press किया जाता है। और फिर <p>anurag tiwari</p> लिख उठता है।
Shortcut of Parent-child:

जब हमें टैग के अंदर टैग इंसर्ट कराने होते हैं, तो parent-child बनाते हैं। उदाहरण के लिए Div के अंदर पैराग्राफ और div बनाने के लिए div>div>p लिखकर जब Tab press किया जाता है, तो

<div>

<div>

<p>

</p>

</div>

</div>

emmet इंसर्ट हो जाता है।
Shortcut of brotherhood/Siblings:

कई सारे टैग को एक ही लेवल में लिखने के लिए + का प्रयोग करते हैं। जैसे p+li+li लिखकर टैब दबाने पर <p></p>

<li></li>

<li></li>

लिख उठता है।
Multiplication shortcut in hindi:

एक ही टैग को कई बार लिखने के लिए उस टैग के साथ और जितनी बार लिखना हो, उतना नंबर लिखा जाता है। उदाहरण के लिए li * 3 लिखकर Tab press करने पर

<li> </li>

<li> </li>

<li> </li>

लिख उठता है।
Grouping shortcut:

इस तरीके में सबको मिलाकर shortcut में लिखा जाता है। जैसे div>(div>p) + li * 2 लिखकर Html में Tab press करने पर

<div>

<div>

<p> </p>

</div>

<li></li>

<li></li>

</div>

emmet इंसर्ट हो जाता है।
Shortcut for Html Boiler plate:

Html फाइल की शुरुआत करते समय जब ! लिखकर Tab press किया जाता है, तो Html Boiler plater कुछ इस तरह से इंसर्ट हो जाता है।

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<meta http-equiv="X-UA-Compatible" content="IE=edge">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<title>Document</title>

</head>

<body>

</body>

</html>