Skip to content

Commit 95a4099

Browse files
committed
moved optional tag upward
1 parent 92841b5 commit 95a4099

File tree

1 file changed

+28
-23
lines changed

1 file changed

+28
-23
lines changed

areas/html.html

Lines changed: 28 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -71,21 +71,24 @@ <h2>HTML related interview questions</h2>
7171
<li><a href="#scopped">can you apply css to a part of html document only?</a></li>
7272
<li><a href="#http_request">Will browser make http request for the following case?</a></li>
7373
<li><a href="#download_order">Which resource would be downloaded first?</a></li>
74-
<li><a href="#standard_quirks">Explain standard and quirks mode.</a></li>
74+
<li><a href="#optional_tag">What is optional tag?</a></li>
7575
<li><a href="#div_span">What are the differences between div and span?</a></li>
7676
<li><a href="#div_section_article">How you would differentiate div, section and article?</a></li>
7777
<li><a href="#svg_canvas">How to select svg or canvas for your site?</a></li>
7878
<li><a href="#mtuli_lang">How to serve html in multiple language?</a></li>
79-
<li><a href="#optional_tag">What is optional tag?</a></li>
79+
<li><a href="#standard_quirks">Explain standard and quirks mode.</a></li>
8080
<li><a href="#semantic_html">Array methods in string?</a></li>
8181
</ol>
8282
<div id="doctype">
8383
<h2>1. doctype</h2>
8484
<p><strong>Question:</strong> What is doctype? why do u need it?</p>
8585
<p><strong>Answer:</strong> doctype is a instruction to the browser to inform about the version of html and how browser should render it.</p>
8686
<p>It ensures how element should be displayed on the page by most of the browser. And it also makes browsers life easier. otherwise, browser will guess and will go to <a href="http://en.wikipedia.org/wiki/Quirks_mode">quirks mode</a>. Moreover, doctype is required to <a href="http://validator.w3.org/">validate markup</a>.</p>
87-
<p><strong>extra:</strong> this the first tag of html file, dont need a closing tag and not case senstitive.</p>
88-
87+
<pre><code>
88+
&lt;!DOCTYPE html&gt;
89+
&lt;meta charset=&quot;UTF-8&quot;&gt;
90+
</code></pre>
91+
<p><strong>extra:</strong> this the first tag of html file, dont need a closing tag and not case senstitive.</p>
8992
ref: <a href="http://www.w3.org/QA/Tips/Doctype">don't forget doctype</a>, <a href="http://www.2ality.com/2012/06/dense-arrays.html">Sparse vs Dense Array</a>
9093
</div>
9194
<div id="data_attribute">
@@ -117,6 +120,7 @@ <h2>4. bdo</h2>
117120
</code></pre>
118121
<strong>result:</strong>
119122
<p><bdo dir="rtl">This text will go right to left.</bdo></p>
123+
<p><strong>extra:</strong> rtl: right to left. and alternatively you can use, ltr: left to right</p>
120124
</div>
121125
<div id="mark">
122126
<h2>5. mark</h2>
@@ -143,7 +147,8 @@ <h2>7. http requst </h2>
143147
<pre><code>
144148
&lt;div style=&quot;display: none;&quot;&gt;<br/> &lt;img src=&quot;mypic.jpg&quot; alt=&quot;My photo&quot;&gt;<br/>&lt;/div&gt;
145149
</code></pre>
146-
<P><strong>Answer:</strong> yes</P>
150+
<P><strong>Answer:</strong> yes</P>
151+
<p>ref: <a href="http://davidshariff.com/quiz/">David Shariff: quiz</a></p>
147152
</div>
148153
<div id="download_order">
149154
<h2>8. download order</h2>
@@ -160,12 +165,21 @@ <h2>8. download order</h2>
160165

