Virtual Study Solutions: Block and Inline Elements

<div dir="ltr" style="text-align: left;" trbidi="on">
<h3 style="text-align: left;">
<span style="font-family: "verdana" , sans-serif;">HTML Block and Inline Elements</span></h3>
<span style="font-family: "verdana" , sans-serif;">Here we will discuss HTML Block and Inline Elements. Every HTML element has a default display value depending on what type of element it is. The default display value for most elements is block or inline. Previously we </span><span style="font-family: Verdana, sans-serif;">shared <a href="http://virtualstudysolutions.blogspot.com/2017/04/html-tags-with-examples-complete.html">HTML Tags with Examples Complete Tutorial</a>.</span><br />
<span style="font-family: "verdana" , sans-serif;"><b><br /></b></span>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjIABSF8YtAnWZcow2I8g7X7JajyrjNYepuWSQiJq-zAGoj-ge_aquFgubzTDoNdVZg74k7-V0fX7uQg9SxrOvjdUzoxL60NQ1W0q47DoQjLcBY1pQj0-qWij8tbKPvZZBGwANnjXzy1BU/s1600/CS101+-+HTML+Block+and+Inline+Elements.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="CS101 - HTML Block and Inline Elements" border="0" data-original-height="243" data-original-width="478" height="203" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjIABSF8YtAnWZcow2I8g7X7JajyrjNYepuWSQiJq-zAGoj-ge_aquFgubzTDoNdVZg74k7-V0fX7uQg9SxrOvjdUzoxL60NQ1W0q47DoQjLcBY1pQj0-qWij8tbKPvZZBGwANnjXzy1BU/s400/CS101+-+HTML+Block+and+Inline+Elements.png" title="CS101 - HTML Block and Inline Elements" width="400" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><span style="font-family: "verdana" , sans-serif;">CS101 - HTML Block and Inline Elements</span></td></tr>
</tbody></table>
<div>
<h4 style="text-align: left;">
<span style="font-family: "verdana" , sans-serif;">Block-level Elements</span></h4>
<span style="font-family: "verdana" , sans-serif;">A block-level element always starts on a new line and takes up the full width available (stretches out to the left and right as far as it can).<br /><br />The <b><div></b> element is a block-level element.<br /><br /><b>Examples of block-level elements</b>: </span><br />
<ul style="text-align: left;"><span style="font-family: "verdana" , sans-serif;">
<li><div> </li>
<li><h1> - <h6> </li>
<li><p> </li>
<li><form></li>
</span></ul>
<span style="font-family: "verdana" , sans-serif;">
</span><br />
<h4 style="text-align: left;">
<span style="font-family: "verdana" , sans-serif;">Inline Elements</span></h4>
<span style="font-family: "verdana" , sans-serif;">An inline element does not start on a new line and only takes up as much width as necessary.<br /><br />This is an inline <b><span></b> element inside a paragraph.<br /><br /><b>Examples of inline elements: </b></span><br />
<ul style="text-align: left;"><span style="font-family: "verdana" , sans-serif;">
<li><span> </li>
<li><a> </li>
<li><img> </li>
</span></ul>
<span style="font-family: "verdana" , sans-serif;">
</span><br />
<h4 style="text-align: left;">
<span style="font-family: "verdana" , sans-serif;">The <div> Element</span></h4>
<span style="font-family: "verdana" , sans-serif;">The <div> element is often used as a container for other HTML elements.<br />The <div> element has no required attributes, but both style and class are common.<br />When used together with CSS, the <div> element can be used to style blocks of content:<br /><br /><b>Example:</b><br /><br /><div style="background-color: black; color:white; padding: 20px;"><br />   <h2>ISLAMABAD</h2><br />   <p>Islamabad is the capital city of Pakistan located within the federal Islamabad Capital Territory. With a population of two million, it is the 10th largest city of Pakistan.</p><br /> </div></span><br />
<h4 style="text-align: left;">
<span style="font-family: "verdana" , sans-serif;">The <span> Element</span></h4>
<span style="font-family: "verdana" , sans-serif;">The <span> element is often used as a container for some text.<br />The <span> element has no required attributes, but both style and class are common.<br />When used together with CSS, the <span> element can be used to style parts of the text:</span><br />
<div>
<span style="font-family: "verdana" , sans-serif;"><br /><b>Example</b><br /><h1>My <span style="color:red">Important</span> Heading</h1></span><br />
<h4 style="text-align: left;">
<span style="font-family: "verdana" , sans-serif;">HTML Grouping Tags</span></h4>
<span style="font-family: "verdana" , sans-serif;"><b>Tag :</b> </span><span style="font-family: "verdana" , sans-serif;"><div> </span><span style="font-family: "verdana" , sans-serif;"><b>Description </b>: </span><span style="font-family: "verdana" , sans-serif;">Defines a section in a document (block-level) </span><span style="font-family: "verdana" , sans-serif;"><b>Tag :</b> </span><span style="font-family: "verdana" , sans-serif;"><span> </span><span style="font-family: "verdana" , sans-serif;"><b>Description :</b> </span><span style="font-family: "verdana" , sans-serif;">Defines a section in a document (inline) <br /><br /><b>Recommended :</b></span></div>
<div>
<ul style="text-align: left;">
<li><a href="http://virtualstudysolutions.blogspot.com/2016/12/cs101-mid-term-past-papers-collection-2003-2010.html" style="font-family: Verdana, sans-serif;">CS101 Mid Term Past Papers Collection 2003 to 2010</a></li>
<li><a href="http://virtualstudysolutions.blogspot.com/2015/12/cs101-subjective-past-paper-part-2.html" style="font-family: Verdana, sans-serif;">CS101 Subjective Past Paper - Part 2</a></li>
<li><a href="http://virtualstudysolutions.blogspot.com/2015/12/cs101-solved-subjective-past-papers.html" style="font-family: Verdana, sans-serif;">CS101 Solved Subjective Past Papers - Part 3</a></li>
</ul>
</div>
<div>
<span style="font-family: "verdana" , sans-serif;">For More HTML Tutorials and Short Notes Please Subscribe us below or Like us on Facebook. Thanks</span> </div>
</div>
</div>

CS101 - HTML Block and Inline Elements

HTML Block and Inline Elements Here we will discuss HTML Block and Inline Elements. Every HTML element has a default display value depend...

Virtual Study Solutions

Adsetra Ads

CS101 - HTML Block and Inline Elements

Trending

Archive