161166
ref: <a href="http://davidshariff.com/quiz/">David Shariff: quiz</a>
162167
</div>
163-
<h1>Old School questions</h1>
164-
<div id="standard_quirks">
165-
<h2>9. standar & quirks mode</h2>
166-
<p><strong>Question:</strong> Difference between standard mode and quirks mode</p>
167-
<p><strong>Answer:</strong> quriks mode in browser allows u to render page for as old browsers. This is for backward compatibility.</p>
168+
<div id="optional_tag">
169+
<h2>9. self closing tag</h2>
170+
<p><strong>Question:</strong>What are optional closing tag? and why would u use it?</p>
171+
<p><strong>Answer:</strong> p, li, td, tr, th, html, body, etc. you dont have to provide end tag. whenever browser hits a new tag it automatically ends the previous tag. However, you have to be careful to escape it</p>
172+
<p><strong>reason:</strong> you can save some byte and reduce bytes needs to be downloaded in a html file.</p>
173+
<pre><code>
174+
&lt;p&gt;Some text<br/>&lt;p&gt;Some more text<br/>&lt;ul&gt;<br/> &lt;li&gt;A list item<br/> &lt;li&gt;Another list item<br/>&lt;/ul&gt;
175+
</code></pre>
176+
<p> the above html will be parsed as the following blocks</p>
177+
<pre><code>
178+
&lt;p&gt;Some text&lt;/p&gt;<br/>&lt;p&gt;Some more text&lt;/p&gt;<br/>&lt;ul&gt;<br/> &lt;li&gt;A list item&lt;/li&gt;<br/> &lt;li&gt;Another list item&lt;/li&gt;<br/>&lt;/ul&gt;
179+
</code></pre>
180+
<p>ref: <a href="http://www.w3.org/TR/REC-html40/index/elements.html">W3.org: index of elements</a> </p>
168181
</div>
182+
<h1>Old School questions</h1>
169183
<div id="div_span">
170184
<h2>10. span vs div</h2>
171185
<p><strong>Question:</strong> What is the difference between span, div?</p>
@@ -194,19 +208,10 @@ <h2>13. multiple languages</h2>
194208
<p><strong>Answer:</strong> CMS could be used to deliver content in different language with same structure and style.</p>
195209
<p>ref: <a href="https://github.com/johnpolacek/Front-end-Developer-Interview-Questions/blob/master/README.md">john polacek</a> </p>
196210
</div>
197-
<div id="optional_tag">
198-
<h2>14. self closing tag</h2>
199-
<p><strong>Question:</strong>What are optional closing tag? and why would u use it?</p>
200-
<p><strong>Answer:</strong> p, li, td, tr, th, html, body, etc. you dont have to provide end tag. whenever browser hits a new tag it automatically ends the previous tag. However, you have to be careful to escape it</p>
201-
<p><strong>reason:</strong> you can save some byte and reduce bytes needs to be downloaded in a html file.</p>
202-
<pre><code>
203-
&lt;p&gt;Some text<br/>&lt;p&gt;Some more text<br/>&lt;ul&gt;<br/> &lt;li&gt;A list item<br/> &lt;li&gt;Another list item<br/>&lt;/ul&gt;
204-
</code></pre>
205-
<p> the above html will be parsed as the following blocks</p>
206-
<pre><code>
207-
&lt;p&gt;Some text&lt;/p&gt;<br/>&lt;p&gt;Some more text&lt;/p&gt;<br/>&lt;ul&gt;<br/> &lt;li&gt;A list item&lt;/li&gt;<br/> &lt;li&gt;Another list item&lt;/li&gt;<br/>&lt;/ul&gt;
208-
</code></pre>
209-
<p>ref: <a href="http://www.w3.org/TR/REC-html40/index/elements.html">W3.org: index of elements</a> </p>
211+
<div id="standard_quirks">
212+
<h2>14. standar & quirks mode</h2>
213+
<p><strong>Question:</strong> Difference between standard mode and quirks mode</p>
214+
<p><strong>Answer:</strong> quriks mode in browser allows u to render page for as old browsers. This is for backward compatibility.</p>
210215
</div>
211216
<div id="semantic_html">
212217
<h2>15. semantic</h2>

0 commit comments

Comments
 (0)