tag:blogger.com,1999:blog-78226571389860385302024-03-19T14:49:41.144-07:00Online Tutorials | Research | DevelopmentIT E-Research offers expert practice practice, instructional videos and a personalized teaching dashboard. We provide ASP.NET, PHP, Core Java, HTML, CSS, Computer Programming, History, Research, Development, Project Programming, Website courses, software engineering and many latest technologies.It E Researchhttp://www.blogger.com/profile/02660842566926994686noreply@blogger.comBlogger148125tag:blogger.com,1999:blog-7822657138986038530.post-30435599359203747412018-12-21T22:06:00.001-08:002018-12-21T22:06:12.484-08:00Jquery Properties<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjm6ABrvugKriIdzttEs7Yo67ibT4IxOz98r3JWaI9d0ku0aC7Pv0OMB8DwvMQwpSBd15LCx3VrMPe7lOjvR33yE8cqxCl0JnLLNEijHFtx1-OdxqyOlnr6RHuuP-Hu3dkY_CRIgkHkyA/s1600/jquery.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="277" data-original-width="492" height="360" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjm6ABrvugKriIdzttEs7Yo67ibT4IxOz98r3JWaI9d0ku0aC7Pv0OMB8DwvMQwpSBd15LCx3VrMPe7lOjvR33yE8cqxCl0JnLLNEijHFtx1-OdxqyOlnr6RHuuP-Hu3dkY_CRIgkHkyA/s640/jquery.jpg" width="640" /></a></div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="font-family: Arial, Helvetica, sans-serif;">We can manipulate some of the most basic components when it comes to dom elements, those elements have the assigned properties and qualities.</span><br />
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="font-family: Arial, Helvetica, sans-serif;">Most of these features are available in the form of dome nodes properties through javascript. There are some more common properties -</span><br />
<ul style="text-align: left;">
<li><span style="font-family: Arial, Helvetica, sans-serif;">className</span></li>
<li><span style="font-family: Arial, Helvetica, sans-serif;">tagName</span></li>
<li><span style="font-family: Arial, Helvetica, sans-serif;">id</span></li>
<li><span style="font-family: Arial, Helvetica, sans-serif;">href</span></li>
<li><span style="font-family: Arial, Helvetica, sans-serif;">title</span></li>
<li><span style="font-family: Arial, Helvetica, sans-serif;">rel</span></li>
<li><span style="font-family: Arial, Helvetica, sans-serif;">src</span></li>
</ul>
<div>
<pre class="result notranslate" style="background-color: #f1f1f1; border-radius: 0px; border: 1px solid rgb(214, 214, 214); box-sizing: border-box; color: #313131; font-size: 12px; overflow: auto; padding: 5px; width: 604px;"><span style="font-family: Arial, Helvetica, sans-serif;"><img id = "imageid" src = "image.gif" alt = "Image" class = "myclass"
title = "This is an image"/></span></pre>
</div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><b>Get property values</b></span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;">The Attr () method can be used to either match the set or set attribute values in the value of an attribute from the first element.</span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><b>Examples</b></span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;">The following is a simple example, which gets the title attribute with <em> tag and set <div id = "split"> same value -</span></div>
</div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<pre class="prettyprint notranslate prettyprinted" style="background-color: #eeeeee; border-radius: 0px; border: 1px solid rgb(214, 214, 214); box-sizing: border-box; color: #313131; font-size: 13px; line-height: 16px; margin-bottom: 10px; margin-top: 15px; overflow: auto; padding: 5px; width: 604px;"><span style="font-family: Arial, Helvetica, sans-serif;"><span class="tag" style="box-sizing: border-box; color: #000088;"><html></span><span class="pln" style="box-sizing: border-box;">
</span><span class="tag" style="box-sizing: border-box; color: #000088;"><head></span><span class="pln" style="box-sizing: border-box;">
</span><span class="tag" style="box-sizing: border-box; color: #000088;"><title></span><span class="pln" style="box-sizing: border-box;">The jQuery Example</span><span class="tag" style="box-sizing: border-box; color: #000088;"></title></span><span class="pln" style="box-sizing: border-box;">
</span><span class="tag" style="box-sizing: border-box; color: #000088;"><script</span><span class="pln" style="box-sizing: border-box;"> </span><span class="atn" style="box-sizing: border-box; color: #7f0055;">type</span><span class="pln" style="box-sizing: border-box;"> </span><span class="pun" style="box-sizing: border-box; color: #666600;">=</span><span class="pln" style="box-sizing: border-box;"> </span><span class="atv" style="box-sizing: border-box; color: #008800;">"text/javascript"</span><span class="pln" style="box-sizing: border-box;">
</span><span class="atn" style="box-sizing: border-box; color: #7f0055;">src</span><span class="pln" style="box-sizing: border-box;"> </span><span class="pun" style="box-sizing: border-box; color: #666600;">=</span><span class="pln" style="box-sizing: border-box;"> </span><span class="atv" style="box-sizing: border-box; color: #008800;">"https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"</span><span class="tag" style="box-sizing: border-box; color: #000088;">></span><span class="pln" style="box-sizing: border-box;">
</span><span class="tag" style="box-sizing: border-box; color: #000088;"></script></span><span class="pln" style="box-sizing: border-box;">
</span><span class="tag" style="box-sizing: border-box; color: #000088;"><script</span><span class="pln" style="box-sizing: border-box;"> </span><span class="atn" style="box-sizing: border-box; color: #7f0055;">type</span><span class="pln" style="box-sizing: border-box;"> </span><span class="pun" style="box-sizing: border-box; color: #666600;">=</span><span class="pln" style="box-sizing: border-box;"> </span><span class="atv" style="box-sizing: border-box; color: #008800;">"text/javascript"</span><span class="pln" style="box-sizing: border-box;"> </span><span class="atn" style="box-sizing: border-box; color: #7f0055;">language</span><span class="pln" style="box-sizing: border-box;"> </span><span class="pun" style="box-sizing: border-box; color: #666600;">=</span><span class="pln" style="box-sizing: border-box;"> </span><span class="atv" style="box-sizing: border-box; color: #008800;">"javascript"</span><span class="tag" style="box-sizing: border-box; color: #000088;">></span><span class="pln" style="box-sizing: border-box;">
$</span><span class="pun" style="box-sizing: border-box; color: #666600;">(</span><span class="pln" style="box-sizing: border-box;">document</span><span class="pun" style="box-sizing: border-box; color: #666600;">).</span><span class="pln" style="box-sizing: border-box;">ready</span><span class="pun" style="box-sizing: border-box; color: #666600;">(</span><span class="kwd" style="box-sizing: border-box; color: #000088;">function</span><span class="pun" style="box-sizing: border-box; color: #666600;">()</span><span class="pln" style="box-sizing: border-box;"> </span><span class="pun" style="box-sizing: border-box; color: #666600;">{</span><span class="pln" style="box-sizing: border-box;">
</span><span class="kwd" style="box-sizing: border-box; color: #000088;">var</span><span class="pln" style="box-sizing: border-box;"> title </span><span class="pun" style="box-sizing: border-box; color: #666600;">=</span><span class="pln" style="box-sizing: border-box;"> $</span><span class="pun" style="box-sizing: border-box; color: #666600;">(</span><span class="str" style="box-sizing: border-box; color: #008800;">"em"</span><span class="pun" style="box-sizing: border-box; color: #666600;">).</span><span class="pln" style="box-sizing: border-box;">attr</span><span class="pun" style="box-sizing: border-box; color: #666600;">(</span><span class="str" style="box-sizing: border-box; color: #008800;">"title"</span><span class="pun" style="box-sizing: border-box; color: #666600;">);</span><span class="pln" style="box-sizing: border-box;">
$</span><span class="pun" style="box-sizing: border-box; color: #666600;">(</span><span class="str" style="box-sizing: border-box; color: #008800;">"#divid"</span><span class="pun" style="box-sizing: border-box; color: #666600;">).</span><span class="pln" style="box-sizing: border-box;">text</span><span class="pun" style="box-sizing: border-box; color: #666600;">(</span><span class="pln" style="box-sizing: border-box;">title</span><span class="pun" style="box-sizing: border-box; color: #666600;">);</span><span class="pln" style="box-sizing: border-box;">
</span><span class="pun" style="box-sizing: border-box; color: #666600;">});</span><span class="pln" style="box-sizing: border-box;">
</span><span class="tag" style="box-sizing: border-box; color: #000088;"></script></span><span class="pln" style="box-sizing: border-box;">
</span><span class="tag" style="box-sizing: border-box; color: #000088;"></head></span><span class="pln" style="box-sizing: border-box;">
</span><span class="tag" style="box-sizing: border-box; color: #000088;"><body></span><span class="pln" style="box-sizing: border-box;">
</span><span class="tag" style="box-sizing: border-box; color: #000088;"><div></span><span class="pln" style="box-sizing: border-box;">
</span><span class="tag" style="box-sizing: border-box; color: #000088;"><em</span><span class="pln" style="box-sizing: border-box;"> </span><span class="atn" style="box-sizing: border-box; color: #7f0055;">title</span><span class="pln" style="box-sizing: border-box;"> </span><span class="pun" style="box-sizing: border-box; color: #666600;">=</span><span class="pln" style="box-sizing: border-box;"> </span><span class="atv" style="box-sizing: border-box; color: #008800;">"Bold and Brave"</span><span class="tag" style="box-sizing: border-box; color: #000088;">></span><span class="pln" style="box-sizing: border-box;">This is first paragraph.</span><span class="tag" style="box-sizing: border-box; color: #000088;"></em></span><span class="pln" style="box-sizing: border-box;">
</span><span class="tag" style="box-sizing: border-box; color: #000088;"><p</span><span class="pln" style="box-sizing: border-box;"> </span><span class="atn" style="box-sizing: border-box; color: #7f0055;">id</span><span class="pln" style="box-sizing: border-box;"> </span><span class="pun" style="box-sizing: border-box; color: #666600;">=</span><span class="pln" style="box-sizing: border-box;"> </span><span class="atv" style="box-sizing: border-box; color: #008800;">"myid"</span><span class="tag" style="box-sizing: border-box; color: #000088;">></span><span class="pln" style="box-sizing: border-box;">This is second paragraph.</span><span class="tag" style="box-sizing: border-box; color: #000088;"></p></span><span class="pln" style="box-sizing: border-box;">
</span><span class="tag" style="box-sizing: border-box; color: #000088;"><div</span><span class="pln" style="box-sizing: border-box;"> </span><span class="atn" style="box-sizing: border-box; color: #7f0055;">id</span><span class="pln" style="box-sizing: border-box;"> </span><span class="pun" style="box-sizing: border-box; color: #666600;">=</span><span class="pln" style="box-sizing: border-box;"> </span><span class="atv" style="box-sizing: border-box; color: #008800;">"divid"</span><span class="tag" style="box-sizing: border-box; color: #000088;">></div></span><span class="pln" style="box-sizing: border-box;">
</span><span class="tag" style="box-sizing: border-box; color: #000088;"></div></span><span class="pln" style="box-sizing: border-box;">
</span><span class="tag" style="box-sizing: border-box; color: #000088;"></body></span><span class="pln" style="box-sizing: border-box;">
</span><span class="tag" style="box-sizing: border-box; color: #000088;"></html></span></span></pre>
</div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;">Result</span></div>
<div>
<em title="Bold and Brave"><span style="font-family: Arial, Helvetica, sans-serif;">This is first paragraph.</span></em><div id="myid">
<span style="font-family: Arial, Helvetica, sans-serif;">This is second paragraph.</span></div>
<div id="divid">
<span style="font-family: Arial, Helvetica, sans-serif;">Bold and Brave</span></div>
</div>
<div id="divid">
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div id="divid">
<div id="divid">
<span style="font-family: Arial, Helvetica, sans-serif;"><b>Set property values</b></span></div>
<div id="divid">
<span style="font-family: Arial, Helvetica, sans-serif;">Attr (name, value) method can be used to set the named attribute on all elements in a wrapped set using the passed value.</span></div>
<div id="divid">
<span style="font-family: Arial, Helvetica, sans-serif;"><b><br /></b></span></div>
<div id="divid">
<span style="font-family: Arial, Helvetica, sans-serif;"><b>Examples</b></span></div>
<div id="divid">
<span style="font-family: Arial, Helvetica, sans-serif;">The following is a simple example that sets the src attribute of an image tag at a right place -</span></div>
<div id="divid">
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div id="divid">
<pre class="prettyprint notranslate prettyprinted" style="background-color: #eeeeee; border-radius: 0px; border: 1px solid rgb(214, 214, 214); box-sizing: border-box; color: #313131; font-size: 13px; line-height: 16px; margin-bottom: 10px; margin-top: 15px; overflow: auto; padding: 5px; width: 604px;"><span style="font-family: Arial, Helvetica, sans-serif;"><span class="tag" style="box-sizing: border-box; color: #000088;"><html></span><span class="pln" style="box-sizing: border-box;">
</span><span class="tag" style="box-sizing: border-box; color: #000088;"><head></span><span class="pln" style="box-sizing: border-box;">
</span><span class="tag" style="box-sizing: border-box; color: #000088;"><title></span><span class="pln" style="box-sizing: border-box;">The jQuery Example</span><span class="tag" style="box-sizing: border-box; color: #000088;"></title></span><span class="pln" style="box-sizing: border-box;">
</span><span class="tag" style="box-sizing: border-box; color: #000088;"><base</span><span class="pln" style="box-sizing: border-box;"> </span><span class="atn" style="box-sizing: border-box; color: #7f0055;">href</span><span class="pun" style="box-sizing: border-box; color: #666600;">=</span><span class="atv" style="box-sizing: border-box; color: #008800;">"https://www.tutorialspoint.com"</span><span class="pln" style="box-sizing: border-box;"> </span><span class="tag" style="box-sizing: border-box; color: #000088;">/></span><span class="pln" style="box-sizing: border-box;">
</span><span class="tag" style="box-sizing: border-box; color: #000088;"><script</span><span class="pln" style="box-sizing: border-box;"> </span><span class="atn" style="box-sizing: border-box; color: #7f0055;">type</span><span class="pln" style="box-sizing: border-box;"> </span><span class="pun" style="box-sizing: border-box; color: #666600;">=</span><span class="pln" style="box-sizing: border-box;"> </span><span class="atv" style="box-sizing: border-box; color: #008800;">"text/javascript"</span><span class="pln" style="box-sizing: border-box;">
</span><span class="atn" style="box-sizing: border-box; color: #7f0055;">src</span><span class="pln" style="box-sizing: border-box;"> </span><span class="pun" style="box-sizing: border-box; color: #666600;">=</span><span class="pln" style="box-sizing: border-box;"> </span><span class="atv" style="box-sizing: border-box; color: #008800;">"https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"</span><span class="tag" style="box-sizing: border-box; color: #000088;">></span><span class="pln" style="box-sizing: border-box;">
</span><span class="tag" style="box-sizing: border-box; color: #000088;"></script></span><span class="pln" style="box-sizing: border-box;">
</span><span class="tag" style="box-sizing: border-box; color: #000088;"><script</span><span class="pln" style="box-sizing: border-box;"> </span><span class="atn" style="box-sizing: border-box; color: #7f0055;">type</span><span class="pln" style="box-sizing: border-box;"> </span><span class="pun" style="box-sizing: border-box; color: #666600;">=</span><span class="pln" style="box-sizing: border-box;"> </span><span class="atv" style="box-sizing: border-box; color: #008800;">"text/javascript"</span><span class="pln" style="box-sizing: border-box;"> </span><span class="atn" style="box-sizing: border-box; color: #7f0055;">language</span><span class="pln" style="box-sizing: border-box;"> </span><span class="pun" style="box-sizing: border-box; color: #666600;">=</span><span class="pln" style="box-sizing: border-box;"> </span><span class="atv" style="box-sizing: border-box; color: #008800;">"javascript"</span><span class="tag" style="box-sizing: border-box; color: #000088;">></span><span class="pln" style="box-sizing: border-box;">
$</span><span class="pun" style="box-sizing: border-box; color: #666600;">(</span><span class="pln" style="box-sizing: border-box;">document</span><span class="pun" style="box-sizing: border-box; color: #666600;">).</span><span class="pln" style="box-sizing: border-box;">ready</span><span class="pun" style="box-sizing: border-box; color: #666600;">(</span><span class="kwd" style="box-sizing: border-box; color: #000088;">function</span><span class="pun" style="box-sizing: border-box; color: #666600;">()</span><span class="pln" style="box-sizing: border-box;"> </span><span class="pun" style="box-sizing: border-box; color: #666600;">{</span><span class="pln" style="box-sizing: border-box;">
$</span><span class="pun" style="box-sizing: border-box; color: #666600;">(</span><span class="str" style="box-sizing: border-box; color: #008800;">"#myimg"</span><span class="pun" style="box-sizing: border-box; color: #666600;">).</span><span class="pln" style="box-sizing: border-box;">attr</span><span class="pun" style="box-sizing: border-box; color: #666600;">(</span><span class="str" style="box-sizing: border-box; color: #008800;">"src"</span><span class="pun" style="box-sizing: border-box; color: #666600;">,</span><span class="pln" style="box-sizing: border-box;"> </span><span class="str" style="box-sizing: border-box; color: #008800;">"/jquery/images/jquery.jpg"</span><span class="pun" style="box-sizing: border-box; color: #666600;">);</span><span class="pln" style="box-sizing: border-box;">
</span><span class="pun" style="box-sizing: border-box; color: #666600;">});</span><span class="pln" style="box-sizing: border-box;">
</span><span class="tag" style="box-sizing: border-box; color: #000088;"></script></span><span class="pln" style="box-sizing: border-box;">
</span><span class="tag" style="box-sizing: border-box; color: #000088;"></head></span><span class="pln" style="box-sizing: border-box;">
</span><span class="tag" style="box-sizing: border-box; color: #000088;"><body></span><span class="pln" style="box-sizing: border-box;">
</span><span class="tag" style="box-sizing: border-box; color: #000088;"><div></span><span class="pln" style="box-sizing: border-box;">
</span><span class="tag" style="box-sizing: border-box; color: #000088;"><img</span><span class="pln" style="box-sizing: border-box;"> </span><span class="atn" style="box-sizing: border-box; color: #7f0055;">id</span><span class="pln" style="box-sizing: border-box;"> </span><span class="pun" style="box-sizing: border-box; color: #666600;">=</span><span class="pln" style="box-sizing: border-box;"> </span><span class="atv" style="box-sizing: border-box; color: #008800;">"myimg"</span><span class="pln" style="box-sizing: border-box;"> </span><span class="atn" style="box-sizing: border-box; color: #7f0055;">src</span><span class="pln" style="box-sizing: border-box;"> </span><span class="pun" style="box-sizing: border-box; color: #666600;">=</span><span class="pln" style="box-sizing: border-box;"> </span><span class="atv" style="box-sizing: border-box; color: #008800;">"/images/jquery.jpg"</span><span class="pln" style="box-sizing: border-box;"> </span><span class="atn" style="box-sizing: border-box; color: #7f0055;">alt</span><span class="pln" style="box-sizing: border-box;"> </span><span class="pun" style="box-sizing: border-box; color: #666600;">=</span><span class="pln" style="box-sizing: border-box;"> </span><span class="atv" style="box-sizing: border-box; color: #008800;">"Sample image"</span><span class="pln" style="box-sizing: border-box;"> </span><span class="tag" style="box-sizing: border-box; color: #000088;">/></span><span class="pln" style="box-sizing: border-box;">
</span><span class="tag" style="box-sizing: border-box; color: #000088;"></div></span><span class="pln" style="box-sizing: border-box;">
</span><span class="tag" style="box-sizing: border-box; color: #000088;"></body></span><span class="pln" style="box-sizing: border-box;">
</span><span class="tag" style="box-sizing: border-box; color: #000088;"></html></span></span></pre>
</div>
<div id="divid">
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div id="divid">
<h2 style="box-sizing: border-box; color: #121214; font-size: 1.7em; font-weight: normal; left: 0px; letter-spacing: -1px; line-height: 1.5em; margin: 0.2em 0.2em 0.2em 0px; padding: 0px; position: relative; text-shadow: rgb(204, 204, 204) 1px 1px 2px;">
<span style="font-family: Arial, Helvetica, sans-serif;">Attribute Methods</span></h2>
<div style="box-sizing: border-box; font-size: 15px !important; line-height: 24px; margin: 0em 0.2em 0.6em; overflow-wrap: break-word; padding: 0px; text-align: justify;">
<span style="font-family: Arial, Helvetica, sans-serif;">Following table lists down few useful methods which you can use to manipulate attributes and properties −</span></div>
<table class="table table-bordered" style="border-collapse: collapse; border-spacing: 0px; border: 1px solid rgb(221, 221, 221); box-sizing: border-box; color: #313131; font-size: 14px; margin-bottom: 20px; max-width: 100%; width: 604px;"><tbody style="box-sizing: border-box;">
<tr style="box-sizing: border-box;"><th style="background: rgb(238, 238, 238); border: 1px solid rgb(221, 221, 221); box-sizing: border-box; line-height: 1.42857; padding: 8px; text-align: left; vertical-align: top;" width="10%"><span style="font-family: Arial, Helvetica, sans-serif;">Sr.No.</span></th><th style="background: rgb(238, 238, 238); border: 1px solid rgb(221, 221, 221); box-sizing: border-box; line-height: 1.42857; padding: 8px; text-align: center; vertical-align: top;"><span style="font-family: Arial, Helvetica, sans-serif;">Methods & Description</span></th></tr>
<tr style="box-sizing: border-box;"><td class="ts" style="border: 1px solid rgb(221, 221, 221); box-sizing: border-box; line-height: 1.42857; padding: 8px; text-align: center !important; vertical-align: top;"><span style="font-family: Arial, Helvetica, sans-serif;">1</span></td><td style="border: 1px solid rgb(221, 221, 221); box-sizing: border-box; line-height: 1.42857; padding: 8px; vertical-align: top;"><a href="https://www.tutorialspoint.com/jquery/attr-properties.htm" style="background-attachment: initial; background-clip: initial; background-image: url("/images/link-icon.png"); background-origin: initial; background-position: right center; background-repeat: no-repeat; background-size: initial; box-sizing: border-box; color: #313131; font-weight: bold; outline: none !important; padding-bottom: 2px; padding-right: 22px; text-decoration-line: none;"><span style="font-family: Arial, Helvetica, sans-serif;">attr( properties )</span></a><div style="box-sizing: border-box; color: black; font-size: 15px !important; line-height: 24px; margin: 0em 0.2em 0.6em; overflow-wrap: break-word; padding: 0px; text-align: justify;">
<span style="font-family: Arial, Helvetica, sans-serif;">Set a key/value object as properties to all matched elements.</span></div>
</td></tr>
<tr style="box-sizing: border-box;"><td class="ts" style="border: 1px solid rgb(221, 221, 221); box-sizing: border-box; line-height: 1.42857; padding: 8px; text-align: center !important; vertical-align: top;"><span style="font-family: Arial, Helvetica, sans-serif;">2</span></td><td style="border: 1px solid rgb(221, 221, 221); box-sizing: border-box; line-height: 1.42857; padding: 8px; vertical-align: top;"><a href="https://www.tutorialspoint.com/jquery/attr-key-function.htm" style="background-attachment: initial; background-clip: initial; background-image: url("/images/link-icon.png"); background-origin: initial; background-position: right center; background-repeat: no-repeat; background-size: initial; box-sizing: border-box; color: #313131; font-weight: bold; outline: none !important; padding-bottom: 2px; padding-right: 22px; text-decoration-line: none;"><span style="font-family: Arial, Helvetica, sans-serif;">attr( key, fn )</span></a><div style="box-sizing: border-box; color: black; font-size: 15px !important; line-height: 24px; margin: 0em 0.2em 0.6em; overflow-wrap: break-word; padding: 0px; text-align: justify;">
<span style="font-family: Arial, Helvetica, sans-serif;">Set a single property to a computed value, on all matched elements.</span></div>
</td></tr>
<tr style="box-sizing: border-box;"><td class="ts" style="border: 1px solid rgb(221, 221, 221); box-sizing: border-box; line-height: 1.42857; padding: 8px; text-align: center !important; vertical-align: top;"><span style="font-family: Arial, Helvetica, sans-serif;">3</span></td><td style="border: 1px solid rgb(221, 221, 221); box-sizing: border-box; line-height: 1.42857; padding: 8px; vertical-align: top;"><a href="https://www.tutorialspoint.com/jquery/attr-remove-attribute.htm" style="background-attachment: initial; background-clip: initial; background-image: url("/images/link-icon.png"); background-origin: initial; background-position: right center; background-repeat: no-repeat; background-size: initial; box-sizing: border-box; color: #313131; font-weight: bold; outline: none !important; padding-bottom: 2px; padding-right: 22px; text-decoration-line: none;"><span style="font-family: Arial, Helvetica, sans-serif;">removeAttr( name )</span></a><div style="box-sizing: border-box; color: black; font-size: 15px !important; line-height: 24px; margin: 0em 0.2em 0.6em; overflow-wrap: break-word; padding: 0px; text-align: justify;">
<span style="font-family: Arial, Helvetica, sans-serif;">Remove an attribute from each of the matched elements.</span></div>
</td></tr>
<tr style="box-sizing: border-box;"><td class="ts" style="border: 1px solid rgb(221, 221, 221); box-sizing: border-box; line-height: 1.42857; padding: 8px; text-align: center !important; vertical-align: top;"><span style="font-family: Arial, Helvetica, sans-serif;">4</span></td><td style="border: 1px solid rgb(221, 221, 221); box-sizing: border-box; line-height: 1.42857; padding: 8px; vertical-align: top;"><a href="https://www.tutorialspoint.com/jquery/attr-has-class.htm" style="background-attachment: initial; background-clip: initial; background-image: url("/images/link-icon.png"); background-origin: initial; background-position: right center; background-repeat: no-repeat; background-size: initial; box-sizing: border-box; color: #313131; font-weight: bold; outline: none !important; padding-bottom: 2px; padding-right: 22px; text-decoration-line: none;"><span style="font-family: Arial, Helvetica, sans-serif;">hasClass( class )</span></a><div style="box-sizing: border-box; color: black; font-size: 15px !important; line-height: 24px; margin: 0em 0.2em 0.6em; overflow-wrap: break-word; padding: 0px; text-align: justify;">
<span style="font-family: Arial, Helvetica, sans-serif;">Returns true if the specified class is present on at least one of the set of matched elements.</span></div>
</td></tr>
<tr style="box-sizing: border-box;"><td class="ts" style="border: 1px solid rgb(221, 221, 221); box-sizing: border-box; line-height: 1.42857; padding: 8px; text-align: center !important; vertical-align: top;"><span style="font-family: Arial, Helvetica, sans-serif;">5</span></td><td style="border: 1px solid rgb(221, 221, 221); box-sizing: border-box; line-height: 1.42857; padding: 8px; vertical-align: top;"><a href="https://www.tutorialspoint.com/jquery/attr-remove-class.htm" style="background-attachment: initial; background-clip: initial; background-image: url("/images/link-icon.png"); background-origin: initial; background-position: right center; background-repeat: no-repeat; background-size: initial; box-sizing: border-box; color: #313131; font-weight: bold; outline: none !important; padding-bottom: 2px; padding-right: 22px; text-decoration-line: none;"><span style="font-family: Arial, Helvetica, sans-serif;">removeClass( class )</span></a><div style="box-sizing: border-box; color: black; font-size: 15px !important; line-height: 24px; margin: 0em 0.2em 0.6em; overflow-wrap: break-word; padding: 0px; text-align: justify;">
<span style="font-family: Arial, Helvetica, sans-serif;">Removes all or the specified class(es) from the set of matched elements.</span></div>
</td></tr>
<tr style="box-sizing: border-box;"><td class="ts" style="border: 1px solid rgb(221, 221, 221); box-sizing: border-box; line-height: 1.42857; padding: 8px; text-align: center !important; vertical-align: top;"><span style="font-family: Arial, Helvetica, sans-serif;">6</span></td><td style="border: 1px solid rgb(221, 221, 221); box-sizing: border-box; line-height: 1.42857; padding: 8px; vertical-align: top;"><a href="https://www.tutorialspoint.com/jquery/attr-toggle-class.htm" style="background-attachment: initial; background-clip: initial; background-image: url("/images/link-icon.png"); background-origin: initial; background-position: right center; background-repeat: no-repeat; background-size: initial; box-sizing: border-box; color: #313131; font-weight: bold; outline: none !important; padding-bottom: 2px; padding-right: 22px; text-decoration-line: none;"><span style="font-family: Arial, Helvetica, sans-serif;">toggleClass( class )</span></a><div style="box-sizing: border-box; color: black; font-size: 15px !important; line-height: 24px; margin: 0em 0.2em 0.6em; overflow-wrap: break-word; padding: 0px; text-align: justify;">
<span style="font-family: Arial, Helvetica, sans-serif;">Adds the specified class if it is not present, removes the specified class if it is present.</span></div>
</td></tr>
<tr style="box-sizing: border-box;"><td class="ts" style="border: 1px solid rgb(221, 221, 221); box-sizing: border-box; line-height: 1.42857; padding: 8px; text-align: center !important; vertical-align: top;"><span style="font-family: Arial, Helvetica, sans-serif;">7</span></td><td style="border: 1px solid rgb(221, 221, 221); box-sizing: border-box; line-height: 1.42857; padding: 8px; vertical-align: top;"><a href="https://www.tutorialspoint.com/jquery/attr-html.htm" style="background-attachment: initial; background-clip: initial; background-image: url("/images/link-icon.png"); background-origin: initial; background-position: right center; background-repeat: no-repeat; background-size: initial; box-sizing: border-box; color: #313131; font-weight: bold; outline: none !important; padding-bottom: 2px; padding-right: 22px; text-decoration-line: none;"><span style="font-family: Arial, Helvetica, sans-serif;">html( )</span></a><div style="box-sizing: border-box; color: black; font-size: 15px !important; line-height: 24px; margin: 0em 0.2em 0.6em; overflow-wrap: break-word; padding: 0px; text-align: justify;">
<span style="font-family: Arial, Helvetica, sans-serif;">Get the html contents (innerHTML) of the first matched element.</span></div>
</td></tr>
<tr style="box-sizing: border-box;"><td class="ts" style="border: 1px solid rgb(221, 221, 221); box-sizing: border-box; line-height: 1.42857; padding: 8px; text-align: center !important; vertical-align: top;"><span style="font-family: Arial, Helvetica, sans-serif;">8</span></td><td style="border: 1px solid rgb(221, 221, 221); box-sizing: border-box; line-height: 1.42857; padding: 8px; vertical-align: top;"><a href="https://www.tutorialspoint.com/jquery/attr-html-val.htm" style="background-attachment: initial; background-clip: initial; background-image: url("/images/link-icon.png"); background-origin: initial; background-position: right center; background-repeat: no-repeat; background-size: initial; box-sizing: border-box; color: #313131; font-weight: bold; outline: none !important; padding-bottom: 2px; padding-right: 22px; text-decoration-line: none;"><span style="font-family: Arial, Helvetica, sans-serif;">html( val )</span></a><div style="box-sizing: border-box; color: black; font-size: 15px !important; line-height: 24px; margin: 0em 0.2em 0.6em; overflow-wrap: break-word; padding: 0px; text-align: justify;">
<span style="font-family: Arial, Helvetica, sans-serif;">Set the html contents of every matched element.</span></div>
</td></tr>
<tr style="box-sizing: border-box;"><td class="ts" style="border: 1px solid rgb(221, 221, 221); box-sizing: border-box; line-height: 1.42857; padding: 8px; text-align: center !important; vertical-align: top;"><span style="font-family: Arial, Helvetica, sans-serif;">9</span></td><td style="border: 1px solid rgb(221, 221, 221); box-sizing: border-box; line-height: 1.42857; padding: 8px; vertical-align: top;"><a href="https://www.tutorialspoint.com/jquery/attr-text.htm" style="background-attachment: initial; background-clip: initial; background-image: url("/images/link-icon.png"); background-origin: initial; background-position: right center; background-repeat: no-repeat; background-size: initial; box-sizing: border-box; color: #313131; font-weight: bold; outline: none !important; padding-bottom: 2px; padding-right: 22px; text-decoration-line: none;"><span style="font-family: Arial, Helvetica, sans-serif;">text( )</span></a><div style="box-sizing: border-box; color: black; font-size: 15px !important; line-height: 24px; margin: 0em 0.2em 0.6em; overflow-wrap: break-word; padding: 0px; text-align: justify;">
<span style="font-family: Arial, Helvetica, sans-serif;">Get the combined text contents of all matched elements.</span></div>
</td></tr>
<tr style="box-sizing: border-box;"><td class="ts" style="border: 1px solid rgb(221, 221, 221); box-sizing: border-box; line-height: 1.42857; padding: 8px; text-align: center !important; vertical-align: top;"><span style="font-family: Arial, Helvetica, sans-serif;">10</span></td><td style="border: 1px solid rgb(221, 221, 221); box-sizing: border-box; line-height: 1.42857; padding: 8px; vertical-align: top;"><a href="https://www.tutorialspoint.com/jquery/attr-text-val.htm" style="background-attachment: initial; background-clip: initial; background-image: url("/images/link-icon.png"); background-origin: initial; background-position: right center; background-repeat: no-repeat; background-size: initial; box-sizing: border-box; color: #313131; font-weight: bold; outline: none !important; padding-bottom: 2px; padding-right: 22px; text-decoration-line: none;"><span style="font-family: Arial, Helvetica, sans-serif;">text( val )</span></a><div style="box-sizing: border-box; color: black; font-size: 15px !important; line-height: 24px; margin: 0em 0.2em 0.6em; overflow-wrap: break-word; padding: 0px; text-align: justify;">
<span style="font-family: Arial, Helvetica, sans-serif;">Set the text contents of all matched elements.</span></div>
</td></tr>
<tr style="box-sizing: border-box;"><td class="ts" style="border: 1px solid rgb(221, 221, 221); box-sizing: border-box; line-height: 1.42857; padding: 8px; text-align: center !important; vertical-align: top;"><span style="font-family: Arial, Helvetica, sans-serif;">11</span></td><td style="border: 1px solid rgb(221, 221, 221); box-sizing: border-box; line-height: 1.42857; padding: 8px; vertical-align: top;"><a href="https://www.tutorialspoint.com/jquery/attr-val.htm" style="background-attachment: initial; background-clip: initial; background-image: url("/images/link-icon.png"); background-origin: initial; background-position: right center; background-repeat: no-repeat; background-size: initial; box-sizing: border-box; color: #313131; font-weight: bold; outline: none !important; padding-bottom: 2px; padding-right: 22px; text-decoration-line: none;"><span style="font-family: Arial, Helvetica, sans-serif;">val( )</span></a><div style="box-sizing: border-box; color: black; font-size: 15px !important; line-height: 24px; margin: 0em 0.2em 0.6em; overflow-wrap: break-word; padding: 0px; text-align: justify;">
<span style="font-family: Arial, Helvetica, sans-serif;">Get the input value of the first matched element.</span></div>
</td></tr>
<tr style="box-sizing: border-box;"><td class="ts" style="border: 1px solid rgb(221, 221, 221); box-sizing: border-box; line-height: 1.42857; padding: 8px; text-align: center !important; vertical-align: top;"><span style="font-family: Arial, Helvetica, sans-serif;">12</span></td><td style="border: 1px solid rgb(221, 221, 221); box-sizing: border-box; line-height: 1.42857; padding: 8px; vertical-align: top;"><a href="https://www.tutorialspoint.com/jquery/attr-val-val.htm" style="background-attachment: initial; background-clip: initial; background-image: url("/images/link-icon.png"); background-origin: initial; background-position: right center; background-repeat: no-repeat; background-size: initial; box-sizing: border-box; color: #313131; font-weight: bold; outline: none !important; padding-bottom: 2px; padding-right: 22px; text-decoration-line: none;"><span style="font-family: Arial, Helvetica, sans-serif;">val( val )</span></a><div style="box-sizing: border-box; color: black; font-size: 15px !important; line-height: 24px; margin: 0em 0.2em 0.6em; overflow-wrap: break-word; padding: 0px; text-align: justify;">
<span style="font-family: Arial, Helvetica, sans-serif;">Set the value attribute of every matched element if it is called on <input> but if it is called on <select> with the passed <option> value then passed option would be selected, if it is called on check box or radio box then all the matching check box and radiobox would be checked.</span></div>
</td></tr>
</tbody></table>
</div>
<div id="divid">
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div id="divid">
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div id="divid">
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
</div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<br /></div>
</div>
It E Researchhttp://www.blogger.com/profile/02660842566926994686noreply@blogger.com1tag:blogger.com,1999:blog-7822657138986038530.post-90863066901656479842018-06-08T05:21:00.003-07:002018-06-08T05:21:48.295-07:00jQuery Selectors<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgJuH-z5RFicim9IcCNH_iIPE_krtB8i3A-EvnP6uCK6YDidFG6ubh5DZDO7O3bks_y5CDArm_w-sJGXVGvf_lvyyl8sZqS1r4-J1KTQUyjIS_Noh3dmtSK2rcx57M6L6Nv9UCp9epHNw/s1600/images.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="168" data-original-width="300" height="358" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgJuH-z5RFicim9IcCNH_iIPE_krtB8i3A-EvnP6uCK6YDidFG6ubh5DZDO7O3bks_y5CDArm_w-sJGXVGvf_lvyyl8sZqS1r4-J1KTQUyjIS_Noh3dmtSK2rcx57M6L6Nv9UCp9epHNw/s640/images.png" width="640" /></a></div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="font-family: Arial, Helvetica, sans-serif;">jQuery selectors are used to select and efficient HTML elements. They are a very important part of the jQuery library.</span><br />
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="font-family: Arial, Helvetica, sans-serif;">With jQuery selectors, you can find or select HTML elements based on a lot of things from their IDs, classes, features, types and doom.</span><br />
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="font-family: Arial, Helvetica, sans-serif;">In simple words, you can say that selectors are used to select one or more HTML elements using jQuery and once you select the element you can perform various operations on it.</span><br />
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="font-family: Arial, Helvetica, sans-serif;">All the jQuery selectors start with a doll mark and bracket eg. $ () It is known as the factory function.</span><br />
<h2 class="h2" style="background-color: white; color: #610b38; font-weight: 400; line-height: 1.3em; text-align: justify;">
<span style="font-family: Arial, Helvetica, sans-serif; font-size: small;">The $() factory function</span></h2>
<div>
<div style="background-color: white; text-align: justify;">
<span style="font-family: Arial, Helvetica, sans-serif;">Every jQuery selector start with thiis sign $(). This sign is known as the factory function. It uses the three basic building blocks while selecting an element in a given document.</span></div>
<table class="alt" style="background-color: white; border-collapse: collapse; border-spacing: 0px; border: 1px solid rgb(199, 204, 190); color: black; width: 869px;"><tbody>
<tr style="background-color: #eff1eb;"><th style="background-color: #c7ccbe; padding: 12px; text-align: left; vertical-align: top;"><span style="font-family: Arial, Helvetica, sans-serif;">S.No.</span></th><th style="background-color: #c7ccbe; padding: 12px; text-align: left; vertical-align: top;"><span style="font-family: Arial, Helvetica, sans-serif;">Selector</span></th><th style="background-color: #c7ccbe; padding: 12px; text-align: left; vertical-align: top;"><span style="font-family: Arial, Helvetica, sans-serif;">Description</span></th></tr>
<tr><td style="border: 1px solid rgb(199, 204, 190); font-stretch: normal; font-variant-east-asian: normal; font-variant-numeric: normal; line-height: 23px; margin-left: 20px; padding: 8px; text-align: justify; vertical-align: top;"><span style="font-family: Arial, Helvetica, sans-serif;">1)</span></td><td style="border: 1px solid rgb(199, 204, 190); font-stretch: normal; font-variant-east-asian: normal; font-variant-numeric: normal; line-height: 23px; margin-left: 20px; padding: 8px; text-align: justify; vertical-align: top;"><span style="font-family: Arial, Helvetica, sans-serif;">Tag Name:</span></td><td style="border: 1px solid rgb(199, 204, 190); font-stretch: normal; font-variant-east-asian: normal; font-variant-numeric: normal; line-height: 23px; margin-left: 20px; padding: 8px; text-align: justify; vertical-align: top;"><span style="font-family: Arial, Helvetica, sans-serif;">It represents a tag name available in the DOM.<br />For example: $('p') selects all paragraphs'p'in the document.</span></td></tr>
<tr style="background-color: #eff1eb;"><td style="border: 1px solid rgb(199, 204, 190); font-stretch: normal; font-variant-east-asian: normal; font-variant-numeric: normal; line-height: 23px; margin-left: 20px; padding: 8px; text-align: justify; vertical-align: top;"><span style="font-family: Arial, Helvetica, sans-serif;">2)</span></td><td style="border: 1px solid rgb(199, 204, 190); font-stretch: normal; font-variant-east-asian: normal; font-variant-numeric: normal; line-height: 23px; margin-left: 20px; padding: 8px; text-align: justify; vertical-align: top;"><span style="font-family: Arial, Helvetica, sans-serif;">Tag ID:</span></td><td style="border: 1px solid rgb(199, 204, 190); font-stretch: normal; font-variant-east-asian: normal; font-variant-numeric: normal; line-height: 23px; margin-left: 20px; padding: 8px; text-align: justify; vertical-align: top;"><span style="font-family: Arial, Helvetica, sans-serif;">It represents a tag available with a specific ID in the DOM.<br />For example: $('#real-id') selects a specific element in the document that has an ID of real-id.</span></td></tr>
<tr><td style="border: 1px solid rgb(199, 204, 190); font-stretch: normal; font-variant-east-asian: normal; font-variant-numeric: normal; line-height: 23px; margin-left: 20px; padding: 8px; text-align: justify; vertical-align: top;"><span style="font-family: Arial, Helvetica, sans-serif;">3)</span></td><td style="border: 1px solid rgb(199, 204, 190); font-stretch: normal; font-variant-east-asian: normal; font-variant-numeric: normal; line-height: 23px; margin-left: 20px; padding: 8px; text-align: justify; vertical-align: top;"><span style="font-family: Arial, Helvetica, sans-serif;">Tag Class:</span></td><td style="border: 1px solid rgb(199, 204, 190); font-stretch: normal; font-variant-east-asian: normal; font-variant-numeric: normal; line-height: 23px; margin-left: 20px; padding: 8px; text-align: justify; vertical-align: top;"><span style="font-family: Arial, Helvetica, sans-serif;">It represents a tag available with a specific class in the DOM.<br />For example: $('real-class') selects all elements in the document that have a class of real-class.</span></td></tr>
</tbody></table>
</div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div style="text-align: left;">
<span style="font-family: Arial, Helvetica, sans-serif;"><span style="text-align: justify;"><!DOCTYPE html> </span><br /><span style="text-align: justify;"><html> </span><br /><span style="text-align: justify;"><head> </span><br /><span style="text-align: justify;"> <title>First jQuery Example</title> </span><br /><span style="text-align: justify;"><script type=</span><span class="string" style="border: none; color: blue; margin: 0px; padding: 0px; text-align: justify;">"text/javascript"</span><span style="border: none; margin: 0px; padding: 0px; text-align: justify;"> src=</span><span class="string" style="border: none; color: blue; margin: 0px; padding: 0px; text-align: justify;">"http://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"</span><span style="border: none; margin: 0px; padding: 0px; text-align: justify;">> </span><br /><span style="text-align: justify;"> </script> </span><br /><span style="text-align: justify;"> <script type=</span><span class="string" style="border: none; color: blue; margin: 0px; padding: 0px; text-align: justify;">"text/javascript"</span><span style="border: none; margin: 0px; padding: 0px; text-align: justify;"> language=</span><span class="string" style="border: none; color: blue; margin: 0px; padding: 0px; text-align: justify;">"javascript"</span><span style="border: none; margin: 0px; padding: 0px; text-align: justify;">> </span><br /><span style="text-align: justify;"> $(document).ready(function() { </span><br /><span style="text-align: justify;"> $(</span><span class="string" style="border: none; color: blue; margin: 0px; padding: 0px; text-align: justify;">"p"</span><span style="border: none; margin: 0px; padding: 0px; text-align: justify;">).css(</span><span class="string" style="border: none; color: blue; margin: 0px; padding: 0px; text-align: justify;">"background-color"</span><span style="border: none; margin: 0px; padding: 0px; text-align: justify;">, </span><span class="string" style="border: none; color: blue; margin: 0px; padding: 0px; text-align: justify;">"pink"</span><span style="border: none; margin: 0px; padding: 0px; text-align: justify;">); </span><br /><span style="text-align: justify;"> }); </span><br /><span style="text-align: justify;"> </script> </span><br /><span style="text-align: justify;"> </head> </span><br /><span style="text-align: justify;"><body> </span><br /><span style="text-align: justify;"><p>This is first paragraph.</p> </span><br /><span style="text-align: justify;"><p>This is second paragraph.</p> </span><br /><span style="text-align: justify;"><p>This is third paragraph.</p> </span><br /><span style="text-align: justify;"></body> </span><br /><span style="text-align: justify;"></html> </span><br /></span></div>
<div style="text-align: left;">
<h2 class="h2" style="background-color: white; color: #610b38; line-height: 1.3em; text-align: justify;">
<span style="font-family: Arial, Helvetica, sans-serif; font-size: small;">How to use Selectors</span></h2>
<div>
<div style="background-color: white; text-align: justify;">
<span style="font-family: Arial, Helvetica, sans-serif;">The jQuery selectors can be used single or with the combination of other selectors. They are required at every steps while using jQuery. They are used to select the exact element that you want from your HTML document.</span></div>
<table class="alt" style="background-color: white; border-collapse: collapse; border-spacing: 0px; border: 1px solid rgb(199, 204, 190); color: black; width: 869px;"><tbody>
<tr style="background-color: #eff1eb;"><th style="background-color: #c7ccbe; padding: 12px; text-align: left; vertical-align: top;"><span style="font-family: Arial, Helvetica, sans-serif;">S.No.</span></th><th style="background-color: #c7ccbe; padding: 12px; text-align: left; vertical-align: top;"><span style="font-family: Arial, Helvetica, sans-serif;">Selector</span></th><th style="background-color: #c7ccbe; padding: 12px; text-align: left; vertical-align: top;"><span style="font-family: Arial, Helvetica, sans-serif;">Description</span></th></tr>
<tr><td style="border: 1px solid rgb(199, 204, 190); font-stretch: normal; font-variant-east-asian: normal; font-variant-numeric: normal; line-height: 23px; margin-left: 20px; padding: 8px; text-align: justify; vertical-align: top;"><span style="font-family: Arial, Helvetica, sans-serif;">1)</span></td><td style="border: 1px solid rgb(199, 204, 190); font-stretch: normal; font-variant-east-asian: normal; font-variant-numeric: normal; line-height: 23px; margin-left: 20px; padding: 8px; text-align: justify; vertical-align: top;"><span style="font-family: Arial, Helvetica, sans-serif;">Name:</span></td><td style="border: 1px solid rgb(199, 204, 190); font-stretch: normal; font-variant-east-asian: normal; font-variant-numeric: normal; line-height: 23px; margin-left: 20px; padding: 8px; text-align: justify; vertical-align: top;"><span style="font-family: Arial, Helvetica, sans-serif;">It selects all elements that match with the given element name.</span></td></tr>
<tr style="background-color: #eff1eb;"><td style="border: 1px solid rgb(199, 204, 190); font-stretch: normal; font-variant-east-asian: normal; font-variant-numeric: normal; line-height: 23px; margin-left: 20px; padding: 8px; text-align: justify; vertical-align: top;"><span style="font-family: Arial, Helvetica, sans-serif;">2)</span></td><td style="border: 1px solid rgb(199, 204, 190); font-stretch: normal; font-variant-east-asian: normal; font-variant-numeric: normal; line-height: 23px; margin-left: 20px; padding: 8px; text-align: justify; vertical-align: top;"><span style="font-family: Arial, Helvetica, sans-serif;">#ID:</span></td><td style="border: 1px solid rgb(199, 204, 190); font-stretch: normal; font-variant-east-asian: normal; font-variant-numeric: normal; line-height: 23px; margin-left: 20px; padding: 8px; text-align: justify; vertical-align: top;"><span style="font-family: Arial, Helvetica, sans-serif;">It selects a single element that matches with the given id.</span></td></tr>
<tr><td style="border: 1px solid rgb(199, 204, 190); font-stretch: normal; font-variant-east-asian: normal; font-variant-numeric: normal; line-height: 23px; margin-left: 20px; padding: 8px; text-align: justify; vertical-align: top;"><span style="font-family: Arial, Helvetica, sans-serif;">3)</span></td><td style="border: 1px solid rgb(199, 204, 190); font-stretch: normal; font-variant-east-asian: normal; font-variant-numeric: normal; line-height: 23px; margin-left: 20px; padding: 8px; text-align: justify; vertical-align: top;"><span style="font-family: Arial, Helvetica, sans-serif;">.Class:</span></td><td style="border: 1px solid rgb(199, 204, 190); font-stretch: normal; font-variant-east-asian: normal; font-variant-numeric: normal; line-height: 23px; margin-left: 20px; padding: 8px; text-align: justify; vertical-align: top;"><span style="font-family: Arial, Helvetica, sans-serif;">It selects all elements that matches with the given class.</span></td></tr>
<tr style="background-color: #eff1eb;"><td style="border: 1px solid rgb(199, 204, 190); font-stretch: normal; font-variant-east-asian: normal; font-variant-numeric: normal; line-height: 23px; margin-left: 20px; padding: 8px; text-align: justify; vertical-align: top;"><span style="font-family: Arial, Helvetica, sans-serif;">4)</span></td><td style="border: 1px solid rgb(199, 204, 190); font-stretch: normal; font-variant-east-asian: normal; font-variant-numeric: normal; line-height: 23px; margin-left: 20px; padding: 8px; text-align: justify; vertical-align: top;"><span style="font-family: Arial, Helvetica, sans-serif;">Universal(*)</span></td><td style="border: 1px solid rgb(199, 204, 190); font-stretch: normal; font-variant-east-asian: normal; font-variant-numeric: normal; line-height: 23px; margin-left: 20px; padding: 8px; text-align: justify; vertical-align: top;"><span style="font-family: Arial, Helvetica, sans-serif;">It selects all elements available in a DOM.</span></td></tr>
<tr><td style="border: 1px solid rgb(199, 204, 190); font-stretch: normal; font-variant-east-asian: normal; font-variant-numeric: normal; line-height: 23px; margin-left: 20px; padding: 8px; text-align: justify; vertical-align: top;"><span style="font-family: Arial, Helvetica, sans-serif;">5)</span></td><td style="border: 1px solid rgb(199, 204, 190); font-stretch: normal; font-variant-east-asian: normal; font-variant-numeric: normal; line-height: 23px; margin-left: 20px; padding: 8px; text-align: justify; vertical-align: top;"><span style="font-family: Arial, Helvetica, sans-serif;">Multiple Elements A,B,C</span></td><td style="border: 1px solid rgb(199, 204, 190); font-stretch: normal; font-variant-east-asian: normal; font-variant-numeric: normal; line-height: 23px; margin-left: 20px; padding: 8px; text-align: justify; vertical-align: top;"><span style="font-family: Arial, Helvetica, sans-serif;">It selects the combined results of all the specified selectors A,B and C.</span></td></tr>
</tbody></table>
</div>
</div>
<div>
<br /></div>
</div>
It E Researchhttp://www.blogger.com/profile/02660842566926994686noreply@blogger.com0tag:blogger.com,1999:blog-7822657138986038530.post-52619180918899909712018-06-08T05:17:00.000-07:002018-06-08T05:17:12.116-07:00Get Started jQuery <div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgW94SkFuqp797RNkksxC2dJ_253hwSJJ2a_55J1V57XWIT1FrxJMz_9t8Av1URY7uOniQnE_LsJmPfjmN8DfFFhjHY263OiuvTiuBV4XAquW3hCWCqy6baFRYveWRzW7YUTIR9HSYRMA/s1600/jquery_dot_com.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="1022" data-original-width="1600" height="408" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgW94SkFuqp797RNkksxC2dJ_253hwSJJ2a_55J1V57XWIT1FrxJMz_9t8Av1URY7uOniQnE_LsJmPfjmN8DfFFhjHY263OiuvTiuBV4XAquW3hCWCqy6baFRYveWRzW7YUTIR9HSYRMA/s640/jquery_dot_com.png" width="640" /></a></div>
<h2 style="background-color: white; box-sizing: inherit; margin: 10px 0px;">
Downloading jQuery</h2>
<div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;">There are two versions of jQuery available for download:</span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><b>Production Edition - </b>This is for your live website because it is small and compressed</span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;">Development Edition - This is for testing and development (uncompressed and readable code)</span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;">Both versions can be downloaded from jQuery.com.</span></div>
</div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><b>Example -</b></span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><span style="background-color: white; box-sizing: inherit; color: brown;"><span style="box-sizing: inherit; color: mediumblue;"><</span>head<span style="box-sizing: inherit; color: mediumblue;">></span></span><br style="background-color: white; box-sizing: inherit;" /><span style="background-color: white; box-sizing: inherit; color: brown;"><span style="box-sizing: inherit; color: mediumblue;"><</span>script<span style="box-sizing: inherit; color: red;"> src<span style="box-sizing: inherit; color: mediumblue;">="jquery-3.3.1.min.js"</span></span><span style="box-sizing: inherit; color: mediumblue;">></span></span><span style="background-color: white; box-sizing: inherit;"></span><span style="background-color: white; box-sizing: inherit; color: brown;"><span style="box-sizing: inherit; color: mediumblue;"><</span>/script<span style="box-sizing: inherit; color: mediumblue;">></span></span><br style="background-color: white; box-sizing: inherit;" /><span style="background-color: white; box-sizing: inherit; color: brown;"><span style="box-sizing: inherit; color: mediumblue;"><</span>/head<span style="box-sizing: inherit; color: mediumblue;">></span></span></span></div>
<div>
<span style="background-color: white; box-sizing: inherit; color: brown;"><span style="box-sizing: inherit; color: mediumblue;"><span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></span></span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><span style="background-color: white;"><b>live url - </b></span></span></div>
<div>
<span style="background-color: white; box-sizing: inherit; color: brown;"><span style="box-sizing: inherit; color: mediumblue;"><span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></span></span></div>
<div>
<span style="background-color: white; box-sizing: inherit; color: brown;"><span style="box-sizing: inherit; color: mediumblue;"><span style="font-family: Arial, Helvetica, sans-serif;"><span style="box-sizing: inherit; color: brown;"><span style="box-sizing: inherit; color: mediumblue;"><</span>head<span style="box-sizing: inherit; color: mediumblue;">></span></span><br style="box-sizing: inherit; color: black;" /><span style="box-sizing: inherit; color: brown;"><span style="box-sizing: inherit; color: mediumblue;"><</span>script<span style="box-sizing: inherit; color: red;"> src<span style="box-sizing: inherit; color: mediumblue;">="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"</span></span><span style="box-sizing: inherit; color: mediumblue;">></span></span><span style="box-sizing: inherit; box-sizing: inherit; color: black;"></span><span style="box-sizing: inherit; color: brown;"><span style="box-sizing: inherit; color: mediumblue;"><</span>/script<span style="box-sizing: inherit; color: mediumblue;">></span></span><br style="box-sizing: inherit; color: black;" /><span style="box-sizing: inherit; color: brown;"><span style="box-sizing: inherit; color: mediumblue;"><</span>/head<span style="box-sizing: inherit; color: mediumblue;">></span></span></span></span></span></div>
</div>
It E Researchhttp://www.blogger.com/profile/02660842566926994686noreply@blogger.com0tag:blogger.com,1999:blog-7822657138986038530.post-65317289717476411092018-06-08T05:12:00.002-07:002018-06-08T05:12:51.052-07:00what is jQuery <div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzX_NEKGNxhBZnmhLqRH7sIW-8dnaFIybbvFjezSsycc-uNwiE-79gUWqXAtzjcExOqTuwJD1wT819jTOM9fux-P57PvdFGtHGpiNm6JkknTaHKqPeD1pfopN-J9u6eaSGdyZLkxSh1g/s1600/download.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="168" data-original-width="299" height="358" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzX_NEKGNxhBZnmhLqRH7sIW-8dnaFIybbvFjezSsycc-uNwiE-79gUWqXAtzjcExOqTuwJD1wT819jTOM9fux-P57PvdFGtHGpiNm6JkknTaHKqPeD1pfopN-J9u6eaSGdyZLkxSh1g/s640/download.png" width="640" /></a></div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span>
<br />
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="font-family: Arial, Helvetica, sans-serif;">jQuery is a fast, small and feature rich JavaScript library that is included in a .js file.</span><br />
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="font-family: Arial, Helvetica, sans-serif;">jQuery makes life of a web developer easier. It provides many built-in functions that you can use to complete various tasks easily and quickly.</span><br />
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span>
<h2 style="background-color: white; box-sizing: border-box; color: #486a80; letter-spacing: -1px; line-height: 1.5em; margin: 1.2em 0.2em 0.6em 0px; padding: 0px; text-shadow: rgb(229, 239, 245) 1px 1px 2px;">
<span style="font-family: Arial, Helvetica, sans-serif; font-size: small;">jQuery provides following important features:</span></h2>
<div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;">DOM Selection: jQuery provides the selector to retrieve the DOM elements on the basis of various criteria such as name, id, css, name of the class, attribute name, price, hierarchy etc.</span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;">Dom Manipulation: You can use DOM elements by using various built-in jQuery functions. For example, adding or removing elements, modifying HTML content, CSS class etc.</span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;">Special effects: You can apply special effects to the DOM elements such as fade-out, sliding effects, animation, etc., from show or hide element, fade-in or visibility.</span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;">Events: The jQuery library includes functions that are equivalent to DOM events such as clicks, dblclick, mousecenter, mouseleave, blur, keyup, keydown, etc. These functions automatically handle cross-browser issues.</span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;">Ajax: It's also easy to use AJAX functions to load data from the server without reloading the whole page in jQuery.</span></div>
</div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<h2 style="background-color: white; box-sizing: border-box; color: #486a80; letter-spacing: -1px; line-height: 1.5em; margin: 1.2em 0.2em 0.6em 0px; padding: 0px; text-shadow: rgb(229, 239, 245) 1px 1px 2px;">
<span style="font-family: Arial, Helvetica, sans-serif; font-size: small;">Advantages of jQuery:</span></h2>
</div>
<div>
<div>
<ol style="text-align: left;">
<li><span style="font-family: Arial, Helvetica, sans-serif;">Learning is simple: Learning jQuery is easy because it supports the same JavaScript style coding.</span></li>
<li><span style="font-family: Arial, Helvetica, sans-serif;">Write less and write: jQuery provides a rich set of features that increase the productivity of developers by writing less and readable code.</span></li>
<li><span style="font-family: Arial, Helvetica, sans-serif;">Excellent API Documentation: jQuery provides excellent online API documentation.</span></li>
<li><span style="font-family: Arial, Helvetica, sans-serif;">Cross-Browser Support: jQuery offers excellent cross-browser support without writing additional code.</span></li>
<li><span style="font-family: Arial, Helvetica, sans-serif;">Indivisible: jQuery is inseparable which allows to separate the concerns by isolating HTML and jQuery code.</span></li>
</ol>
</div>
</div>
</div>
It E Researchhttp://www.blogger.com/profile/02660842566926994686noreply@blogger.com0tag:blogger.com,1999:blog-7822657138986038530.post-39898452110169224612018-02-22T21:44:00.001-08:002018-02-22T21:49:09.770-08:00Insert Data Example in PHP<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjPe-qYDvyG7WxDrC33OEBo7ePiU5Xw8zF3-FqoakrfvH4vuW0FMr9aiD71FUttMvtP8lHJdKT5fPZXw8dCDqBVccHIASJ1jvAmi81PEndAr0zM3d-ycZudZTobIQ_2CNDVDk6D9Gk53A/s1600/insert-data-iteresearch.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="386" data-original-width="500" height="308" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjPe-qYDvyG7WxDrC33OEBo7ePiU5Xw8zF3-FqoakrfvH4vuW0FMr9aiD71FUttMvtP8lHJdKT5fPZXw8dCDqBVccHIASJ1jvAmi81PEndAr0zM3d-ycZudZTobIQ_2CNDVDk6D9Gk53A/s400/insert-data-iteresearch.jpg" width="400" /></a></div>
<h3 style="background-color: white; box-sizing: border-box; font-size: 24px; line-height: 1.5em; margin: 1em 0px; outline: 0px;">
<span style="color: red; font-family: Arial, Helvetica, sans-serif;">Connect MySql Database</span></h3>
<div>
<span style="color: #0b5394; font-family: Arial, Helvetica, sans-serif;"><span class="token delimiter" style="background-color: #fdfdfd; box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;"><?php</span><span style="background-color: #fdfdfd; font-size: 12px; font-weight: 700; white-space: pre;">
</span><span class="token variable" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">$servername</span><span style="background-color: #fdfdfd; font-size: 12px; font-weight: 700; white-space: pre;"> </span><span class="token operator" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">=</span><span style="background-color: #fdfdfd; font-size: 12px; font-weight: 700; white-space: pre;"> </span><span class="token string" style="background-color: #fdfdfd; box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">"localhost"</span><span class="token punctuation" style="background-color: #fdfdfd; box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">;</span><span style="background-color: #fdfdfd; font-size: 12px; font-weight: 700; white-space: pre;">
</span><span class="token variable" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">$username</span><span style="background-color: #fdfdfd; font-size: 12px; font-weight: 700; white-space: pre;"> </span><span class="token operator" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">=</span><span style="background-color: #fdfdfd; font-size: 12px; font-weight: 700; white-space: pre;"> </span><span class="token string" style="background-color: #fdfdfd; box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">"username"</span><span class="token punctuation" style="background-color: #fdfdfd; box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">;</span><span style="background-color: #fdfdfd; font-size: 12px; font-weight: 700; white-space: pre;">
</span><span class="token variable" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">$password</span><span style="background-color: #fdfdfd; font-size: 12px; font-weight: 700; white-space: pre;"> </span><span class="token operator" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">=</span><span style="background-color: #fdfdfd; font-size: 12px; font-weight: 700; white-space: pre;"> </span><span class="token string" style="background-color: #fdfdfd; box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">"password"</span><span class="token punctuation" style="background-color: #fdfdfd; box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">;</span><span style="background-color: #fdfdfd; font-size: 12px; font-weight: 700; white-space: pre;">
</span><span class="token variable" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">$dbname</span><span style="background-color: #fdfdfd; font-size: 12px; font-weight: 700; white-space: pre;"> </span><span class="token operator" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">=</span><span style="background-color: #fdfdfd; font-size: 12px; font-weight: 700; white-space: pre;"> </span><span class="token string" style="background-color: #fdfdfd; box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">"database"</span><span class="token punctuation" style="background-color: #fdfdfd; box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">;</span><span class="token comment" spellcheck="true" style="background-color: #fdfdfd; box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">
// Create connection
</span><span class="token variable" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">$conn</span><span style="background-color: #fdfdfd; font-size: 12px; font-weight: 700; white-space: pre;"> </span><span class="token operator" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">=</span><span style="background-color: #fdfdfd; font-size: 12px; font-weight: 700; white-space: pre;"> </span><span class="token keyword" style="background-color: #fdfdfd; box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">new</span><span style="background-color: #fdfdfd; font-size: 12px; font-weight: 700; white-space: pre;"> </span><span class="token class-name" style="background-color: #fdfdfd; box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">mysqli</span><span class="token punctuation" style="background-color: #fdfdfd; box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">(</span><span class="token variable" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">$servername</span><span class="token punctuation" style="background-color: #fdfdfd; box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">,</span><span style="background-color: #fdfdfd; font-size: 12px; font-weight: 700; white-space: pre;"> </span><span class="token variable" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">$username</span><span class="token punctuation" style="background-color: #fdfdfd; box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">,</span><span style="background-color: #fdfdfd; font-size: 12px; font-weight: 700; white-space: pre;"> </span><span class="token variable" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">$password</span><span class="token punctuation" style="background-color: #fdfdfd; box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">,</span><span class="token variable" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">$dbname</span><span class="token punctuation" style="background-color: #fdfdfd; box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">)</span><span class="token punctuation" style="background-color: #fdfdfd; box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">;</span><span style="background-color: #fdfdfd; font-size: 12px; font-weight: 700; white-space: pre;">
</span><span class="token comment" spellcheck="true" style="background-color: #fdfdfd; box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">
// Check connection
</span><span class="token keyword" style="background-color: #fdfdfd; box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">if</span><span style="background-color: #fdfdfd; font-size: 12px; font-weight: 700; white-space: pre;"> </span><span class="token punctuation" style="background-color: #fdfdfd; box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">(</span><span class="token variable" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">$conn</span><span class="token operator" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">-</span><span class="token operator" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">></span><span class="token property" style="background-color: #fdfdfd; box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">connect_error</span><span class="token punctuation" style="background-color: #fdfdfd; box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">)</span><span style="background-color: #fdfdfd; font-size: 12px; font-weight: 700; white-space: pre;"> </span><span class="token punctuation" style="background-color: #fdfdfd; box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">{</span><span style="background-color: #fdfdfd; font-size: 12px; font-weight: 700; white-space: pre;">
</span><span class="token keyword" style="background-color: #fdfdfd; box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">die</span><span class="token punctuation" style="background-color: #fdfdfd; box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">(</span><span class="token string" style="background-color: #fdfdfd; box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">"Connection failed: "</span><span style="background-color: #fdfdfd; font-size: 12px; font-weight: 700; white-space: pre;"> </span><span class="token punctuation" style="background-color: #fdfdfd; box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">.</span><span style="background-color: #fdfdfd; font-size: 12px; font-weight: 700; white-space: pre;"> </span><span class="token variable" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">$conn</span><span class="token operator" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">-</span><span class="token operator" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">></span><span class="token property" style="background-color: #fdfdfd; box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">connect_error</span><span class="token punctuation" style="background-color: #fdfdfd; box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">)</span><span class="token punctuation" style="background-color: #fdfdfd; box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">;</span><span style="background-color: #fdfdfd; font-size: 12px; font-weight: 700; white-space: pre;">
</span><span class="token punctuation" style="background-color: #fdfdfd; box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">}</span><span style="background-color: #fdfdfd; font-size: 12px; font-weight: 700; white-space: pre;">
</span><span class="token keyword" style="background-color: #fdfdfd; box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">echo</span><span style="background-color: #fdfdfd; font-size: 12px; font-weight: 700; white-space: pre;"> </span><span class="token string" style="background-color: #fdfdfd; box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">"Connected successfully"</span><span class="token punctuation" style="background-color: #fdfdfd; box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">;</span><span style="background-color: #fdfdfd; font-size: 12px; font-weight: 700; white-space: pre;">
</span><span class="token delimiter" style="background-color: #fdfdfd; box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;">?></span></span></div>
<div>
<span class="token delimiter" style="background-color: #fdfdfd; box-sizing: border-box; font-size: 12px; font-weight: 700; outline: 0px; white-space: pre;"><span style="color: #0b5394; font-family: Arial, Helvetica, sans-serif;"><br /></span></span></div>
<div>
<span class="token delimiter" style="background-color: #fdfdfd; box-sizing: border-box; outline: 0px; white-space: pre;"><h3 style="background-color: white; box-sizing: border-box; font-size: 24px; line-height: 1.5em; margin: 1em 0px; outline: 0px; white-space: normal;">
<span style="color: red; font-family: Arial, Helvetica, sans-serif;">Insert Data Using MySQL</span></h3>
<div style="font-size: 12px; font-weight: 700;">
<span style="color: #0b5394; font-family: Arial, Helvetica, sans-serif;"><span class="token variable" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; outline: 0px;">$sql</span> <span class="token operator" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; outline: 0px;">=</span> "<span class="token constant" style="box-sizing: border-box; outline: 0px;">INSERT</span> <span class="token constant" style="box-sizing: border-box; outline: 0px;">INTO</span> students <span class="token punctuation" style="box-sizing: border-box; outline: 0px;">(</span>student_name<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">,</span> student_email<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">,</span> student_city<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">)</span>
<span class="token constant" style="box-sizing: border-box; outline: 0px;">VALUES</span> <span class="token punctuation" style="box-sizing: border-box; outline: 0px;">(</span><span class="token string" style="box-sizing: border-box; outline: 0px;">'John'</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">,</span> <span class="token string" style="box-sizing: border-box; outline: 0px;">'john@example.com'</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">,</span><span class="token string" style="box-sizing: border-box; outline: 0px;">'los angeles'</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">)</span>"<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">;</span>
<span class="token keyword" style="box-sizing: border-box; outline: 0px;">if</span> <span class="token punctuation" style="box-sizing: border-box; outline: 0px;">(</span><span class="token variable" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; outline: 0px;">$conn</span><span class="token operator" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; outline: 0px;">-</span><span class="token operator" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; outline: 0px;">></span><span class="token function" style="box-sizing: border-box; outline: 0px;">query<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">(</span></span><span class="token variable" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; outline: 0px;">$sql</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">)</span> <span class="token operator" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; outline: 0px;">===</span> <span class="token constant" style="box-sizing: border-box; outline: 0px;">TRUE</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">)</span> <span class="token punctuation" style="box-sizing: border-box; outline: 0px;">{</span>
<span class="token keyword" style="box-sizing: border-box; outline: 0px;">echo</span> <span class="token string" style="box-sizing: border-box; outline: 0px;">"New record created successfully"</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">;</span>
<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">}</span> <span class="token keyword" style="box-sizing: border-box; outline: 0px;">else</span> <span class="token punctuation" style="box-sizing: border-box; outline: 0px;">{</span>
<span class="token keyword" style="box-sizing: border-box; outline: 0px;">echo</span> <span class="token string" style="box-sizing: border-box; outline: 0px;">"Error: "</span> <span class="token punctuation" style="box-sizing: border-box; outline: 0px;">.</span> <span class="token variable" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; outline: 0px;">$sql</span> <span class="token punctuation" style="box-sizing: border-box; outline: 0px;">.</span> "<span class="token markup" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;"><</span>br</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">></span></span></span>" <span class="token punctuation" style="box-sizing: border-box; outline: 0px;">.</span> <span class="token variable" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; outline: 0px;">$conn</span><span class="token operator" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; outline: 0px;">-</span><span class="token operator" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; outline: 0px;">></span><span class="token property" style="box-sizing: border-box; outline: 0px;">error</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">;</span>
<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">}</span><span class="token variable" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; outline: 0px;">$conn</span><span class="token operator" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; outline: 0px;">-</span><span class="token operator" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; outline: 0px;">></span><span class="token function" style="box-sizing: border-box; outline: 0px;">close<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">(</span></span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">)</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">;</span></span></div>
<div style="font-size: 12px; font-weight: 700;">
<span class="token punctuation" style="box-sizing: border-box; outline: 0px;"><span style="color: #0b5394; font-family: Arial, Helvetica, sans-serif;"><br /></span></span></div>
<div style="font-size: 12px; font-weight: 700;">
<span class="token punctuation" style="box-sizing: border-box; outline: 0px;"><span style="color: #0b5394; font-family: Arial, Helvetica, sans-serif;"><br /></span></span></div>
<div style="font-size: 12px;">
<span class="token punctuation" style="box-sizing: border-box; outline: 0px;"><span style="background-color: white; font-size: 18px; white-space: normal;"><span style="color: red; font-family: Arial, Helvetica, sans-serif;"><b>To create database and table</b></span></span></span></div>
<div style="font-size: 12px;">
<span class="token punctuation" style="box-sizing: border-box; outline: 0px;"><span style="background-color: white; font-size: 18px; white-space: normal;"><span style="color: red; font-family: Arial, Helvetica, sans-serif;"><b><br /></b></span></span></span></div>
<div style="font-size: 12px; font-weight: 700;">
<span class="token punctuation" style="box-sizing: border-box; outline: 0px;"><span style="color: #0b5394; font-family: Arial, Helvetica, sans-serif;"><span class="token comment" spellcheck="true" style="box-sizing: border-box; outline: 0px;">//First create database
</span><span class="token constant" style="box-sizing: border-box; outline: 0px;">CREATE</span> <span class="token constant" style="box-sizing: border-box; outline: 0px;">DATABASE</span> <span class="token string" style="box-sizing: border-box; outline: 0px;">'college'</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">;</span><span class="token comment" spellcheck="true" style="box-sizing: border-box; outline: 0px;">
//Then create table
</span><span class="token constant" style="box-sizing: border-box; outline: 0px;">CREATE</span> <span class="token constant" style="box-sizing: border-box; outline: 0px;">TABLE</span> <span class="token string" style="box-sizing: border-box; outline: 0px;">'students'</span> <span class="token punctuation" style="box-sizing: border-box; outline: 0px;">(</span>
<span class="token string" style="box-sizing: border-box; outline: 0px;">'student_id'</span> <span class="token function" style="box-sizing: border-box; outline: 0px;">int<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">(</span></span><span class="token number" style="box-sizing: border-box; outline: 0px;">11</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">)</span> <span class="token constant" style="box-sizing: border-box; outline: 0px;">NOT</span> <span class="token keyword" style="box-sizing: border-box; outline: 0px;">NULL</span> <span class="token constant" style="box-sizing: border-box; outline: 0px;">AUTO_INCREMENT</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">,</span>
<span class="token string" style="box-sizing: border-box; outline: 0px;">'student_name'</span> <span class="token function" style="box-sizing: border-box; outline: 0px;">varchar<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">(</span></span><span class="token number" style="box-sizing: border-box; outline: 0px;">255</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">)</span> <span class="token constant" style="box-sizing: border-box; outline: 0px;">NOT</span> <span class="token keyword" style="box-sizing: border-box; outline: 0px;">NULL</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">,</span>
<span class="token string" style="box-sizing: border-box; outline: 0px;">'student_email'</span> <span class="token function" style="box-sizing: border-box; outline: 0px;">varchar<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">(</span></span><span class="token number" style="box-sizing: border-box; outline: 0px;">255</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">)</span> <span class="token constant" style="box-sizing: border-box; outline: 0px;">NOT</span> <span class="token keyword" style="box-sizing: border-box; outline: 0px;">NULL</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">,</span>
<span class="token string" style="box-sizing: border-box; outline: 0px;">'student_city'</span> <span class="token function" style="box-sizing: border-box; outline: 0px;">varchar<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">(</span></span><span class="token number" style="box-sizing: border-box; outline: 0px;">255</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">)</span> <span class="token constant" style="box-sizing: border-box; outline: 0px;">NOT</span> <span class="token keyword" style="box-sizing: border-box; outline: 0px;">NULL</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">,</span>
<span class="token constant" style="box-sizing: border-box; outline: 0px;">PRIMARY</span> <span class="token constant" style="box-sizing: border-box; outline: 0px;">KEY</span> <span class="token punctuation" style="box-sizing: border-box; outline: 0px;">(</span><span class="token string" style="box-sizing: border-box; outline: 0px;">'student_id'</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">)</span>
<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">)</span></span></span></div>
<div>
<span class="token punctuation" style="box-sizing: border-box; outline: 0px;"><h3 style="background-color: white; box-sizing: border-box; line-height: 1.5em; margin: 1em 0px; outline: 0px; transition: all 0.3s ease; white-space: normal;">
<span style="color: red; font-family: Arial, Helvetica, sans-serif; font-size: small;"><b>Php File : view.php</b></span></h3>
<div style="font-size: 12px; font-weight: 700;">
<span style="color: #0b5394; font-family: Arial, Helvetica, sans-serif;"><span class="token markup" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;"><</span>html</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">></span></span></span>
<span class="token markup" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;"><</span>head</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">></span></span></span>
<span class="token markup" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;"><</span>title</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">></span></span></span>insert data in database using mysqli<span class="token markup" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;"></</span>title</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">></span></span></span>
<span class="token markup" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;"><</span>link</span> <span class="token attr-name" style="box-sizing: border-box; outline: 0px;">rel</span><span class="token attr-value" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">=</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span>stylesheet<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span></span> <span class="token attr-name" style="box-sizing: border-box; outline: 0px;">type</span><span class="token attr-value" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">=</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span>text/css<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span></span> <span class="token attr-name" style="box-sizing: border-box; outline: 0px;">href</span><span class="token attr-value" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">=</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span>style.css<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span></span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">></span></span></span>
<span class="token markup" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;"></</span>head</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">></span></span></span>
<span class="token markup" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;"><</span>body</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">></span></span></span>
<span class="token markup" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;"><</span>div</span> <span class="token attr-name" style="box-sizing: border-box; outline: 0px;">id</span><span class="token attr-value" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">=</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span>main<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span></span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">></span></span></span>
<span class="token markup" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;"><</span>h1</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">></span></span></span>Insert data into database using mysqli<span class="token markup" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;"></</span>h1</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">></span></span></span>
<span class="token markup" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;"><</span>div</span> <span class="token attr-name" style="box-sizing: border-box; outline: 0px;">id</span><span class="token attr-value" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">=</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span>login<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span></span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">></span></span></span>
<span class="token markup" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;"><</span>h2</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">></span></span></span>Student's Form<span class="token markup" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;"></</span>h2</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">></span></span></span>
<span class="token markup" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;"><</span>hr</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">/></span></span></span>
<span class="token markup" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;"><</span>form</span> <span class="token attr-name" style="box-sizing: border-box; outline: 0px;">action</span><span class="token attr-value" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">=</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span></span> <span class="token attr-name" style="box-sizing: border-box; outline: 0px;">method</span><span class="token attr-value" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">=</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span>post<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span></span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">></span></span></span>
<span class="token markup" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;"><</span>label</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">></span></span></span>Student Name <span class="token punctuation" style="box-sizing: border-box; outline: 0px;">:</span><span class="token markup" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;"></</span>label</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">></span></span></span>
<span class="token markup" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;"><</span>input</span> <span class="token attr-name" style="box-sizing: border-box; outline: 0px;">type</span><span class="token attr-value" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">=</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span>text<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span></span> <span class="token attr-name" style="box-sizing: border-box; outline: 0px;">name</span><span class="token attr-value" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">=</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span>stu_name<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span></span> <span class="token attr-name" style="box-sizing: border-box; outline: 0px;">id</span><span class="token attr-value" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">=</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span>name<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span></span> <span class="token attr-name" style="box-sizing: border-box; outline: 0px;">required</span><span class="token attr-value" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">=</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span>required<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span></span> <span class="token attr-name" style="box-sizing: border-box; outline: 0px;">placeholder</span><span class="token attr-value" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">=</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span>Please Enter Name<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span></span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">/></span></span></span><span class="token markup" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;"><</span>br</span> <span class="token punctuation" style="box-sizing: border-box; outline: 0px;">/></span></span></span><span class="token markup" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;"><</span>br</span> <span class="token punctuation" style="box-sizing: border-box; outline: 0px;">/></span></span></span>
<span class="token markup" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;"><</span>label</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">></span></span></span>Student Email <span class="token punctuation" style="box-sizing: border-box; outline: 0px;">:</span><span class="token markup" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;"></</span>label</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">></span></span></span>
<span class="token markup" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;"><</span>input</span> <span class="token attr-name" style="box-sizing: border-box; outline: 0px;">type</span><span class="token attr-value" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">=</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span>email<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span></span> <span class="token attr-name" style="box-sizing: border-box; outline: 0px;">name</span><span class="token attr-value" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">=</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span>stu_email<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span></span> <span class="token attr-name" style="box-sizing: border-box; outline: 0px;">id</span><span class="token attr-value" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">=</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span>email<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span></span> <span class="token attr-name" style="box-sizing: border-box; outline: 0px;">required</span><span class="token attr-value" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">=</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span>required<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span></span> <span class="token attr-name" style="box-sizing: border-box; outline: 0px;">placeholder</span><span class="token attr-value" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">=</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span>john123@gmail.com<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span></span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">/></span></span></span><span class="token markup" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;"><</span>br</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">/></span></span></span><span class="token markup" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;"><</span>br</span> <span class="token punctuation" style="box-sizing: border-box; outline: 0px;">/></span></span></span>
<span class="token markup" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;"><</span>label</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">></span></span></span>Student City <span class="token punctuation" style="box-sizing: border-box; outline: 0px;">:</span><span class="token markup" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;"></</span>label</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">></span></span></span>
<span class="token markup" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;"><</span>input</span> <span class="token attr-name" style="box-sizing: border-box; outline: 0px;">type</span><span class="token attr-value" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">=</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span>text<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span></span> <span class="token attr-name" style="box-sizing: border-box; outline: 0px;">name</span><span class="token attr-value" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">=</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span>stu_city<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span></span> <span class="token attr-name" style="box-sizing: border-box; outline: 0px;">id</span><span class="token attr-value" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">=</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span>city<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span></span> <span class="token attr-name" style="box-sizing: border-box; outline: 0px;">required</span><span class="token attr-value" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">=</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span>required<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span></span> <span class="token attr-name" style="box-sizing: border-box; outline: 0px;">placeholder</span><span class="token attr-value" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">=</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span>Please Enter Your City<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span></span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">/></span></span></span><span class="token markup" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;"><</span>br</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">/></span></span></span><span class="token markup" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;"><</span>br</span> <span class="token punctuation" style="box-sizing: border-box; outline: 0px;">/></span></span></span>
<span class="token markup" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;"><</span>input</span> <span class="token attr-name" style="box-sizing: border-box; outline: 0px;">type</span><span class="token attr-value" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">=</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span>submit<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span></span> <span class="token attr-name" style="box-sizing: border-box; outline: 0px;">value</span><span class="token attr-value" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">=</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span> Submit <span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span></span> <span class="token attr-name" style="box-sizing: border-box; outline: 0px;">name</span><span class="token attr-value" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">=</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span>submit<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span></span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">/></span></span></span><span class="token markup" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;"><</span>br</span> <span class="token punctuation" style="box-sizing: border-box; outline: 0px;">/></span></span></span>
<span class="token markup" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;"></</span>form</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">></span></span></span>
<span class="token markup" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;"></</span>div</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">></span></span></span>
<span class="token markup" style="box-sizing: border-box; outline: 0px;"><span class="token comment" spellcheck="true" style="box-sizing: border-box; outline: 0px;"><!-- Right side div --></span></span>
<span class="token markup" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;"><</span>div</span> <span class="token attr-name" style="box-sizing: border-box; outline: 0px;">id</span><span class="token attr-value" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">=</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span>formget<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span></span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">></span></span></span>
<span class="token markup" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;"><</span>a</span> <span class="token attr-name" style="box-sizing: border-box; outline: 0px;">href</span><span class="token attr-value" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">=</span>https://www.formget.com/app</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">></span></span></span><span class="token markup" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;"><</span>img</span> <span class="token attr-name" style="box-sizing: border-box; outline: 0px;">src</span><span class="token attr-value" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">=</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span>formget.jpg<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span></span> <span class="token attr-name" style="box-sizing: border-box; outline: 0px;">alt</span><span class="token attr-value" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">=</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span>Online Form Builder<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">"</span></span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">/></span></span></span><span class="token markup" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;"></</span>a</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">></span></span></span>
<span class="token markup" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;"></</span>div</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">></span></span></span>
<span class="token markup" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;"></</span>div</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">></span></span></span>
<span class="token php" style="box-sizing: border-box; outline: 0px;"><span class="token delimiter" style="box-sizing: border-box; outline: 0px;"><?php</span>
<span class="token keyword" style="box-sizing: border-box; outline: 0px;">if</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">(</span><span class="token function" style="box-sizing: border-box; outline: 0px;">isset<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">(</span></span><span class="token global" style="box-sizing: border-box; outline: 0px;">$_POST</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">[</span><span class="token string" style="box-sizing: border-box; outline: 0px;">"submit"</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">]</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">)</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">)</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">{</span>
<span class="token variable" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; outline: 0px;">$servername</span> <span class="token operator" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; outline: 0px;">=</span> <span class="token string" style="box-sizing: border-box; outline: 0px;">"localhost"</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">;</span>
<span class="token variable" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; outline: 0px;">$username</span> <span class="token operator" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; outline: 0px;">=</span> <span class="token string" style="box-sizing: border-box; outline: 0px;">"root"</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">;</span>
<span class="token variable" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; outline: 0px;">$password</span> <span class="token operator" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; outline: 0px;">=</span> <span class="token string" style="box-sizing: border-box; outline: 0px;">""</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">;</span>
<span class="token variable" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; outline: 0px;">$dbname</span> <span class="token operator" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; outline: 0px;">=</span> <span class="token string" style="box-sizing: border-box; outline: 0px;">"college"</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">;</span><span class="token comment" spellcheck="true" style="box-sizing: border-box; outline: 0px;">
// Create connection
</span><span class="token variable" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; outline: 0px;">$conn</span> <span class="token operator" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; outline: 0px;">=</span> <span class="token keyword" style="box-sizing: border-box; outline: 0px;">new</span> <span class="token class-name" style="box-sizing: border-box; outline: 0px;">mysqli</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">(</span><span class="token variable" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; outline: 0px;">$servername</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">,</span> <span class="token variable" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; outline: 0px;">$username</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">,</span> <span class="token variable" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; outline: 0px;">$password</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">,</span> <span class="token variable" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; outline: 0px;">$dbname</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">)</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">;</span><span class="token comment" spellcheck="true" style="box-sizing: border-box; outline: 0px;">
// Check connection
</span><span class="token keyword" style="box-sizing: border-box; outline: 0px;">if</span> <span class="token punctuation" style="box-sizing: border-box; outline: 0px;">(</span><span class="token variable" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; outline: 0px;">$conn</span><span class="token operator" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; outline: 0px;">-</span><span class="token operator" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; outline: 0px;">></span><span class="token property" style="box-sizing: border-box; outline: 0px;">connect_error</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">)</span> <span class="token punctuation" style="box-sizing: border-box; outline: 0px;">{</span>
<span class="token keyword" style="box-sizing: border-box; outline: 0px;">die</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">(</span><span class="token string" style="box-sizing: border-box; outline: 0px;">"Connection failed: "</span> <span class="token punctuation" style="box-sizing: border-box; outline: 0px;">.</span> <span class="token variable" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; outline: 0px;">$conn</span><span class="token operator" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; outline: 0px;">-</span><span class="token operator" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; outline: 0px;">></span><span class="token property" style="box-sizing: border-box; outline: 0px;">connect_error</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">)</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">;</span>
<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">}</span>
<span class="token variable" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; outline: 0px;">$sql</span> <span class="token operator" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; outline: 0px;">=</span> "<span class="token constant" style="box-sizing: border-box; outline: 0px;">INSERT</span> <span class="token constant" style="box-sizing: border-box; outline: 0px;">INTO</span> students <span class="token punctuation" style="box-sizing: border-box; outline: 0px;">(</span>student_name<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">,</span> student_email<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">,</span> student_city<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">)</span>
<span class="token constant" style="box-sizing: border-box; outline: 0px;">VALUES</span> <span class="token punctuation" style="box-sizing: border-box; outline: 0px;">(</span><span class="token string" style="box-sizing: border-box; outline: 0px;">'".$_POST["stu_name"]."'</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">,</span><span class="token string" style="box-sizing: border-box; outline: 0px;">'".$_POST["stu_email"]."'</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">,</span><span class="token string" style="box-sizing: border-box; outline: 0px;">'".$_POST["stu_city"]."'</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">)</span>"<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">;</span>
<span class="token keyword" style="box-sizing: border-box; outline: 0px;">if</span> <span class="token punctuation" style="box-sizing: border-box; outline: 0px;">(</span><span class="token variable" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; outline: 0px;">$conn</span><span class="token operator" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; outline: 0px;">-</span><span class="token operator" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; outline: 0px;">></span><span class="token function" style="box-sizing: border-box; outline: 0px;">query<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">(</span></span><span class="token variable" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; outline: 0px;">$sql</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">)</span> <span class="token operator" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; outline: 0px;">===</span> <span class="token constant" style="box-sizing: border-box; outline: 0px;">TRUE</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">)</span> <span class="token punctuation" style="box-sizing: border-box; outline: 0px;">{</span>
<span class="token keyword" style="box-sizing: border-box; outline: 0px;">echo</span> "<span class="token markup" style="box-sizing: border-box; outline: 0px;"><script type= 'text/javascript'></span><span class="token function" style="box-sizing: border-box; outline: 0px;">alert<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">(</span></span><span class="token string" style="box-sizing: border-box; outline: 0px;">'New record created successfully'</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">)</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">;</span><span class="token markup" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;"></</span>script</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">></span></span></span>"<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">;</span>
<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">}</span> <span class="token keyword" style="box-sizing: border-box; outline: 0px;">else</span> <span class="token punctuation" style="box-sizing: border-box; outline: 0px;">{</span>
<span class="token keyword" style="box-sizing: border-box; outline: 0px;">echo</span> "<span class="token markup" style="box-sizing: border-box; outline: 0px;"><script type= 'text/javascript'></span><span class="token function" style="box-sizing: border-box; outline: 0px;">alert<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">(</span></span>'Error<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">:</span> <span class="token string" style="box-sizing: border-box; outline: 0px;">" . $sql . "</span><span class="token markup" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;"><</span>br</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">></span></span></span><span class="token string" style="box-sizing: border-box; outline: 0px;">" . $conn->error."</span>'<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">)</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">;</span><span class="token markup" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;"></</span>script</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">></span></span></span>"<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">;</span>
<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">}</span>
<span class="token variable" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; outline: 0px;">$conn</span><span class="token operator" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; outline: 0px;">-</span><span class="token operator" style="background: rgba(255, 255, 255, 0.5); box-sizing: border-box; outline: 0px;">></span><span class="token function" style="box-sizing: border-box; outline: 0px;">close<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">(</span></span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">)</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">;</span>
<span class="token punctuation" style="box-sizing: border-box; outline: 0px;">}</span>
<span class="token delimiter" style="box-sizing: border-box; outline: 0px;">?></span></span>
<span class="token markup" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;"></</span>body</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">></span></span></span>
<span class="token markup" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;"></</span>html</span><span class="token punctuation" style="box-sizing: border-box; outline: 0px;">></span></span></span></span></div>
<div style="font-size: 12px; font-weight: 700;">
<span class="token markup" style="box-sizing: border-box; outline: 0px;"><span class="token tag" style="box-sizing: border-box; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; outline: 0px;"><span style="color: #0b5394; font-family: Arial, Helvetica, sans-serif;"><br /></span></span></span></span></div>
<div style="font-size: 12px; font-weight: 700;">
<span class="token markup" style="box-sizing: border-box; color: #383838; outline: 0px;"><span class="token tag" style="box-sizing: border-box; color: #c92c2c; outline: 0px;"><span class="token punctuation" style="box-sizing: border-box; color: #5f6364; outline: 0px;"><br /></span></span></span></div>
</span></div>
</span></div>
</div>
It E Researchhttp://www.blogger.com/profile/02660842566926994686noreply@blogger.com0tag:blogger.com,1999:blog-7822657138986038530.post-47088136037659031892018-02-22T21:27:00.000-08:002018-02-22T21:31:46.130-08:00Update query in php<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjc78MPUzQSGIKXgbfyw1pLtNZQe3nBvtDytRQxThgEqptr7FScFY2xFttErifMuxaSzJ8BNC8iOo3SgpQKQvD7MAIIw4EUP10Iy31GYNAjEgw-zgdKiKtAXh5yQTk-sbAzHQuxTKMvwA/s1600/update-itresearch.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="468" data-original-width="1010" height="296" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjc78MPUzQSGIKXgbfyw1pLtNZQe3nBvtDytRQxThgEqptr7FScFY2xFttErifMuxaSzJ8BNC8iOo3SgpQKQvD7MAIIw4EUP10Iy31GYNAjEgw-zgdKiKtAXh5yQTk-sbAzHQuxTKMvwA/s640/update-itresearch.png" width="640" /></a></div>
<br />
<span style="color: red; font-family: "arial" , "helvetica" , sans-serif; font-size: large;"><b><i style="background-color: white;">mysql update</i></b></span><br />
<span style="background-color: white;"><span style="font-family: "arial" , "helvetica" , sans-serif;">that you have a MySQL table that holds the data of the considerable number of representatives in your organization. One of the segments in this table is called "Status" and it holds a number estimation of how long a representative has functioned at your organization. Shockingly for you, your activity is to refresh these numbers each month.</span></span><br />
<span style="background-color: white;"><span style="font-family: "arial" , "helvetica" , sans-serif;"><br /></span></span>
<br />
<ul style="font-size: 12.8px;">
<li><span style="background-color: white;"><span style="font-family: "arial" , "helvetica" , sans-serif;"><b>UPDATE</b> - Performs an update MySQL query</span></span></li>
<li><span style="background-color: white;"><span style="font-family: "arial" , "helvetica" , sans-serif;"><b>SET</b> - The new values to be placed into the table follow SET</span></span></li>
<li><span style="background-color: white;"><span style="font-family: "arial" , "helvetica" , sans-serif;"><b>WHERE</b> - Limits which rows are affected</span></span></li>
</ul>
<span style="background-color: white;"><span style="font-family: "arial" , "helvetica" , sans-serif;"><br /></span></span>
<br />
<div class="codewrap" style="font-size: 12.8px; margin: 10px; width: 480px;">
<h2 class="specialT" style="font-size: 16.64px; margin: 10px 0px 0px;">
<span style="background-color: white;"><span style="font-family: "arial" , "helvetica" , sans-serif;">PHP & MySQL Code:</span></span></h2>
<pre class="code" style="border: 2px solid rgb(0, 59, 98); font-size: 11px; overflow: auto; padding: 5px 5px 20px; position: relative; width: 470px;"><span style="background-color: white;"><span style="font-family: "arial" , "helvetica" , sans-serif;"><?php
// Connect to MySQL
// Get Sandy's record from the "example" table
$result = mysql_query("UPDATE example SET age='22' WHERE age='21'")
or die(mysql_error());
$result = mysql_query("SELECT * FROM example WHERE age='22'")
or die(mysql_error());
// get the first (and hopefully only) entry from the result
$row = mysql_fetch_array( $result );
echo $row['name']." - ".$row['age']. "<br />";
?>
</span></span></pre>
</div>
<h2 class="specialT" style="font-size: 16.64px; margin: 10px 0px 0px;">
<span style="background-color: white;"><span style="font-family: "arial" , "helvetica" , sans-serif;">Display:</span></span></h2>
<div class="display" style="border: 2px solid rgb(0, 59, 98); font-size: 12.8px; margin: 5px; padding: 7px;">
<span style="background-color: white;"><span style="font-family: "arial" , "helvetica" , sans-serif;">Sandy Smith - 22</span></span></div>
</div>
It E Researchhttp://www.blogger.com/profile/02660842566926994686noreply@blogger.com0tag:blogger.com,1999:blog-7822657138986038530.post-87167442811928730102018-02-22T21:21:00.000-08:002018-02-22T21:31:46.248-08:00Joins Query using php<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhJA00fOJQDJIdV9B3fkeLBkevrnPnVc1wBO9NPU7kvmRjP55qSPDxV-5oosCn5Ec8lZeAhwjqC1RHh7qC9-xx4uG0cF-7L0YRbpxH2EK5JXKe1pr5f-NP91DOK6DQVByeAEilWppQhtw/s1600/join-itesearch.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="300" data-original-width="600" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhJA00fOJQDJIdV9B3fkeLBkevrnPnVc1wBO9NPU7kvmRjP55qSPDxV-5oosCn5Ec8lZeAhwjqC1RHh7qC9-xx4uG0cF-7L0YRbpxH2EK5JXKe1pr5f-NP91DOK6DQVByeAEilWppQhtw/s640/join-itesearch.jpg" width="640" /></a></div>
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">The task of joining MySQL mentions destroying two or more tables in a table. This means that whatever you have learned so far can be applied even after applying everything, to join the table.</span><br />
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<h2 class="specialT" style="font-size: 16.64px; margin: 10px 0px 0px;">
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">family Table:</span></h2>
<div class="display" style="border: 2px solid rgb(0, 59, 98); font-size: 12.8px; margin: 5px; padding: 7px;">
<table border="1"><tbody>
<tr><th><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">Position</span></th><th><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">Age</span></th></tr>
<tr><td><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">Dad</span></td><td><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">41</span></td></tr>
<tr><td><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">Mom</span></td><td><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">45</span></td></tr>
<tr><td><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">Daughter</span></td><td><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">17</span></td></tr>
<tr><td><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">Dog</span></td><td></td></tr>
</tbody></table>
</div>
<h2 class="specialT" style="font-size: 16.64px; margin: 10px 0px 0px;">
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">food Table:</span></h2>
<div class="display" style="border: 2px solid rgb(0, 59, 98); font-size: 12.8px; margin: 5px; padding: 7px;">
<table border="1"><tbody>
<tr><th><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">Meal</span></th><th><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">Position</span></th></tr>
<tr><td><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">Steak</span></td><td><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">Dad</span></td></tr>
<tr><td><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">Salad</span></td><td><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">Mom</span></td></tr>
<tr><td><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">Spinach Soup</span></td><td></td></tr>
<tr><td><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">Tacos</span></td><td><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">Dad</span></td></tr>
</tbody></table>
</div>
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<div class="codewrap" style="font-size: 12.8px; margin: 10px; width: 480px;">
<h2 class="specialT" style="font-size: 16.64px; margin: 10px 0px 0px;">
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">PHP and MySQL Code:</span></h2>
<pre class="code" style="border: 2px solid rgb(0, 59, 98); font-size: 11px; overflow: auto; padding: 5px 5px 20px; position: relative; width: 470px;"><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><?php
// Make a MySQL Connection
// Construct our join query
$query = "SELECT <span style="color: red;">family.Position, food.Meal</span> ".
"FROM family, food ".
"WHERE <span style="color: red;">family.Position = food.Position</span>";
$result = mysql_query($query) or die(mysql_error());
// Print out the contents of each row into a table
while($row = mysql_fetch_array($result)){
echo $row['Position']. " - ". $row['Meal'];
echo "<br />";
}
?>
</span></pre>
</div>
<div style="font-size: 12.8px; padding-left: 15px; padding-right: 15px; text-indent: 25px;">
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">The statement "WHERE family.Position = food.Position" will restrict the results to the rows where the <i>Position</i> exists in <b>both</b> the "family" and "food" tables.</span></div>
<h2 class="specialT" style="font-size: 16.64px; margin: 10px 0px 0px;">
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">Display:</span></h2>
<div class="display" style="border: 2px solid rgb(0, 59, 98); font-size: 12.8px; margin: 5px; padding: 7px;">
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">Dad - Steak<br />Mom - Salad<br />Dad - Tacos</span></div>
<div style="font-size: 12.8px; padding-left: 15px; padding-right: 15px; text-indent: 25px;">
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">Those are the results of our PHP script. Let's analyze the tables to make sure we agree with these results.</span></div>
<h2 class="specialT" style="font-size: 16.64px; margin: 10px 0px 0px;">
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">Compare the Tables:</span></h2>
<div class="display" style="border: 2px solid rgb(0, 59, 98); font-size: 12.8px; margin: 5px; padding: 7px;">
<table border="1"><tbody>
<tr><th><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">Position</span></th><th><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">Age</span></th></tr>
<tr><td><span style="background-color: white; color: red; font-family: Arial, Helvetica, sans-serif;">Dad</span></td><td><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">41</span></td></tr>
<tr><td><span style="background-color: white; color: red; font-family: Arial, Helvetica, sans-serif;">Mom</span></td><td><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">45</span></td></tr>
<tr><td><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">Daughter</span></td><td><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">17</span></td></tr>
<tr><td><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">Dog</span></td><td></td></tr>
</tbody></table>
<table border="1"><tbody>
<tr><th><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">Meal</span></th><th><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">Position</span></th></tr>
<tr><td><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">Steak</span></td><td><span style="background-color: white; color: red; font-family: Arial, Helvetica, sans-serif;">Dad</span></td></tr>
<tr><td><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">Salad</span></td><td><span style="background-color: white; color: red; font-family: Arial, Helvetica, sans-serif;">Mom</span></td></tr>
<tr><td><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">Spinach Soup</span></td><td></td></tr>
<tr><td><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">Tacos</span></td><td><span style="background-color: white; color: red; font-family: Arial, Helvetica, sans-serif;">Dad</span></td></tr>
</tbody></table>
</div>
<br /></div>
It E Researchhttp://www.blogger.com/profile/02660842566926994686noreply@blogger.com0tag:blogger.com,1999:blog-7822657138986038530.post-22478253265471741862018-02-22T21:17:00.000-08:002018-02-22T21:31:46.011-08:00Fetch Data by Array using Php<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgNBxXmuNnASmj6yTlvqNsmEMU9MSEKo4dAglYUEZUV2gmnTlxPZ1sNcCIRUlLZjo55ZNksx6HpCr0cZEClgOizAokMK7BLoppNoXDf4SZSZTQannD55SN0w-5O3R2OqbEcpdObijItsw/s1600/Retrieve-Data-From-MySQL-Database-Using-mysqli_fetch_array-Function-it-eresearch.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="437" data-original-width="490" height="356" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgNBxXmuNnASmj6yTlvqNsmEMU9MSEKo4dAglYUEZUV2gmnTlxPZ1sNcCIRUlLZjo55ZNksx6HpCr0cZEClgOizAokMK7BLoppNoXDf4SZSZTQannD55SN0w-5O3R2OqbEcpdObijItsw/s400/Retrieve-Data-From-MySQL-Database-Using-mysqli_fetch_array-Function-it-eresearch.png" width="400" /></a></div>
<br />
<span style="background-color: white; color: red; font-family: Arial, Helvetica, sans-serif; font-size: large;"><b>mysql fetch array</b></span><br />
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">MySQL doesn't have a Fetch Array work. mysql_fetch_array is really a PHP work that enables you to get to information put away in the outcome came back from a fruitful mysql_query. On the off chance that you have been hopping around our MySQL Tutorial then you would have just observed this capacity flying up everywhere.</span><br />
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="background-color: white; color: red; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="background-color: white; color: red; font-family: Arial, Helvetica, sans-serif;"><b>mysql_fetch_array: why use it?.</b></span><br />
<h2 class="specialT" style="font-size: 16.64px; margin: 10px 0px 0px;">
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">PHP and MySQL Code:</span></h2>
<pre class="code" style="border: 2px solid rgb(0, 59, 98); font-size: 11px; overflow: auto; padding: 5px 5px 20px; position: relative; width: 470px;"><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><?php
$result = mysql_query("SELECT * FROM example");
?></span></pre>
<span style="background-color: white; color: red; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="background-color: white; color: red; font-family: Arial, Helvetica, sans-serif;"><b>row of data</b></span><br />
<h2 class="specialT" style="font-size: 16.64px; margin: 10px 0px 0px;">
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">xample MySQL Table:</span></h2>
<div class="display" style="border: 2px solid rgb(0, 59, 98); font-size: 12.8px; margin: 5px; padding: 7px;">
<table border="1"><tbody>
<tr><th><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">name</span></th><th><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">age</span></th></tr>
<tr><td><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">Timmy Mellowman</span></td><td><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">23</span></td></tr>
<tr><td><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">Sandy Smith</span></td><td><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">21</span></td></tr>
<tr><td><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">Bobby Wallace</span></td><td><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">15</span></td></tr>
</tbody></table>
</div>
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="background-color: white; color: red; font-family: Arial, Helvetica, sans-serif;"><b>getting a row of data using mysql_fetch_array</b></span><br />
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<div class="codewrap" style="font-size: 12.8px; margin: 10px; width: 480px;">
<h2 class="specialT" style="font-size: 16.64px; margin: 10px 0px 0px;">
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">PHP and MySQL Code:</span></h2>
<pre class="code" style="border: 2px solid rgb(0, 59, 98); font-size: 11px; overflow: auto; padding: 5px 5px 20px; position: relative; width: 470px;"><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><?php
// Make a MySQL Connection
$query = "SELECT * FROM example";
$result = mysql_query($query) or die(mysql_error());
$row = mysql_fetch_array($result) or die(mysql_error());
echo $row['<span style="color: red;">name</span>']. " - ". $row['<span style="color: red;">age</span>'];
?>
</span></pre>
</div>
<h2 class="specialT" style="font-size: 16.64px; margin: 10px 0px 0px;">
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">Display:</span></h2>
<div class="display" style="border: 2px solid rgb(0, 59, 98); font-size: 12.8px; margin: 5px; padding: 7px;">
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">Timmy Mellowman - 23</span></div>
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="background-color: white; color: red; font-family: Arial, Helvetica, sans-serif;"><b>fetch array while loop</b></span><br />
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<h2 class="specialT" style="font-size: 16.64px; margin: 10px 0px 0px;">
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">PHP and MySQL Code:</span></h2>
<pre class="code" style="border: 2px solid rgb(0, 59, 98); font-size: 11px; overflow: auto; padding: 5px 5px 20px; position: relative; width: 470px;"><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><?php
// Make a MySQL Connection
$query = "SELECT * FROM example";
$result = mysql_query($query) or die(mysql_error());
while($row = mysql_fetch_array($result)){
<indent>echo $row['name']. " - ". $row['age'];
echo "<br />";</indent>
}
?></span></pre>
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<h2 class="specialT" style="font-size: 16.64px; margin: 10px 0px 0px;">
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">Display:</span></h2>
<div class="display" style="border: 2px solid rgb(0, 59, 98); font-size: 12.8px; margin: 5px; padding: 7px;">
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">Timmy Mellowman - 23<br />Sandy Smith - 21<br />Bobby Wallace - 15</span></div>
<br /></div>
It E Researchhttp://www.blogger.com/profile/02660842566926994686noreply@blogger.com0tag:blogger.com,1999:blog-7822657138986038530.post-50013408115201892262018-02-22T21:13:00.000-08:002018-02-22T21:31:46.169-08:00Fetch Data from Mysql using Php<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjtT1odhPLT4cnoqTpSrbiES5MtKqY0iKGXqadoeW2E7CT-BBh7Dq_sZ8VCcbXvRkBkQEMx68BXQCqzW2QLklRURkRxr9nO0nNi4ZS3dFnHVRoE8Evq0bRbP2ktzwG6TDiwzjk0dx8X4g/s1600/display-mysql-data-iteresearch.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="323" data-original-width="527" height="392" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjtT1odhPLT4cnoqTpSrbiES5MtKqY0iKGXqadoeW2E7CT-BBh7Dq_sZ8VCcbXvRkBkQEMx68BXQCqzW2QLklRURkRxr9nO0nNi4ZS3dFnHVRoE8Evq0bRbP2ktzwG6TDiwzjk0dx8X4g/s640/display-mysql-data-iteresearch.png" width="640" /></a></div>
<br />
<span style="background-color: white; color: red; font-family: Arial, Helvetica, sans-serif; font-size: large;"><b>Retrieving data with php & mysql</b></span><br />
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">Normally the vast majority of the work finished with MySQL includes pulling down information from a MySQL database. In MySQL, information is recovered with the "SELECT" watchword. Consider SELECT working an indistinguishable path from it does on your PC. In the event that you needed to duplicate some data in a record, you would first choose the coveted data, at that point reorder.</span><br />
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><b>using mysql select & from</b></span><br />
<div class="codewrap" style="margin: 10px; width: 480px;">
<h2 class="specialT" style="margin: 10px 0px 0px;">
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif; font-size: small;">PHP & MySQL Code:</span></h2>
<pre class="code" style="border: 2px solid rgb(0, 59, 98); overflow: auto; padding: 5px 5px 20px; position: relative; width: 470px;"><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><?php
// Make a MySQL Connection
mysql_connect("localhost", "admin", "1admin") or die(mysql_error());
mysql_select_db("test") or die(mysql_error());
// Retrieve all the data from the "example" table
$result = mysql_query("SELECT * FROM example")
or die(mysql_error());
// store the record of the "example" table into $row
$row = mysql_fetch_array( $result );
// Print out the contents of the entry
echo "Name: ".$row['name'];
echo " Age: ".$row['age'];
?>
</span></pre>
</div>
<h2 class="specialT" style="margin: 10px 0px 0px;">
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif; font-size: small;">Display:</span></h2>
<div class="display" style="border: 2px solid rgb(0, 59, 98); margin: 5px; padding: 7px;">
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">Name: Tim Mellowman Age: 23</span></div>
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="background-color: white; color: red; font-family: Arial, Helvetica, sans-serif;"><b>'$result = mysql_query("select * from example")'</b></span><br />
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">When you play out a SELECT question on the database it will restore a MySQL Resource that holds everything from your MySQL table, "illustration". We need to utilize this Resource in our PHP code, so we have to store it in a variable, $result.</span><br />
<span style="background-color: white; color: red; font-family: Arial, Helvetica, sans-serif;"><b><br /></b></span>
<span style="background-color: white; color: red; font-family: Arial, Helvetica, sans-serif;"><b>'select * from example'</b></span><br />
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">Indeed, this is a halfway rehash of a similar line of code, yet we needed to clarify this MySQL proclamation in more prominent detail once more! </span><br />
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">In English, this line of code peruses "Select each passage from the table case". The reference bullet is the trump card in MySQL which just advises MySQL to incorporate each and every section for that table.</span><br />
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="background-color: white; color: red; font-family: Arial, Helvetica, sans-serif;"><b>'$row = mysql_fetch_array( $result );'</b></span><br />
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">$result is currently a MySQL Resource containing information from your MySQL table, "case". Information is being put away in $result, yet it isn't yet unmistakable to guests of your site. When we pass $result into the mysql_fetch_array work - mysql_fetch_array($result) - an acquainted cluster (name, age) is returned. </span><br />
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">In our MySQL table "case," there are just two fields that we think about: name and age. These names are the keys to extricating the information from our cooperative exhibit. To get the name we utilize $row['name'] and to get the age we utilize $row['age'].</span><br />
<br /></div>
It E Researchhttp://www.blogger.com/profile/02660842566926994686noreply@blogger.com0tag:blogger.com,1999:blog-7822657138986038530.post-87048384833435659512018-02-22T21:05:00.001-08:002018-02-22T21:31:46.209-08:00Insert Data code using php<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjLMhRadYbLmqp-nozd989UUb-492-J7A5e90CYXSIq5JhZZD4-n-8AKVN3wItdwQTCBa2IeUk49D_wuYiLHKDVw-m3ELc5HowZz3l0Z8YpBCzM7_0vGYGdyDwfXeDTm7Wye9EWS8E8jw/s1600/Insertion-in-PHP-iteresearch.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="511" data-original-width="617" height="530" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjLMhRadYbLmqp-nozd989UUb-492-J7A5e90CYXSIq5JhZZD4-n-8AKVN3wItdwQTCBa2IeUk49D_wuYiLHKDVw-m3ELc5HowZz3l0Z8YpBCzM7_0vGYGdyDwfXeDTm7Wye9EWS8E8jw/s640/Insertion-in-PHP-iteresearch.jpg" width="640" /></a></div>
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<h2 class="specialT" style="margin: 10px 0px 0px;">
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif; font-size: small;">PHP & MySQL Code:</span></h2>
<pre class="code" style="border: 2px solid rgb(0, 59, 98); overflow: auto; padding: 5px 5px 20px; position: relative; width: 470px;"><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><?php
// Make a MySQL Connection
mysql_connect("localhost", "admin", "1admin") or die(mysql_error());
mysql_select_db("test") or die(mysql_error());
// Insert a row of information into the table "example"
mysql_query("INSERT INTO example
(name, age) VALUES('Timmy Mellowman', '23' ) ")
or die(mysql_error());
mysql_query("INSERT INTO example
(name, age) VALUES('Sandy Smith', '21' ) ")
or die(mysql_error());
mysql_query("INSERT INTO example
(name, age) VALUES('Bobby Wallace', '15' ) ")
or die(mysql_error());
echo "Data Inserted!";
?></span></pre>
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<h2 class="specialT" style="margin: 10px 0px 0px;">
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif; font-size: small;">Display:</span></h2>
<div class="display" style="border: 2px solid rgb(0, 59, 98); margin: 5px; padding: 7px;">
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">Data Inserted!</span></div>
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><b><br /></b></span>
<span style="background-color: white; color: red; font-family: Arial, Helvetica, sans-serif;"><b>'mysql_query("insert into example'</b></span><br />
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">Again we are utilizing the mysql_query work. "Embed INTO" implies that information will be put into a table. The name of the table we determined to embed information into was "illustration"</span><br />
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="background-color: white; color: red; font-family: Arial, Helvetica, sans-serif;"><b>'(name, age) values('timmy mellowman', '23' ) ")'</b></span><br />
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">"(name, age)" are the two segments we need to include information into. "Qualities" implies that what takes after is the information to be put into the sections that we simply determined. Here we enter the name Timmy Mellowman for "name", and 23 for "age".</span><br />
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<br /></div>
It E Researchhttp://www.blogger.com/profile/02660842566926994686noreply@blogger.com0tag:blogger.com,1999:blog-7822657138986038530.post-32971931584523896162018-02-22T21:00:00.000-08:002018-02-22T21:31:46.050-08:00Create Table mysql using php<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUobb3leiSUAc2Mr5RaqgqOIuI7xbUAvDSoNcd6R6AOYUZKBU0oeGgbM8jUphimRJMOwUVKofoos1MLYRMbociHMxQZi4cqb4XXY1_JhV6Dszlbu_16DS_iO3jdkXGxb6fKEtR-a0Rqg/s1600/php-admin-table-create-iteresearch.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="322" data-original-width="611" height="336" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUobb3leiSUAc2Mr5RaqgqOIuI7xbUAvDSoNcd6R6AOYUZKBU0oeGgbM8jUphimRJMOwUVKofoos1MLYRMbociHMxQZi4cqb4XXY1_JhV6Dszlbu_16DS_iO3jdkXGxb6fKEtR-a0Rqg/s640/php-admin-table-create-iteresearch.png" width="640" /></a></div>
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<br />
<table align="center" bgcolor="white" border="1" style="color: black;"><tbody>
<tr><th></th><th><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">C1 (Name)</span></th><th><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">C2 (Age)</span></th><th><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">C3 (Weight)</span></th></tr>
<tr><td><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">R1</span></td><td><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">R1 C1 (John)</span></td><td><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">R1 C2 (21)</span></td><td><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">R1 C3 (120)</span></td></tr>
<tr><td><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">R2</span></td><td><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">R2 C1 (Big Sally)</span></td><td><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">R2 C2 (27)</span></td><td><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">R2 C3 (400)</span></td></tr>
<tr><td><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">R3</span></td><td><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">R3 C1 (Tiny Tim)</span></td><td><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">R3 C2 (6)</span></td><td><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">R3 C3 (35)</span></td></tr>
<tr><td><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">R4</span></td><td><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">R4 C1 (Normal Ned)</span></td><td><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">R4 C2 (35)</span></td><td><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">R4 C3 (160)<br /></span></td></tr>
</tbody></table>
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">Before you can enter information (lines) into a table, you should first characterize what sorts of information will be put away (sections). We are currently going to outline a MySQL inquiry to summon our table from database arrive. In future lessons we will utilize this table, so make certain to enter this question effectively!</span><br />
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<div class="codewrap" style="margin: 10px; width: 480px;">
<h2 class="specialT" style="margin: 10px 0px 0px;">
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif; font-size: small;">PHP & MySQL Code:</span></h2>
<pre class="code" style="border: 2px solid rgb(0, 59, 98); overflow: auto; padding: 5px 5px 20px; position: relative; width: 470px;"><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><?php
// Make a MySQL Connection
mysql_connect("localhost", "admin", "1admin") or die(mysql_error());
mysql_select_db("test") or die(mysql_error());
// Create a MySQL table in the selected database
mysql_query("CREATE TABLE example(
id INT NOT NULL AUTO_INCREMENT,
PRIMARY KEY(id),
name VARCHAR(30),
age INT)")
or die(mysql_error());
echo "Table Created!";
?>
</span></pre>
</div>
<h2 class="specialT" style="margin: 10px 0px 0px;">
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif; font-size: small;">Display:</span></h2>
<div class="display" style="border: 2px solid rgb(0, 59, 98); margin: 5px; padding: 7px;">
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">Table Created!</span></div>
<span style="background-color: white; color: red; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="background-color: white; color: red; font-family: Arial, Helvetica, sans-serif; font-size: large;"><b>'id int not null auto_increment'</b></span><br />
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">Here we create a column "ID", which adds a new entry each time to the table. Previously, the id = 1 in the table, the second line id = 2, the third line id = 3, and so on.</span><br />
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">The column "id" is nothing that we need to worry after creating this table, because it is automatically calculated in MySQL</span><br />
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><b>INT - </b>stands for integer or whole number. 'Id' is defined as an integer</span><br />
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><b>No Taps -</b> These are actually two keywords, but together they say that this column can not be empty. There is no entry faucet, if it has some value, while no value is available.</span><br />
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><b>AUTO_INCREMENT -</b> A new entry is added every time, value will increase by 1</span><br />
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="background-color: white; color: red; font-family: Arial, Helvetica, sans-serif; font-size: large;"><b>primary key (id)</b></span><br />
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">Primary KEY is utilized as a one of a kind identifier for the lines. Here we have made "id" the PRIMARY KEY for this table. This implies no two ids can be the same, or else we will keep running into inconvenience. This is the reason we made "id" an auto-increasing counter in the past line of code.</span><br />
<span style="background-color: white; color: blue; font-family: Arial, Helvetica, sans-serif; font-size: large;"><b><br /></b></span>
<span style="background-color: white; color: red; font-family: Arial, Helvetica, sans-serif; font-size: large;"><b>name varchar(30)</b></span><br />
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">Here we create a new column with the name "name"! VARCHAR stands for "variable character" "Character" means that you can enter any type of information entered in this column (letters, numbers, symbols, etc.). This is "variable" because it can adjust its size to store the number of 0 characters and a specified maximum of characters.</span><br />
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">We will most likely store the letter (AZ, AZ) just to use this name. The maximum number of characters in the number inside the bracket is determined. In this case, the maximum is 30.</span><br />
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="background-color: white; color: red; font-family: Arial, Helvetica, sans-serif;"><b>'or die(mysql_error());'</b></span><br />
<span style="background-color: white; color: red; font-family: Arial, Helvetica, sans-serif;"><b><br /></b></span>
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">If there is a problem in the table creation process, it will print an error</span><br />
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<br /></div>
It E Researchhttp://www.blogger.com/profile/02660842566926994686noreply@blogger.com0tag:blogger.com,1999:blog-7822657138986038530.post-44794192629483343322018-02-22T20:53:00.000-08:002018-02-22T21:31:46.090-08:00Connect Database using PHP<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjO7mGVX79DX2_vVf8KkPHxmOAetct7ms49xy6n3RVlJXB3iUE4xfe2D_bi8KoaPEOL1zddE4peHK8mHLn9XDS6XJLqHKsfwnf1I3J0Nd26ESyKZh9ChGf0MmLZbUsfGsJRljO1NPmHzw/s1600/php-database-iteresearch.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="720" data-original-width="1280" height="360" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjO7mGVX79DX2_vVf8KkPHxmOAetct7ms49xy6n3RVlJXB3iUE4xfe2D_bi8KoaPEOL1zddE4peHK8mHLn9XDS6XJLqHKsfwnf1I3J0Nd26ESyKZh9ChGf0MmLZbUsfGsJRljO1NPmHzw/s640/php-database-iteresearch.jpg" width="640" /></a></div>
<span style="background-color: white; color: red; font-family: Arial, Helvetica, sans-serif; font-size: large;"><b><i><br /></i></b></span>
<span style="background-color: white; color: red; font-family: Arial, Helvetica, sans-serif; font-size: large;"><b><i>mysql connect</i></b></span><br />
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">Before you can do anything with MySQL in PHP, you must first establish a connection in the database of your web host. It is done with the MySQL connect function.</span><br />
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="background-color: white; color: red; font-family: Arial, Helvetica, sans-serif; font-size: large;"><b><i>mysql localhost</i></b></span><br />
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">On the off chance that you've been around the web a while, you'll realize that IP addresses are utilized as identifiers for PCs and web servers. In this case of an association content, we accept that the MySQL benefit is running on an indistinguishable machine from the content. </span><br />
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">At the point when the PHP content and MySQL are on a similar machine, you can utilize localhost as the deliver you wish to interface with. localhost is an alternate route to simply have the machine associate with itself. In the event that your MySQL benefit is running at a different area you should embed the IP address or URL set up of localhost. It would be ideal if you contact your web have for more points of interest if localhost does not work.</span><br />
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<div class="codewrap" style="margin: 10px; width: 480px;">
<h2 class="specialT" style="margin: 10px 0px 0px;">
<span style="background-color: white; color: blue; font-family: Arial, Helvetica, sans-serif; font-size: small;">PHP & MySQL Code:</span></h2>
<pre class="code" style="border: 2px solid rgb(0, 59, 98); overflow: auto; padding: 5px 5px 20px; position: relative; width: 470px;"><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><?php
mysql_connect("localhost", "admin", "1admin") or die(mysql_error());
echo "Connected to MySQL<br />";
?>
</span></pre>
</div>
<h2 class="specialT" style="margin: 10px 0px 0px;">
<span style="background-color: white; color: blue; font-family: Arial, Helvetica, sans-serif; font-size: small;">Display:</span></h2>
<div class="display" style="border: 2px solid rgb(0, 59, 98); margin: 5px; padding: 7px;">
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">Connected to MySQL</span></div>
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">If you load the above PHP scripts on your webserver and everything works well, you should see "connected to MySQL" when viewing the .php page.</span><br />
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">The Mysql_connect function takes three arguments. The I server, user name and password were in our example above these arguments:</span><br />
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">Server - localhost</span><br />
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">Username - Administrator</span><br />
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">Password - 1 day</span><br />
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">choosing the working database</span><br />
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<div class="codewrap" style="margin: 10px; width: 480px;">
<h2 class="specialT" style="margin: 10px 0px 0px;">
<span style="background-color: white; color: blue; font-family: Arial, Helvetica, sans-serif; font-size: small;">PHP & MySQL Code:</span></h2>
<pre class="code" style="border: 2px solid rgb(0, 59, 98); overflow: auto; padding: 5px 5px 20px; position: relative; width: 470px;"><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><?php
mysql_connect("localhost", "admin", "1admin") or die(mysql_error());
echo "Connected to MySQL<br />";
<span style="color: red;">mysql_select_db("test")</span> or die(mysql_error());
echo "Connected to Database";
?>
</span></pre>
</div>
<h2 class="specialT" style="margin: 10px 0px 0px;">
<span style="background-color: white; color: blue; font-family: Arial, Helvetica, sans-serif; font-size: small;">Display:</span></h2>
<div class="display" style="border: 2px solid rgb(0, 59, 98); margin: 5px; padding: 7px;">
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">Connected to MySQL<br />Connected to Database</span></div>
<br /></div>
It E Researchhttp://www.blogger.com/profile/02660842566926994686noreply@blogger.com0tag:blogger.com,1999:blog-7822657138986038530.post-23537481743826842532018-02-19T23:04:00.001-08:002018-02-20T00:51:35.410-08:00Create Database<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhataXNgsXLFrMrmPH2YLX-Nt19mwSjnLoD0S9YQD6YDUqL9Umx1aUZYhJekAYCUfAzT0gimYHrySgD8kUcPm59ryRFTUDEfSyD2qo3qqY-o3E9ToQJWVXm2f4-H2NYZi7342J1GzWOfg/s1600/unnamed.gif" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="492" data-original-width="649" height="302" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhataXNgsXLFrMrmPH2YLX-Nt19mwSjnLoD0S9YQD6YDUqL9Umx1aUZYhJekAYCUfAzT0gimYHrySgD8kUcPm59ryRFTUDEfSyD2qo3qqY-o3E9ToQJWVXm2f4-H2NYZi7342J1GzWOfg/s400/unnamed.gif" width="400" /></a></div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="font-family: Arial, Helvetica, sans-serif;">When we get a necessity for a database venture, even before making tables and other database objects, we require a database to be made first. This is the compartment that we need at first. Give us a chance to build up a straightforward database for library. As we said above, first thing we have to do is to make library database. This is a solitary compartment where we can have different clients, and their DB objects.</span><br />
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="font-family: Arial, Helvetica, sans-serif;"><b>Syntax - </b></span><br />
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="font-family: Arial, Helvetica, sans-serif;"><span style="background-color: white; box-sizing: inherit; color: mediumblue; font-size: 16px;">CREATE</span><span style="background-color: white; font-size: 16px;"> </span><span style="background-color: white; box-sizing: inherit; color: mediumblue; font-size: 16px;">DATABASE</span><span style="background-color: white; font-size: 16px;"> </span><em style="background-color: white; box-sizing: inherit; font-size: 16px;">databasename</em><span style="background-color: white; font-size: 16px;">;</span></span><br />
<span style="background-color: white; font-size: 16px;"><span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></span>
<span style="background-color: white; font-size: 16px;"><span style="font-family: Arial, Helvetica, sans-serif;"><b>Example -</b></span></span><br />
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span>
<pre class="prettyprint prettyprinted" style="background-color: #333333; border-radius: 4px; border: 1px solid rgb(237, 237, 237); box-sizing: border-box; color: white; font-size: 13px; line-height: 1.42857; margin-bottom: 10px; overflow: auto; padding: 9.5px; word-break: break-all; word-wrap: break-word;"><code style="background-color: transparent; border-radius: 0px; box-sizing: border-box; color: inherit; font-size: inherit; overflow: scroll; padding: 0px; word-break: normal; word-wrap: normal;"><span style="font-family: Arial, Helvetica, sans-serif;"><span class="pln" style="box-sizing: border-box;">CREATE DATABASE library</span><span class="pun" style="box-sizing: border-box;">;</span></span></code></pre>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span>
<br /></div>
It E Researchhttp://www.blogger.com/profile/02660842566926994686noreply@blogger.com0tag:blogger.com,1999:blog-7822657138986038530.post-48934610548885894382018-02-19T22:25:00.001-08:002018-02-20T00:51:35.417-08:00What is DBMS<div dir="ltr" style="text-align: left;" trbidi="on">
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhXrEwq04IV6_HiI9_fXp8jFg4wBGcZocdXZ4P0a57M2Oqd-C-bDfs-E1Yr8UkHnzDtp-Yvzar4xk7Pm3ftgUywfoAQtdy5mWRrivYMqh0YToKQJfy26KeJqO7waOhPYWW6FLXE4XS_gw/s1600/dbms.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="381" data-original-width="624" height="390" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhXrEwq04IV6_HiI9_fXp8jFg4wBGcZocdXZ4P0a57M2Oqd-C-bDfs-E1Yr8UkHnzDtp-Yvzar4xk7Pm3ftgUywfoAQtdy5mWRrivYMqh0YToKQJfy26KeJqO7waOhPYWW6FLXE4XS_gw/s640/dbms.png" width="640" /></a></div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="font-family: Arial, Helvetica, sans-serif;">DBMS remains for Database Management System. We can break it like this DBMS = Database + Management System. Database is an accumulation of information and Management System is an arrangement of projects to store and recover those information. In view of this we can characterize DBMS like this: DBMS is a gathering of between related information and set of projects to store and access those information in a simple and powerful way. Here are the DBMS notes to enable you to learn database frameworks in a Systematic way. </span><br />
<span style="font-family: Arial, Helvetica, sans-serif;"><b><br /></b></span>
<ul style="background-color: white; box-sizing: border-box; margin: 0px 0px 26px 40px; padding: 0px;">
<li style="box-sizing: border-box; list-style-type: disc;"><span style="color: #666666; font-family: Arial, Helvetica, sans-serif;"><b>Introduction to DBMS</b></span><ul style="box-sizing: border-box; margin: 0px 0px 0px 40px; padding: 0px;">
<li style="box-sizing: border-box; list-style-type: disc;"><span style="color: #666666; font-family: Arial, Helvetica, sans-serif;">DBMS Applications</span></li>
<li style="box-sizing: border-box; list-style-type: disc;"><span style="color: #666666; font-family: Arial, Helvetica, sans-serif;">Advantages of DBMS over file processing system</span></li>
</ul>
</li>
<li style="box-sizing: border-box; list-style-type: disc;"><span style="color: #666666; font-family: Arial, Helvetica, sans-serif;"><b>View of Data</b></span><ul style="box-sizing: border-box; margin: 0px 0px 0px 40px; padding: 0px;">
<li style="box-sizing: border-box; list-style-type: disc;"><span style="color: #666666; font-family: Arial, Helvetica, sans-serif;">Data Abstraction</span></li>
<li style="box-sizing: border-box; list-style-type: disc;"><span style="color: #666666; font-family: Arial, Helvetica, sans-serif;">Instances and Schemas</span></li>
</ul>
</li>
<li style="box-sizing: border-box; list-style-type: disc;"><span style="color: #666666; font-family: Arial, Helvetica, sans-serif;"><b>Data Models in DBMS</b></span><ul style="box-sizing: border-box; margin: 0px 0px 0px 40px; padding: 0px;">
<li style="box-sizing: border-box; list-style-type: disc;"><span style="color: #666666; font-family: Arial, Helvetica, sans-serif;">E-R Model in DBMS</span></li>
<li style="box-sizing: border-box; list-style-type: disc;"><span style="color: #666666; font-family: Arial, Helvetica, sans-serif;">Relational Model in DBMS</span></li>
<li style="box-sizing: border-box; list-style-type: disc;"><span style="color: #666666; font-family: Arial, Helvetica, sans-serif;">RDBMS concepts</span></li>
<li style="box-sizing: border-box; list-style-type: disc;"><span style="color: #666666; font-family: Arial, Helvetica, sans-serif;">Hierarchical data Model in DBMS</span></li>
<li style="box-sizing: border-box; list-style-type: disc;"><span style="color: #666666; font-family: Arial, Helvetica, sans-serif;">Network Model in DBMS</span></li>
</ul>
</li>
<li style="box-sizing: border-box; list-style-type: disc;"><span style="color: #666666; font-family: Arial, Helvetica, sans-serif;"><b>Database languages</b></span></li>
<li style="box-sizing: border-box; list-style-type: disc;"><span style="color: #666666; font-family: Arial, Helvetica, sans-serif;"><b>Keys in DBMS</b></span><ul style="box-sizing: border-box; margin: 0px 0px 0px 40px; padding: 0px;">
<li style="box-sizing: border-box; list-style-type: disc;"><span style="color: #666666; font-family: Arial, Helvetica, sans-serif;">Primary key</span></li>
<li style="box-sizing: border-box; list-style-type: disc;"><span style="color: #666666; font-family: Arial, Helvetica, sans-serif;">Super key</span></li>
<li style="box-sizing: border-box; list-style-type: disc;"><span style="color: #666666; font-family: Arial, Helvetica, sans-serif;">Candidate key</span></li>
<li style="box-sizing: border-box; list-style-type: disc;"><span style="color: #666666; font-family: Arial, Helvetica, sans-serif;">Alternate key</span></li>
<li style="box-sizing: border-box; list-style-type: disc;"><span style="color: #666666; font-family: Arial, Helvetica, sans-serif;">Composite key</span></li>
<li style="box-sizing: border-box; list-style-type: disc;"><span style="color: #666666; font-family: Arial, Helvetica, sans-serif;">Foreign key</span></li>
</ul>
</li>
<li style="box-sizing: border-box; list-style-type: disc;"><span style="color: #666666; font-family: Arial, Helvetica, sans-serif;"><b>Constraints in DBMS</b></span><ul style="box-sizing: border-box; margin: 0px 0px 0px 40px; padding: 0px;">
<li style="box-sizing: border-box; list-style-type: disc;"><span style="color: #666666; font-family: Arial, Helvetica, sans-serif;">Domain constraints</span></li>
<li style="box-sizing: border-box; list-style-type: disc;"><span style="color: #666666; font-family: Arial, Helvetica, sans-serif;">Mapping constraints</span></li>
</ul>
</li>
<li style="box-sizing: border-box; list-style-type: disc;"><span style="color: #666666; font-family: Arial, Helvetica, sans-serif;"><b>Cardinality in DBMS</b></span></li>
<li style="box-sizing: border-box; list-style-type: disc;"><span style="color: #666666; font-family: Arial, Helvetica, sans-serif;"><b>Functional dependencies in DBMS</b></span><ul style="box-sizing: border-box; margin: 0px 0px 0px 40px; padding: 0px;">
<li style="box-sizing: border-box; list-style-type: disc;"><span style="color: #666666; font-family: Arial, Helvetica, sans-serif;">Trivial functional dependency</span></li>
<li style="box-sizing: border-box; list-style-type: disc;"><span style="color: #666666; font-family: Arial, Helvetica, sans-serif;">non-trivial functional dependency</span></li>
<li style="box-sizing: border-box; list-style-type: disc;"><span style="color: #666666; font-family: Arial, Helvetica, sans-serif;">Multivalued dependency</span></li>
<li style="box-sizing: border-box; list-style-type: disc;"><span style="color: #666666; font-family: Arial, Helvetica, sans-serif;">Transitive dependency</span></li>
</ul>
</li>
<li style="box-sizing: border-box; list-style-type: disc;"><span style="color: #666666; font-family: Arial, Helvetica, sans-serif;"><b>Normalization </b>– This covers all the normal forms: First Normal Form(1NF), Second Normal Form(2NF), Third Normal Form(3NF), Boyce–Codd Normal Form(BCNF)</span></li>
</ul>
</div>
It E Researchhttp://www.blogger.com/profile/02660842566926994686noreply@blogger.com0tag:blogger.com,1999:blog-7822657138986038530.post-20009774592890096152018-02-12T22:55:00.001-08:002018-02-12T22:55:42.827-08:00Introduction of Data<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjx2TD-WvfMOgdVjzoxaY3T1Xq8uqj5M_PAX_afSM4Rg5m78PTHepVB5S_ibA6QqennfpTJ9VEqO3kCnkzQzhtmp0lxKJVE5jsRXNQFcrIfnYt-f2fXtObi5qvuDhjzLbcKPlaWPsJqnQ/s1600/385697-636167162089341239-16x9.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="900" data-original-width="1600" height="360" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjx2TD-WvfMOgdVjzoxaY3T1Xq8uqj5M_PAX_afSM4Rg5m78PTHepVB5S_ibA6QqennfpTJ9VEqO3kCnkzQzhtmp0lxKJVE5jsRXNQFcrIfnYt-f2fXtObi5qvuDhjzLbcKPlaWPsJqnQ/s640/385697-636167162089341239-16x9.jpg" width="640" /></a></div>
<h1 style="background-color: white; line-height: 40px; margin: 5px 0px; text-rendering: optimizeLegibility;">
<span style="font-family: Arial, Helvetica, sans-serif; font-size: large;"><br /></span></h1>
<h1 style="background-color: white; line-height: 40px; margin: 5px 0px; text-rendering: optimizeLegibility;">
<span style="font-family: Arial, Helvetica, sans-serif; font-size: large;"><br /></span></h1>
<h1 style="background-color: white; line-height: 40px; margin: 5px 0px; text-rendering: optimizeLegibility;">
<span style="font-family: Arial, Helvetica, sans-serif; font-size: large;">What is Data?</span></h1>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;">Data is nothing, but facts and statistics are stored or free of charge on a network, usually it is raw and unused. For example: When you visit any website, they can store the IP address, which is the data, in return they can add a cookie to your browser, you can mark that you visited the website That's the data, your name, its data, your age, this is the data.</span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;">Information moves toward becoming data when it is prepared, transforming it into something important. Like, in light of the treat information saved money on client's program, if a site can break down that by and large men of age 20-25 visit us more, that is data, gotten from the information gathered.</span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<h1 style="background-color: white; line-height: 40px; margin: 5px 0px; text-rendering: optimizeLegibility;">
<span style="font-family: Arial, Helvetica, sans-serif; font-size: large;">What is a Database</span></h1>
</div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;">Name itself demonstrates what it is. Database is a place/holder where every one of the information is put away. Be that as it may, what is information? In a database, even a littlest snippet of data moves toward becoming information. For instance, Student is an information, course is an information, and Color is an information, tallness, weight, nourishment everything is information. To put it plainly, all the living and non-living articles in this world is an information.</span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;">A database is a collection of data related to the way data can be easily accessed, managed and updated. Database based software or hardware may be based, with the sole purpose, collecting data.</span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif; font-size: large;"><b>Why we need data?</b></span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;">We require information with the goal that we can perform different activities on them. Let's assume, we don't have any database and we need to record what is the tallness and weight of an infant in a year. What we do is note it in a bit of paper each month. Toward the finish of the specific time frame or year, we would check up on the off chance that he/she is developing accurately. On the off chance that some section isn't right or immaterial, we redress it or strike it off. Same is finished utilizing database. We would store all these data in the database. In the event that we need to check the development, we would pull the data from the database, on the off chance that we have to change any data, we can refresh/erase them. However, every one of the information will be at one place - Database.</span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif; font-size: large;"><b><br /></b></span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif; font-size: large;"><b>What type of data is stored in database?</b></span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;">In a database, we would aggregate just related information together and putting away them under one gathering name called table. This aides in distinguishing which information is put away where and under what name. It decreases an opportunity to look for a specific information in an entire database. For instance, Student, Teacher, Class, Subject, Employee, Department and so forth frame singular tables.</span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<br /></div>
</div>
It E Researchhttp://www.blogger.com/profile/02660842566926994686noreply@blogger.com0tag:blogger.com,1999:blog-7822657138986038530.post-64376025771815489222018-02-12T22:46:00.002-08:002018-02-12T22:46:53.183-08:00Text in CSS<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxRttaP5SUzNh72RnTeQW-4sKWbYrdIfNSE9sZgwGOvXPsuaTaeHqYLjmInuCjdGkMYfCut2E160VPbgfUh2zMEQwJVss5T9hd-y7Vgt4Mtfx8tDa_akMuREpkKxAWym5PI0EiqU_iLw/s1600/maxresdefault.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="720" data-original-width="1280" height="360" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxRttaP5SUzNh72RnTeQW-4sKWbYrdIfNSE9sZgwGOvXPsuaTaeHqYLjmInuCjdGkMYfCut2E160VPbgfUh2zMEQwJVss5T9hd-y7Vgt4Mtfx8tDa_akMuREpkKxAWym5PI0EiqU_iLw/s640/maxresdefault.jpg" width="640" /></a></div>
<h2 style="border: 0px; line-height: 1.2; list-style: none; margin: 2em 15px 0.75em; padding: 0px;">
<span style="background-color: white;"><span style="font-family: Arial, Helvetica, sans-serif; font-size: large;">font-family</span></span></h2>
<div>
<div>
<span style="background-color: white;"><span style="font-family: Arial, Helvetica, sans-serif;">This is the font itself, like Times New Roman, Ariel, or Vardana.</span></span></div>
<div>
<span style="background-color: white;"><span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></span></div>
<div>
<span style="background-color: white;"><span style="font-family: Arial, Helvetica, sans-serif;">The user's browser should be able to find the font you specify, in most cases it means that it should be on their computer, so there is very little to use the fuzzy fonts that are just sitting on your computer. There are some selected "secure" fonts (the most used aerial, wordana and times new roman), but you can specify more than one font, it can be separated by commas. The purpose of this is that if the user does not have the first font that you specify, then the browser will go to that list until it has any such thing. This is useful because sometimes different fonts are installed in different computers. So font-family: Ariel, Helvetica, serif, will first search for aerial font, and if the browser can not find it, then it will search for hevelista, and then there will be a normal serif font.</span></span></div>
</div>
<div>
<span style="background-color: white;"><span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></span></div>
<div>
<span style="background-color: white;"><span style="font-family: Arial, Helvetica, sans-serif;"><code style="border: 0px; color: #cc0000; list-style: none; margin: 0px; padding: 0px;">font-family: "Times New Roman"</code>.</span></span></div>
<div>
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><span style="font-size: large;"><b><br /></b></span></span></div>
<div>
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><span style="font-size: large;"><b>font-size</b></span></span></div>
<div>
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<span style="background-color: white;"><span style="font-family: Arial, Helvetica, sans-serif;">Be careful with the size of the font-size font, with this - Text like header should not be just an HTML paragraph (p) in large font - still you use headings (H1, H2 etc.) Even if, in practice, you can create font-size larger than paragraph title (not recommended for discerning people).</span></span></div>
<div>
<span style="background-color: white;"><span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></span></div>
<div>
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhD43qWrJKan91b51WeCn_j8rCuXR66SrR9e8hKkUk9bb2Qx2Sv2VOhcWhILeSrsxmu59EKG-gWXjggYU0r3WbBbNXX2GyCIYuqgj0-ulIlcubzqs-odKXg3a9kr5tgjqGjEwAU-nuYWg/s1600/Va35b.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em; text-align: center;"><img border="0" data-original-height="367" data-original-width="761" height="192" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhD43qWrJKan91b51WeCn_j8rCuXR66SrR9e8hKkUk9bb2Qx2Sv2VOhcWhILeSrsxmu59EKG-gWXjggYU0r3WbBbNXX2GyCIYuqgj0-ulIlcubzqs-odKXg3a9kr5tgjqGjEwAU-nuYWg/s400/Va35b.png" width="400" /></a></div>
<div>
<br /></div>
<div>
<span style="background-color: white; color: brown; font-family: Consolas, "courier new"; font-size: 16px;">h1 </span><span style="background-color: white; box-sizing: inherit; font-family: Consolas, "courier new"; font-size: 16px;">{</span><span style="background-color: white; box-sizing: inherit; color: red; font-family: Consolas, "courier new"; font-size: 16px;"><br style="box-sizing: inherit;" /> font-size<span style="box-sizing: inherit; color: mediumblue;"><span style="box-sizing: inherit; color: black;">:</span> 40px<span style="box-sizing: inherit; color: black;">;</span></span></span><span style="background-color: white; box-sizing: inherit; font-family: Consolas, "courier new"; font-size: 16px;">}</span><br style="background-color: white; box-sizing: inherit; color: brown; font-family: Consolas, "courier new"; font-size: 16px;" /><br style="background-color: white; box-sizing: inherit; color: brown; font-family: Consolas, "courier new"; font-size: 16px;" /><span style="background-color: white; color: brown; font-family: Consolas, "courier new"; font-size: 16px;">h2 </span><span style="background-color: white; box-sizing: inherit; font-family: Consolas, "courier new"; font-size: 16px;">{</span><span style="background-color: white; box-sizing: inherit; color: red; font-family: Consolas, "courier new"; font-size: 16px;"><br style="box-sizing: inherit;" /> font-size<span style="box-sizing: inherit; color: mediumblue;"><span style="box-sizing: inherit; color: black;">:</span> 30px<span style="box-sizing: inherit; color: black;">;</span></span></span><span style="background-color: white; box-sizing: inherit; font-family: Consolas, "courier new"; font-size: 16px;">}</span><br style="background-color: white; box-sizing: inherit; color: brown; font-family: Consolas, "courier new"; font-size: 16px;" /><br style="background-color: white; box-sizing: inherit; color: brown; font-family: Consolas, "courier new"; font-size: 16px;" /><span style="background-color: white; color: brown; font-family: Consolas, "courier new"; font-size: 16px;">p </span><span style="background-color: white; box-sizing: inherit; font-family: Consolas, "courier new"; font-size: 16px;">{</span><span style="background-color: white; box-sizing: inherit; color: red; font-family: Consolas, "courier new"; font-size: 16px;"><br style="box-sizing: inherit;" /> font-size<span style="box-sizing: inherit; color: mediumblue;"><span style="box-sizing: inherit; color: black;">:</span> 14px<span style="box-sizing: inherit; color: black;">;</span></span></span><span style="background-color: white; box-sizing: inherit; font-family: Consolas, "courier new"; font-size: 16px;">}</span></div>
<div>
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><b><span style="font-size: large;">font-weight</span></b></span></div>
<div>
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<span style="background-color: white;"><span style="font-family: Arial, Helvetica, sans-serif;">The font-weight indicates whether the text is bold or not. Normally it is used as font-weight: Bold or Font-Weight: Normal but other values include boulders, lighter, 100, 200, 300, 400 (in the same form), 500, 600, 700 (bold Similar), 800 or 900.</span></span></div>
<div>
<span style="background-color: white; color: brown; font-family: Consolas, "courier new"; font-size: 16px;">p.normal </span><span style="background-color: white; box-sizing: inherit; font-family: Consolas, "courier new"; font-size: 16px;">{</span><span style="background-color: white; box-sizing: inherit; color: red; font-family: Consolas, "courier new"; font-size: 16px;"><br style="box-sizing: inherit;" /> font-weight<span style="box-sizing: inherit; color: mediumblue;"><span style="box-sizing: inherit; color: black;">:</span> normal<span style="box-sizing: inherit; color: black;">;</span></span></span><span style="background-color: white; box-sizing: inherit; font-family: Consolas, "courier new"; font-size: 16px;">}</span><br style="background-color: white; box-sizing: inherit; color: brown; font-family: Consolas, "courier new"; font-size: 16px;" /><br style="background-color: white; box-sizing: inherit; color: brown; font-family: Consolas, "courier new"; font-size: 16px;" /><span style="background-color: white; color: brown; font-family: Consolas, "courier new"; font-size: 16px;">p.thick </span><span style="background-color: white; box-sizing: inherit; font-family: Consolas, "courier new"; font-size: 16px;">{</span><span style="background-color: white; box-sizing: inherit; color: red; font-family: Consolas, "courier new"; font-size: 16px;"><br style="box-sizing: inherit;" /> font-weight<span style="box-sizing: inherit; color: mediumblue;"><span style="box-sizing: inherit; color: black;">:</span> bold<span style="box-sizing: inherit; color: black;">;</span></span></span><span style="background-color: white; box-sizing: inherit; font-family: Consolas, "courier new"; font-size: 16px;">}</span></div>
<div>
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif; font-size: large;"><br /></span></div>
<div>
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif; font-size: large;"><b>font-style</b></span></div>
<div>
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif; font-size: large;"><br /></span></div>
<div>
<span style="background-color: white;"><span style="font-family: Arial, Helvetica, sans-serif;">Font-style indicates whether the text is italic or not it can be font-style: italic or font-style: normal.</span></span></div>
<div>
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjxIOH6y1yaPoOfUS4JxjGAWFRsboGF9GEJPlJJ69kmR3mpAmB9mF1ckDFPjpR1iELs4ZnIxDkmqBLHxRrc2vs1XnXm7t-ZVARGWQiqy8cXqj1nudysW64w0vSFupR8YVuXhyphenhyphenVUKpUaxw/s1600/Font_Styles_2048x2048.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em; text-align: center;"><img border="0" data-original-height="807" data-original-width="1600" height="201" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjxIOH6y1yaPoOfUS4JxjGAWFRsboGF9GEJPlJJ69kmR3mpAmB9mF1ckDFPjpR1iELs4ZnIxDkmqBLHxRrc2vs1XnXm7t-ZVARGWQiqy8cXqj1nudysW64w0vSFupR8YVuXhyphenhyphenVUKpUaxw/s400/Font_Styles_2048x2048.jpg" width="400" /></a></div>
<div>
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><b><span style="font-size: large;">text-decoration</span></b></span></div>
<div>
<span style="background-color: white; font-family: Arial, Helvetica, sans-serif;"><b><br /></b></span></div>
<div>
<div>
<span style="background-color: white;"><span style="font-family: Arial, Helvetica, sans-serif;">Text-decoration shows whether the text is running under a line, above, or through it.</span></span></div>
<div>
<span style="background-color: white;"><span style="font-family: Arial, Helvetica, sans-serif;">Text-decoration: Underlined, What would you expect</span></span></div>
<div>
<span style="background-color: white;"><span style="font-family: Arial, Helvetica, sans-serif;">Text-decoration: Holds a line over the overline text</span></span></div>
<div>
<span style="background-color: white;"><span style="font-family: Arial, Helvetica, sans-serif;">Text-decoration: Inserts a line through line-through text ("strike-through")</span></span></div>
<div>
<span style="background-color: white;"><span style="font-family: Arial, Helvetica, sans-serif;">This property is usually used to decorate the link and you can not underline any text-decoration: none.</span></span></div>
</div>
<div>
<span style="background-color: white;"><span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></span></div>
<div>
<h2 style="border: 0px; line-height: 1.2; list-style: none; margin: 2em 15px 0.75em; padding: 0px;">
<span style="background-color: white;"><span style="font-family: Arial, Helvetica, sans-serif; font-size: large;">text-transform</span></span></h2>
</div>
<div>
<div style="border: 0px; list-style: none; margin: 1.5em 15px; padding: 0px;">
<span style="background-color: white;"><span style="font-family: Arial, Helvetica, sans-serif;"><a class="acode" href="http://www.htmldog.com/references/css/properties/text-transform/" style="background-attachment: initial; background-clip: initial; background-image: url("invU.png"); background-origin: initial; background-position: center bottom; background-repeat: repeat-x; background-size: initial; border: 0px; color: #0088ee; list-style: none; margin: 0px; padding: 0px; position: relative; text-decoration-line: none; text-shadow: rgb(255, 255, 255) 0.07em 0.03em, rgb(255, 255, 255) -0.07em 0.03em, rgb(255, 255, 255) -0.07em 0px, rgb(255, 255, 255) -0.07em -0.03em, rgb(255, 255, 255) 0px 0.03em, rgb(255, 255, 255) 0px -0.07em; transition: color 0.3s, border-color 0.3s, background-color 0.3s, opacity 0.3s;"><code style="border: 0px; color: #cc0000; list-style: none; margin: 0px; padding: 0px;">text-transform</code></a> will change the case of the text.</span></span></div>
<ul style="border: 0px; list-style: none; margin: 1.5em 15px; padding: 0px;">
<li style="border: 0px; counter-increment: dog 1; list-style: none; margin: 0px; padding: 0px;"><span style="background-color: white;"><span style="font-family: Arial, Helvetica, sans-serif;"><code style="border: 0px; color: #cc0000; list-style: none; margin: 0px; padding: 0px;">text-transform: capitalize</code> turns the first letter of every word into uppercase.</span></span></li>
<li style="border: 0px; counter-increment: dog 1; list-style: none; margin: 0px; padding: 0px;"><span style="background-color: white;"><span style="font-family: Arial, Helvetica, sans-serif;"><code style="border: 0px; color: #cc0000; list-style: none; margin: 0px; padding: 0px;">text-transform: uppercase</code> turns everything into uppercase.</span></span></li>
<li style="border: 0px; counter-increment: dog 1; list-style: none; margin: 0px; padding: 0px;"><span style="background-color: white;"><span style="font-family: Arial, Helvetica, sans-serif;"><code style="border: 0px; color: #cc0000; list-style: none; margin: 0px; padding: 0px;">text-transform: lowercase</code> turns everything into lowercase.</span></span></li>
<li style="border: 0px; counter-increment: dog 1; list-style: none; margin: 0px; padding: 0px;"><span style="background-color: white;"><span style="font-family: Arial, Helvetica, sans-serif;"><span style="font-family: Arial, Helvetica, sans-serif;"><code style="border: 0px; color: #cc0000; list-style: none; margin: 0px; padding: 0px;">text-transform: none</code> I’ll leave for you to work out</span>.</span></span></li>
</ul>
</div>
<div>
<span style="background-color: white;"><span style="font-family: Arial, Helvetica, sans-serif;"> <b> Example - </b></span></span></div>
<div>
<pre class=" language-css" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 0px; list-style: none; margin: 1.5em 15px; overflow: auto; padding: 0.1px 30px 30px; white-space: pre-wrap;"><code class="oldLang language-css" style="background-color: white; border: 0px; list-style: none; margin: 0px; outline: none; padding: 0px; tab-size: 4; text-shadow: rgb(255, 255, 255) 0px 1px;"><span style="font-family: Arial, Helvetica, sans-serif;"><span class="token selector" style="border: 0px; color: #669900; list-style: none; margin: 0px; padding: 0px;">body</span> <span class="token punctuation" style="border: 0px; color: #999999; list-style: none; margin: 0px; padding: 0px;">{</span>
<strong style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 0px; box-shadow: rgba(255, 255, 255, 0.6) 0px 0px 0px 5px; list-style: none; margin: 0px; padding: 0px;"> <span class="token property" style="border: 0px; color: #bb3300; list-style: none; margin: 0px; padding: 0px;">font-family</span><span class="token punctuation" style="border: 0px; color: #999999; list-style: none; margin: 0px; padding: 0px;">:</span> arial, helvetica, sans-serif<span class="token punctuation" style="border: 0px; color: #999999; list-style: none; margin: 0px; padding: 0px;">;</span></strong><span class="token punctuation" style="border: 0px; color: #999999; list-style: none; margin: 0px; padding: 0px;"></span>
<strong style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 0px; box-shadow: rgba(255, 255, 255, 0.6) 0px 0px 0px 5px; list-style: none; margin: 0px; padding: 0px;"> <span class="token property" style="border: 0px; color: #bb3300; list-style: none; margin: 0px; padding: 0px;">font-size</span><span class="token punctuation" style="border: 0px; color: #999999; list-style: none; margin: 0px; padding: 0px;">:</span> 14px<span class="token punctuation" style="border: 0px; color: #999999; list-style: none; margin: 0px; padding: 0px;">;</span></strong><span class="token punctuation" style="border: 0px; color: #999999; list-style: none; margin: 0px; padding: 0px;"></span>
<span class="token punctuation" style="border: 0px; color: #999999; list-style: none; margin: 0px; padding: 0px;">}</span>
<span class="token selector" style="border: 0px; color: #669900; list-style: none; margin: 0px; padding: 0px;">h1</span> <span class="token punctuation" style="border: 0px; color: #999999; list-style: none; margin: 0px; padding: 0px;">{</span>
<strong style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 0px; box-shadow: rgba(255, 255, 255, 0.6) 0px 0px 0px 5px; list-style: none; margin: 0px; padding: 0px;"> <span class="token property" style="border: 0px; color: #bb3300; list-style: none; margin: 0px; padding: 0px;">font-size</span><span class="token punctuation" style="border: 0px; color: #999999; list-style: none; margin: 0px; padding: 0px;">:</span> 2em<span class="token punctuation" style="border: 0px; color: #999999; list-style: none; margin: 0px; padding: 0px;">;</span></strong><span class="token punctuation" style="border: 0px; color: #999999; list-style: none; margin: 0px; padding: 0px;"></span>
<span class="token punctuation" style="border: 0px; color: #999999; list-style: none; margin: 0px; padding: 0px;">}</span>
<span class="token selector" style="border: 0px; color: #669900; list-style: none; margin: 0px; padding: 0px;">h2</span> <span class="token punctuation" style="border: 0px; color: #999999; list-style: none; margin: 0px; padding: 0px;">{</span>
<strong style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 0px; box-shadow: rgba(255, 255, 255, 0.6) 0px 0px 0px 5px; list-style: none; margin: 0px; padding: 0px;"> <span class="token property" style="border: 0px; color: #bb3300; list-style: none; margin: 0px; padding: 0px;">font-size</span><span class="token punctuation" style="border: 0px; color: #999999; list-style: none; margin: 0px; padding: 0px;">:</span> 1.5em<span class="token punctuation" style="border: 0px; color: #999999; list-style: none; margin: 0px; padding: 0px;">;</span></strong><span class="token punctuation" style="border: 0px; color: #999999; list-style: none; margin: 0px; padding: 0px;"></span>
<span class="token punctuation" style="border: 0px; color: #999999; list-style: none; margin: 0px; padding: 0px;">}</span>
<span class="token selector" style="border: 0px; color: #669900; list-style: none; margin: 0px; padding: 0px;">a</span> <span class="token punctuation" style="border: 0px; color: #999999; list-style: none; margin: 0px; padding: 0px;">{</span>
<strong style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 0px; box-shadow: rgba(255, 255, 255, 0.6) 0px 0px 0px 5px; list-style: none; margin: 0px; padding: 0px;"> <span class="token property" style="border: 0px; color: #bb3300; list-style: none; margin: 0px; padding: 0px;">text-decoration</span><span class="token punctuation" style="border: 0px; color: #999999; list-style: none; margin: 0px; padding: 0px;">:</span> none<span class="token punctuation" style="border: 0px; color: #999999; list-style: none; margin: 0px; padding: 0px;">;</span></strong><span class="token punctuation" style="border: 0px; color: #999999; list-style: none; margin: 0px; padding: 0px;"></span>
<span class="token punctuation" style="border: 0px; color: #999999; list-style: none; margin: 0px; padding: 0px;">}</span>
<span class="token selector" style="border: 0px; color: #669900; list-style: none; margin: 0px; padding: 0px;">strong</span> <span class="token punctuation" style="border: 0px; color: #999999; list-style: none; margin: 0px; padding: 0px;">{</span>
<strong style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 0px; box-shadow: rgba(255, 255, 255, 0.6) 0px 0px 0px 5px; list-style: none; margin: 0px; padding: 0px;"> <span class="token property" style="border: 0px; color: #bb3300; list-style: none; margin: 0px; padding: 0px;">font-style</span><span class="token punctuation" style="border: 0px; color: #999999; list-style: none; margin: 0px; padding: 0px;">:</span> italic<span class="token punctuation" style="border: 0px; color: #999999; list-style: none; margin: 0px; padding: 0px;">;</span></strong><span class="token punctuation" style="border: 0px; color: #999999; list-style: none; margin: 0px; padding: 0px;"></span>
<strong style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 0px; box-shadow: rgba(255, 255, 255, 0.6) 0px 0px 0px 5px; list-style: none; margin: 0px; padding: 0px;"> <span class="token property" style="border: 0px; color: #bb3300; list-style: none; margin: 0px; padding: 0px;">text-transform</span><span class="token punctuation" style="border: 0px; color: #999999; list-style: none; margin: 0px; padding: 0px;">:</span> uppercase<span class="token punctuation" style="border: 0px; color: #999999; list-style: none; margin: 0px; padding: 0px;">;</span></strong><span class="token punctuation" style="border: 0px; color: #999999; list-style: none; margin: 0px; padding: 0px;"></span>
<span class="token punctuation" style="border: 0px; color: #999999; list-style: none; margin: 0px; padding: 0px;">}</span></span></code></pre>
</div>
<div>
<br /></div>
</div>
It E Researchhttp://www.blogger.com/profile/02660842566926994686noreply@blogger.com0tag:blogger.com,1999:blog-7822657138986038530.post-46989257435094217792018-02-04T22:26:00.001-08:002018-02-12T22:46:53.179-08:00Float in CSS<div dir="ltr" style="text-align: left;" trbidi="on">
<span style="font-family: Arial, Helvetica, sans-serif;">Float is a CSS position property to understand its purpose and origin, we can look at the design to print. In a print layout, images can be set in the page, such as wrapping the text around them as needed. This is usually and appropriately called "wrap the text".</span><br />
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span>
<ul style="background-color: white; box-sizing: inherit; font-family: Verdana, sans-serif; font-size: 15px;">
<li style="box-sizing: inherit;">left - Elements floats on the left side of its container</li>
<li style="box-sizing: inherit;">right- Elements floats on the right side of its container</li>
<li style="box-sizing: inherit;">none - The element does not float (will be displayed just where it occurs in the text). This is default</li>
<li style="box-sizing: inherit;">inherit - Element receives its parents' float value</li>
</ul>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjBhxjwcvSsd3r4i3bNBycgMpbh6wFyHCPUMxW18loCcLsSiwNU8CwD5bkbdfLkj-VvQeHwuhyLDCamGAmNmIvdWCp5iOsUEkeWsQlgrkAGl9NlCbJiR3fbCC8a1Bar5a91oURBb0aLqQ/s1600/web-layout.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="240" data-original-width="540" height="177" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjBhxjwcvSsd3r4i3bNBycgMpbh6wFyHCPUMxW18loCcLsSiwNU8CwD5bkbdfLkj-VvQeHwuhyLDCamGAmNmIvdWCp5iOsUEkeWsQlgrkAGl9NlCbJiR3fbCC8a1Bar5a91oURBb0aLqQ/s400/web-layout.png" width="400" /></a></div>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi4OHzamfl_6tjGuXRdNtUw3reUzju76lBtpwFOeEaHV0FJVGtNjjELbEtwGcpU_kFiONon5o5OKCrWuvFyF4YqXpM-4Wcz05CNPdaGTpLXQk5eRYRyyqlplpUek9rX4P_ZuGTFRg-7NQ/s1600/print-layout.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="270" data-original-width="540" height="200" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi4OHzamfl_6tjGuXRdNtUw3reUzju76lBtpwFOeEaHV0FJVGtNjjELbEtwGcpU_kFiONon5o5OKCrWuvFyF4YqXpM-4Wcz05CNPdaGTpLXQk5eRYRyyqlplpUek9rX4P_ZuGTFRg-7NQ/s400/print-layout.png" width="400" /></a></div>
<b><span style="color: blue; font-family: Arial, Helvetica, sans-serif;">Example - </span></b><br />
<br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"><!DOCTYPE html></span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"><html></span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"><head></span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"><style></span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;">* {</span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"> box-sizing: border-box;</span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;">}</span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;">.header, .footer {</span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"> background-color: grey;</span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"> color: white;</span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"> padding: 15px;</span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;">}</span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;">.column {</span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"> float: left;</span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"> padding: 15px;</span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;">}</span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;">.clearfix::after {</span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"> content: "";</span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"> clear: both;</span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"> display: table;</span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;">}</span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;">.menu {</span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"> width: 25%;</span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;">}</span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;">.content {</span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"> width: 75%;</span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;">}</span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;">.menu ul {</span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"> list-style-type: none;</span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"> margin: 0;</span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"> padding: 0;</span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;">}</span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;">.menu li {</span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"> padding: 8px;</span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"> margin-bottom: 8px;</span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"> background-color: #33b5e5;</span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"> color: #ffffff;</span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;">}</span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;">.menu li:hover {</span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"> background-color: #0099cc;</span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;">}</span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"></style></span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"></head></span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"><body></span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"><div class="header"></span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"> <h1>Chania</h1></span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"></div></span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"><div class="clearfix"></span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"> <div class="column menu"></span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"> <ul></span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"> <li>The Flight</li></span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"> <li>The City</li></span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"> <li>The Island</li></span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"> <li>The Food</li></span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"> </ul></span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"> </div></span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"> <div class="column content"></span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"> <h1>The City</h1></span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"> <p>Chania is the capital of the Chania region on the island of Crete. The city can be divided in two parts, the old town and the modern city.</p></span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"> <p>You will learn more about web layout and responsive web pages in a later chapter.</p></span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"> </div></span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"></div></span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"><div class="footer"></span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"> <p>Footer Text</p></span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"></div></span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"></body></span><br />
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"></html></span><br />
<div>
<br /></div>
</div>
It E Researchhttp://www.blogger.com/profile/02660842566926994686noreply@blogger.com0tag:blogger.com,1999:blog-7822657138986038530.post-54097704128106462582018-01-30T23:04:00.002-08:002018-01-30T23:05:02.558-08:00CSS Borders Property<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjhVnZq38h9A0s6chBlqZvWJOaENx4JV4pZYUZgicwv3CRpTCDkTbt39_h-xAEsje-z8FheU8kMKbCITsUwALMYCSF47OXrY4Hx6s6BwmAJBov8n0E6l_XPNpBL8kEHuoiR5IxvPcaefA/s1600/borderstyles.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="361" data-original-width="523" height="440" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjhVnZq38h9A0s6chBlqZvWJOaENx4JV4pZYUZgicwv3CRpTCDkTbt39_h-xAEsje-z8FheU8kMKbCITsUwALMYCSF47OXrY4Hx6s6BwmAJBov8n0E6l_XPNpBL8kEHuoiR5IxvPcaefA/s640/borderstyles.png" width="640" /></a></div>
<h2 style="background-color: white; margin: 24px 0px 0px;">
CSS Border Properties</h2>
<div style="background-color: white;">
<span style="font-family: Arial, Helvetica, sans-serif;">Borders are styled using these border CSS properties:</span></div>
<ul style="background-color: white;">
<li><span style="font-family: Arial, Helvetica, sans-serif;"><code style="font-size: 14px;">border</code><br /></span></li>
<li><code style="font-size: 14px;"><span style="font-family: Arial, Helvetica, sans-serif;">border-width</span></code></li>
<li><code style="font-size: 14px;"><span style="font-family: Arial, Helvetica, sans-serif;">border-style</span></code></li>
<li><code style="font-size: 14px;"><span style="font-family: Arial, Helvetica, sans-serif;">border-color<br /></span></code></li>
<li><code style="font-size: 14px;"><span style="font-family: Arial, Helvetica, sans-serif;">border-top</span></code></li>
<li><code style="font-size: 14px;"><span style="font-family: Arial, Helvetica, sans-serif;">border-right</span></code></li>
<li><code style="font-size: 14px;"><span style="font-family: Arial, Helvetica, sans-serif;">border-bottom</span></code></li>
<li><code style="font-size: 14px;"><span style="font-family: Arial, Helvetica, sans-serif;">border-left<br /></span></code></li>
<li><code style="font-size: 14px;"><span style="font-family: Arial, Helvetica, sans-serif;">border-top-width</span></code></li>
<li><code style="font-size: 14px;"><span style="font-family: Arial, Helvetica, sans-serif;">border-top-style</span></code></li>
<li><code style="font-size: 14px;"><span style="font-family: Arial, Helvetica, sans-serif;">border-top-color</span></code></li>
<li><code style="font-size: 14px;"><span style="font-family: Arial, Helvetica, sans-serif;">border-right-width</span></code></li>
<li><code style="font-size: 14px;"><span style="font-family: Arial, Helvetica, sans-serif;">border-right-style</span></code></li>
<li><code style="font-size: 14px;"><span style="font-family: Arial, Helvetica, sans-serif;">border-right-color</span></code></li>
<li><code style="font-size: 14px;"><span style="font-family: Arial, Helvetica, sans-serif;">border-bottom-width</span></code></li>
<li><code style="font-size: 14px;"><span style="font-family: Arial, Helvetica, sans-serif;">border-bottom-style</span></code></li>
<li><code style="font-size: 14px;"><span style="font-family: Arial, Helvetica, sans-serif;">border-bottom-color</span></code></li>
<li><code style="font-size: 14px;"><span style="font-family: Arial, Helvetica, sans-serif;">border-left-width</span></code></li>
<li><code style="font-size: 14px;"><span style="font-family: Arial, Helvetica, sans-serif;">border-left-style</span></code></li>
<li><span style="font-family: Arial, Helvetica, sans-serif;"><code style="font-size: 14px;">border-left-color</code><br /></span></li>
<li><code style="font-size: 14px;"><span style="font-family: Arial, Helvetica, sans-serif;">border-radius</span></code></li>
<li><code style="font-size: 14px;"><span style="font-family: Arial, Helvetica, sans-serif;">border-top-left-radius</span></code></li>
<li><code style="font-size: 14px;"><span style="font-family: Arial, Helvetica, sans-serif;">border-top-right-radius</span></code></li>
<li><code style="font-size: 14px;"><span style="font-family: Arial, Helvetica, sans-serif;">border-bottom-left-radius</span></code></li>
<li><code style="font-size: 14px;"><span style="font-family: Arial, Helvetica, sans-serif;">border-bottom-right-radius</span></code></li>
</ul>
<div>
<span style="font-size: 14px;"><span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></span></div>
<div>
<h2 style="background-color: white; box-sizing: inherit; font-size: 30px; font-weight: 400; margin: 10px 0px;">
<span style="font-family: Arial, Helvetica, sans-serif;">Border Style</span></h2>
<h2 style="box-sizing: inherit; font-weight: 400; margin: 10px 0px;">
<span style="font-family: Arial, Helvetica, sans-serif; font-size: small;"><span style="background-color: white;">The </span><code class="w3-codespan" style="box-sizing: inherit; padding-left: 4px; padding-right: 4px;"><span style="background-color: white; font-family: Arial, Helvetica, sans-serif;">border-style</span></code><span style="background-color: white;"> property specifies what kind of border to display.</span></span></h2>
<h2 style="margin: 24px 0px 0px;">
<ul style="background-color: white; box-sizing: inherit; font-weight: 400;">
<li style="box-sizing: inherit;"><span style="color: blue; font-family: Arial, Helvetica, sans-serif; font-size: small;"><code class="w3-codespan" style="background-color: #f1f1f1; box-sizing: inherit; padding-left: 4px; padding-right: 4px;">dotted</code> - Defines a dotted border</span></li>
<li style="box-sizing: inherit;"><span style="color: blue; font-family: Arial, Helvetica, sans-serif; font-size: small;"><code class="w3-codespan" style="background-color: #f1f1f1; box-sizing: inherit; padding-left: 4px; padding-right: 4px;">dashed</code> - Defines a dashed border</span></li>
<li style="box-sizing: inherit;"><span style="color: blue; font-family: Arial, Helvetica, sans-serif; font-size: small;"><code class="w3-codespan" style="background-color: #f1f1f1; box-sizing: inherit; padding-left: 4px; padding-right: 4px;">solid</code> - Defines a solid border</span></li>
<li style="box-sizing: inherit;"><span style="color: blue; font-family: Arial, Helvetica, sans-serif; font-size: small;"><code class="w3-codespan" style="background-color: #f1f1f1; box-sizing: inherit; padding-left: 4px; padding-right: 4px;">double</code> - Defines a double border</span></li>
<li style="box-sizing: inherit;"><span style="color: blue; font-family: Arial, Helvetica, sans-serif; font-size: small;"><code class="w3-codespan" style="background-color: #f1f1f1; box-sizing: inherit; padding-left: 4px; padding-right: 4px;">groove</code> </span></li>
<li style="box-sizing: inherit;"><span style="color: blue; font-family: Arial, Helvetica, sans-serif; font-size: small;"><code class="w3-codespan" style="background-color: #f1f1f1; box-sizing: inherit; padding-left: 4px; padding-right: 4px;">ridge</code> </span></li>
<li style="box-sizing: inherit;"><span style="color: blue; font-family: Arial, Helvetica, sans-serif; font-size: small;"><code class="w3-codespan" style="background-color: #f1f1f1; box-sizing: inherit; padding-left: 4px; padding-right: 4px;">inset</code> </span></li>
<li style="box-sizing: inherit;"><code class="w3-codespan" style="background-color: #f1f1f1; box-sizing: inherit; padding-left: 4px; padding-right: 4px;"><span style="color: blue; font-family: Arial, Helvetica, sans-serif; font-size: small;">outset</span></code></li>
<li style="box-sizing: inherit;"><span style="color: blue; font-family: Arial, Helvetica, sans-serif; font-size: small;"><code class="w3-codespan" style="background-color: #f1f1f1; box-sizing: inherit; padding-left: 4px; padding-right: 4px;">none</code> - Defines no border</span></li>
<li style="box-sizing: inherit;"><span style="color: blue; font-family: Arial, Helvetica, sans-serif; font-size: small;"><code class="w3-codespan" style="background-color: #f1f1f1; box-sizing: inherit; padding-left: 4px; padding-right: 4px;">hidden</code> - Defines a hidden border</span></li>
</ul>
<div style="background-color: white;">
<span style="font-size: 15px;"><span style="color: blue; font-family: Arial, Helvetica, sans-serif;">Example -</span></span></div>
<div style="background-color: white;">
<span style="font-size: 15px; font-weight: 400;"><span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></span></div>
<div style="background-color: white;">
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"><span style="font-size: 16px; font-weight: 400;">p.dotted </span><span style="box-sizing: inherit; font-size: 16px; font-weight: 400;">{</span><span style="box-sizing: inherit; font-size: 16px; font-weight: 400;">border-style<span style="box-sizing: inherit;"><span style="box-sizing: inherit;">:</span> dotted<span style="box-sizing: inherit;">;</span></span></span><span style="box-sizing: inherit; font-size: 16px; font-weight: 400;">}</span><br style="box-sizing: inherit; font-size: 16px; font-weight: 400;" /><span style="font-size: 16px; font-weight: 400;">p.dashed </span><span style="box-sizing: inherit; font-size: 16px; font-weight: 400;">{</span><span style="box-sizing: inherit; font-size: 16px; font-weight: 400;">border-style<span style="box-sizing: inherit;"><span style="box-sizing: inherit;">:</span> dashed<span style="box-sizing: inherit;">;</span></span></span><span style="box-sizing: inherit; font-size: 16px; font-weight: 400;">}</span><br style="box-sizing: inherit; font-size: 16px; font-weight: 400;" /><span style="font-size: 16px; font-weight: 400;">p.solid </span><span style="box-sizing: inherit; font-size: 16px; font-weight: 400;">{</span><span style="box-sizing: inherit; font-size: 16px; font-weight: 400;">border-style<span style="box-sizing: inherit;"><span style="box-sizing: inherit;">:</span> solid<span style="box-sizing: inherit;">;</span></span></span><span style="box-sizing: inherit; font-size: 16px; font-weight: 400;">}</span><br style="box-sizing: inherit; font-size: 16px; font-weight: 400;" /><span style="font-size: 16px; font-weight: 400;">p.double </span><span style="box-sizing: inherit; font-size: 16px; font-weight: 400;">{</span><span style="box-sizing: inherit; font-size: 16px; font-weight: 400;">border-style<span style="box-sizing: inherit;"><span style="box-sizing: inherit;">:</span> double<span style="box-sizing: inherit;">;</span></span></span><span style="box-sizing: inherit; font-size: 16px; font-weight: 400;">}</span><br style="box-sizing: inherit; font-size: 16px; font-weight: 400;" /><span style="font-size: 16px; font-weight: 400;">p.groove </span><span style="box-sizing: inherit; font-size: 16px; font-weight: 400;">{</span><span style="box-sizing: inherit; font-size: 16px; font-weight: 400;">border-style<span style="box-sizing: inherit;"><span style="box-sizing: inherit;">:</span> groove<span style="box-sizing: inherit;">;</span></span></span><span style="box-sizing: inherit; font-size: 16px; font-weight: 400;">}</span><br style="box-sizing: inherit; font-size: 16px; font-weight: 400;" /><span style="font-size: 16px; font-weight: 400;">p.ridge </span><span style="box-sizing: inherit; font-size: 16px; font-weight: 400;">{</span><span style="box-sizing: inherit; font-size: 16px; font-weight: 400;">border-style<span style="box-sizing: inherit;"><span style="box-sizing: inherit;">:</span> ridge<span style="box-sizing: inherit;">;</span></span></span><span style="box-sizing: inherit; font-size: 16px; font-weight: 400;">}</span><br style="box-sizing: inherit; font-size: 16px; font-weight: 400;" /><span style="font-size: 16px; font-weight: 400;">p.inset </span><span style="box-sizing: inherit; font-size: 16px; font-weight: 400;">{</span><span style="box-sizing: inherit; font-size: 16px; font-weight: 400;">border-style<span style="box-sizing: inherit;"><span style="box-sizing: inherit;">:</span> inset<span style="box-sizing: inherit;">;</span></span></span><span style="box-sizing: inherit; font-size: 16px; font-weight: 400;">}</span><br style="box-sizing: inherit; font-size: 16px; font-weight: 400;" /><span style="font-size: 16px; font-weight: 400;">p.outset </span><span style="box-sizing: inherit; font-size: 16px; font-weight: 400;">{</span><span style="box-sizing: inherit; font-size: 16px; font-weight: 400;">border-style<span style="box-sizing: inherit;"><span style="box-sizing: inherit;">:</span> outset<span style="box-sizing: inherit;">;</span></span></span><span style="box-sizing: inherit; font-size: 16px; font-weight: 400;">}</span><br style="box-sizing: inherit; font-size: 16px; font-weight: 400;" /><span style="font-size: 16px; font-weight: 400;">p.none </span><span style="box-sizing: inherit; font-size: 16px; font-weight: 400;">{</span><span style="box-sizing: inherit; font-size: 16px; font-weight: 400;">border-style<span style="box-sizing: inherit;"><span style="box-sizing: inherit;">:</span> none<span style="box-sizing: inherit;">;</span></span></span><span style="box-sizing: inherit; font-size: 16px; font-weight: 400;">}</span><br style="box-sizing: inherit; font-size: 16px; font-weight: 400;" /><span style="font-size: 16px; font-weight: 400;">p.hidden </span><span style="box-sizing: inherit; font-size: 16px; font-weight: 400;">{</span><span style="box-sizing: inherit; font-size: 16px; font-weight: 400;">border-style<span style="box-sizing: inherit;"><span style="box-sizing: inherit;">:</span> hidden<span style="box-sizing: inherit;">;</span></span></span><span style="box-sizing: inherit; font-size: 16px; font-weight: 400;">}</span><br style="box-sizing: inherit; font-size: 16px; font-weight: 400;" /><span style="font-size: 16px; font-weight: 400;">p.mix </span><span style="box-sizing: inherit; font-size: 16px; font-weight: 400;">{</span><span style="box-sizing: inherit; font-size: 16px; font-weight: 400;">border-style<span style="box-sizing: inherit;"><span style="box-sizing: inherit;">:</span> dotted dashed solid double<span style="box-sizing: inherit;">;</span></span></span><span style="box-sizing: inherit; font-size: 16px; font-weight: 400;">}</span></span></div>
<div style="background-color: white;">
<span style="box-sizing: inherit; font-size: 16px; font-weight: 400;"><span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></span></div>
<div style="background-color: white;">
<span style="box-sizing: inherit; font-size: 16px; font-weight: 400;"><span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></span></div>
<div>
<span style="box-sizing: inherit; font-size: 16px; font-weight: 400;"><span style="font-family: Arial, Helvetica, sans-serif;"><div class="w3-example" style="box-shadow: rgba(0, 0, 0, 0.16) 0px 2px 4px 0px, rgba(0, 0, 0, 0.12) 0px 2px 10px 0px !important; box-sizing: inherit; font-size: 15px; margin: 20px 0px; padding: 0.01em 16px;">
<div class="w3-white w3-padding notranslate" style="box-sizing: inherit; padding: 8px 16px !important;">
<div style="border-style: dotted; box-sizing: inherit;">
<span style="background-color: white;">A dotted border.</span></div>
<div style="border-style: dashed; box-sizing: inherit;">
<span style="background-color: white;">A dashed border.</span></div>
<div style="border-style: solid; box-sizing: inherit;">
<span style="background-color: white;">A solid border.</span></div>
<div style="border-style: double; box-sizing: inherit;">
<span style="background-color: white;">A double border.</span></div>
<div style="border-style: groove; box-sizing: inherit;">
<span style="background-color: white;">A groove border. The effect depends on the border-color value.</span></div>
<div style="border-style: ridge; box-sizing: inherit;">
<span style="background-color: white;">A ridge border. The effect depends on the border-color value.</span></div>
<div style="border-style: inset; box-sizing: inherit;">
<span style="background-color: white;">An inset border. The effect depends on the border-color value.</span></div>
<div style="border-style: outset; box-sizing: inherit;">
<span style="background-color: white;">An outset border. The effect depends on the border-color value.</span></div>
<div style="border-style: none; box-sizing: inherit;">
<span style="background-color: white;">No border.</span></div>
<div style="border-style: hidden; box-sizing: inherit;">
<span style="background-color: white;">A hidden border.</span></div>
<div style="border-style: dotted dashed solid double; box-sizing: inherit;">
<span style="background-color: white;">A mixed border</span></div>
</div>
</div>
<div class="w3-panel w3-note" style="background-color: #ffffcc; border-left: 6px solid rgb(255, 235, 59); box-sizing: inherit; font-size: 15px; margin-bottom: 16px; margin-top: 16px; padding: 0.01em 16px;">
</div>
</span></span></div>
</h2>
</div>
</div>
It E Researchhttp://www.blogger.com/profile/02660842566926994686noreply@blogger.com0tag:blogger.com,1999:blog-7822657138986038530.post-35358286825077791752018-01-30T22:59:00.002-08:002018-01-30T23:05:02.551-08:00CSS Colors property<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMJeCjJhPn5BZC7ihFvQCAbkJine2kerqoe9cBup5KbKyZwHMgwBV3u_KactCCguxe5UtEG5IRN7Ho_sfEa5pli7YxfwpVSm6hZGUq6WWhzpwz5LK9dYvsvhzxeuRd8eY95qj36F43NQ/s1600/css-color-codes-scheme-chart.jpeg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="436" data-original-width="640" height="435" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMJeCjJhPn5BZC7ihFvQCAbkJine2kerqoe9cBup5KbKyZwHMgwBV3u_KactCCguxe5UtEG5IRN7Ho_sfEa5pli7YxfwpVSm6hZGUq6WWhzpwz5LK9dYvsvhzxeuRd8eY95qj36F43NQ/s640/css-color-codes-scheme-chart.jpeg" width="640" /></a></div>
<br />
<span style="font-family: Arial, Helvetica, sans-serif;">There are many CSS properties that specify the color for parts of HTML elements. For example, color, background color, border etc.</span><br />
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span>
<div class="w3-row w3-center" style="background-color: white; box-sizing: inherit; color: white; font-size: 15px; line-height: 80px; margin: 0px -16px; text-align: center !important;">
<div class="w3-col l3 m6 w3-padding" style="box-sizing: inherit; float: left; padding: 8px 16px !important; width: 235.203px;">
<div style="background-color: tomato; box-sizing: inherit;">
<span style="font-family: Arial, Helvetica, sans-serif;">Tomato</span></div>
</div>
<div class="w3-col l3 m6 w3-padding" style="box-sizing: inherit; float: left; padding: 8px 16px !important; width: 235.203px;">
<div style="background-color: orange; box-sizing: inherit;">
<span style="font-family: Arial, Helvetica, sans-serif;">Orange</span></div>
</div>
</div>
<div style="background-color: white; box-sizing: inherit; font-size: 15px;">
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<div style="background-color: white;">
<span style="font-family: Arial, Helvetica, sans-serif;">When you specify a color you can do so using the following formats:</span></div>
<ul style="background-color: white;">
<li><span style="font-family: Arial, Helvetica, sans-serif;">Preset Color Codes</span></li>
<li><span style="font-family: Arial, Helvetica, sans-serif;">Hexadecimal RGB</span></li>
<li><span style="font-family: Arial, Helvetica, sans-serif;">RGB</span></li>
<li><span style="font-family: Arial, Helvetica, sans-serif;">RGBA</span></li>
<li><span style="font-family: Arial, Helvetica, sans-serif;">HSL</span></li>
</ul>
<div>
<pre class="codeBox" style="background-color: #f0f0f0; border: 1px solid rgb(204, 204, 204); max-width: 100%; overflow: auto; padding: 10px;"><span style="font-family: Arial, Helvetica, sans-serif;">#one { background-color: red; }
#two { background-color: #ff0000; }
#three { background-color: rgb(255, 0, 0); }
#four { background-color: rgba(255, 0, 0, 1.0); }
#five { background-color: hsl(0%, 100%, 0%); }</span></pre>
</div>
</div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<h2 style="background-color: white; margin: 24px 0px 0px;">
<span style="font-family: Arial, Helvetica, sans-serif;">Predefined Color Codes</span></h2>
</div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<ul style="background-color: white;">
<li><code style="font-size: 14px;"><span style="font-family: Arial, Helvetica, sans-serif;">red</span></code></li>
<li><code style="font-size: 14px;"><span style="font-family: Arial, Helvetica, sans-serif;">green</span></code></li>
<li><code style="font-size: 14px;"><span style="font-family: Arial, Helvetica, sans-serif;">blue</span></code></li>
<li><code style="font-size: 14px;"><span style="font-family: Arial, Helvetica, sans-serif;">black</span></code></li>
<li><code style="font-size: 14px;"><span style="font-family: Arial, Helvetica, sans-serif;">white</span></code></li>
<li><code style="font-size: 14px;"><span style="font-family: Arial, Helvetica, sans-serif;">gray</span></code></li>
<li><code style="font-size: 14px;"><span style="font-family: Arial, Helvetica, sans-serif;">magenta</span></code></li>
<li><code style="font-size: 14px;"><span style="font-family: Arial, Helvetica, sans-serif;">purple</span></code></li>
<li><code style="font-size: 14px;"><span style="font-family: Arial, Helvetica, sans-serif;">violet</span></code></li>
</ul>
<div>
<span style="font-size: 14px;"><span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></span></div>
</div>
<div>
<h2 style="background-color: white; margin: 24px 0px 0px;">
<span style="font-family: Arial, Helvetica, sans-serif;">Hexadecimal Color codes</span></h2>
</div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;">The hexadecimal RGB shading documentation is the most seasoned shading documentation (together with predefined shading codes). The hexadecimal RGB shading documentation parts any given shading subtlety into three segments: Red, Green and Blue. That is the place the three letters RGB originate from. Any shading is made out of a specific measure of red, greeen and blue shading.</span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<span style="color: blue; font-family: Arial, Helvetica, sans-serif;"><b>Example -</b></span></div>
<div>
<pre class="codeBox" style="background-color: #f0f0f0; border: 1px solid rgb(204, 204, 204); max-width: 100%; overflow: auto; padding: 10px;"><span style="font-family: Arial, Helvetica, sans-serif;">#ffffff;</span></pre>
</div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<h2 style="background-color: white; margin: 24px 0px 0px;">
<span style="font-family: Arial, Helvetica, sans-serif;">RGB Colors</span></h2>
</div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;">RGB color format is similar to hexadecimal color format. Each color is specified as a mixture between red, green and blue colors. Instead of using hexadecimal numbers, you use the decimal number betwen 0 and 255. Here is an example RGB color:</span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<b style="color: blue; font-family: Arial, Helvetica, sans-serif;">Example -</b></div>
<div>
<pre class="codeBox" style="background-color: #f0f0f0; border: 1px solid rgb(204, 204, 204); max-width: 100%; overflow: auto; padding: 10px;"><span style="font-family: Arial, Helvetica, sans-serif;">rgb(255, 0, 255);</span></pre>
</div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<h2 style="background-color: white; margin: 24px 0px 0px;">
<span style="font-family: Arial, Helvetica, sans-serif;">RGBA Colors</span></h2>
</div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;">RGBA hues mean Red, Green, Blue and Alpha. The RGB part is the same as in RGB hues. The An (alpha channel) determines the mistiness of the shading. The alpha channel esteem can be set between 0 (completely straightforward) and 1.0 (completely hazy). Here is a RGBA shading case:</span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<b style="color: blue; font-family: Arial, Helvetica, sans-serif;">Example -</b></div>
<div>
<pre class="codeBox" style="background-color: #f0f0f0; border: 1px solid rgb(204, 204, 204); max-width: 100%; overflow: auto; padding: 10px;"><span style="font-family: Arial, Helvetica, sans-serif;">RGBA (255, 0, 255, 1.0);</span></pre>
</div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<h2 style="background-color: white; margin: 24px 0px 0px;">
<span style="font-family: Arial, Helvetica, sans-serif;">HSL Colors</span></h2>
</div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;">HSL hues (Hue, Saturation, Lightness) are new in CSS 3.0. In the event that you are an architect you may be more used to working with HSL hues than RGB hues. You can indicate HSL hues this way:</span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<b style="color: blue; font-family: Arial, Helvetica, sans-serif;">Example -</b></div>
<div>
<pre class="codeBox" style="background-color: #f0f0f0; border: 1px solid rgb(204, 204, 204); max-width: 100%; overflow: auto; padding: 10px;"><span style="font-family: Arial, Helvetica, sans-serif;">hsl(0%, 100%, 0%); </span></pre>
</div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjgY-O89eqCSXMMSFCbDWrh7NeWyQFAQEd8mkWHsbI-226XDHrw46uvj7R7CDUTMsjXSv30L4wQIWFjeyjETpnGWuZOiOvO8ij2dkFwMmXd18SNGQudCmg9_Cqv_meX2PmALUTyn6TK4w/s1600/HTML-color-code-Color-Chart.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em; text-align: center;"><img border="0" data-original-height="418" data-original-width="941" height="284" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjgY-O89eqCSXMMSFCbDWrh7NeWyQFAQEd8mkWHsbI-226XDHrw46uvj7R7CDUTMsjXSv30L4wQIWFjeyjETpnGWuZOiOvO8ij2dkFwMmXd18SNGQudCmg9_Cqv_meX2PmALUTyn6TK4w/s640/HTML-color-code-Color-Chart.png" width="640" /></a></div>
</div>
It E Researchhttp://www.blogger.com/profile/02660842566926994686noreply@blogger.com0tag:blogger.com,1999:blog-7822657138986038530.post-50888607989495985972018-01-30T22:50:00.002-08:002018-01-30T23:05:02.555-08:00 CSS Padding property<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgJafNtUIGL8NggHse6U-5Ms5kcrrpVI2eWn3RqW_pvuxXDEiEua1KnMwGJ_q1CwPAdmcxYOfpaD6f9o4Ls5xJjZYHPd3yabE2ywqN7PVJpHR3iASQjOXfb_Z305cYfjXBaMewLoIYNEg/s1600/css-margin-padding-height-width-border-e1474955467480.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="406" data-original-width="500" height="323" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgJafNtUIGL8NggHse6U-5Ms5kcrrpVI2eWn3RqW_pvuxXDEiEua1KnMwGJ_q1CwPAdmcxYOfpaD6f9o4Ls5xJjZYHPd3yabE2ywqN7PVJpHR3iASQjOXfb_Z305cYfjXBaMewLoIYNEg/s400/css-margin-padding-height-width-border-e1474955467480.png" width="400" /></a></div>
<br />
<span style="font-family: Arial, Helvetica, sans-serif;">CSS padding properties allow you to set the padding area for an element that separates your content from your limit. Padding is affected by the background color of the box.</span><br />
<ul style="background-color: white;">
<li><code style="font-size: 14px;"><span style="font-family: Arial, Helvetica, sans-serif;">padding</span></code></li>
<li><code style="font-size: 14px;"><span style="font-family: Arial, Helvetica, sans-serif;">padding-top</span></code></li>
<li><code style="font-size: 14px;"><span style="font-family: Arial, Helvetica, sans-serif;">padding-right</span></code></li>
<li><code style="font-size: 14px;"><span style="font-family: Arial, Helvetica, sans-serif;">padding-bottom</span></code></li>
<li><code style="font-size: 14px;"><span style="font-family: Arial, Helvetica, sans-serif;">padding-left</span></code></li>
</ul>
<div>
<span style="color: blue; font-family: Arial, Helvetica, sans-serif;"><span style="font-size: 14px;"><b>Example -</b></span></span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><span style="font-size: 14px;"><br /></span></span></div>
<div>
<pre class="codeBox" style="border: 1px solid rgb(204, 204, 204); max-width: 100%; overflow: auto; padding: 10px;"><span style="background-color: white; color: #274e13; font-family: Arial, Helvetica, sans-serif;">#divOne {
padding : 20px;
}
#divTwo {
padding : 20px 10px 20px 10px;
}
#divThree {
padding-top : 20px;
padding-right : 10px;
padding-bottom : 20px;
padding-left : 10px;
}</span></pre>
</div>
<div>
<span style="font-size: 14px;"><span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></span></div>
<div>
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj4PVeD7VLkjt6qUaR2KHpADYtuYTqPtCQVXYVlxug3ZOR6y6m_9fbiOl5t6D_Y_wq9q2xg4mSgUuxr2h5ZdsyNPPkRq-2yDT0g1VhlNt-7PcU0iH_RFZWhWTORcb3Q5EVWk7lGfsUrNw/s1600/IC701263.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em; text-align: center;"><img border="0" data-original-height="356" data-original-width="535" height="424" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj4PVeD7VLkjt6qUaR2KHpADYtuYTqPtCQVXYVlxug3ZOR6y6m_9fbiOl5t6D_Y_wq9q2xg4mSgUuxr2h5ZdsyNPPkRq-2yDT0g1VhlNt-7PcU0iH_RFZWhWTORcb3Q5EVWk7lGfsUrNw/s640/IC701263.png" width="640" /></a></div>
<div>
<span style="font-size: 14px;"><span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></span></div>
<div>
<span style="font-size: 14px;"><span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></span></div>
<div>
<span style="font-family: monospace;"><span style="font-size: 14px;"><br /></span></span></div>
</div>
It E Researchhttp://www.blogger.com/profile/02660842566926994686noreply@blogger.com0tag:blogger.com,1999:blog-7822657138986038530.post-3162799043242059932018-01-30T22:48:00.002-08:002018-01-30T23:05:02.547-08:00CSS margin property<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh41tswVEM9noJzUp4-EdPJ-9uLlVhi3oO8FuN17vBI6ELq1w8Z19fW9JSFCarZkxuvbyGIYsCkTdm-5FGmgDl9y-b2gegvJft_gjlCbSrD2M204CS3BasVQD-1ReIQ7qvGz5GADGAF5Q/s1600/margin-to-each-side.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="400" data-original-width="500" height="512" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh41tswVEM9noJzUp4-EdPJ-9uLlVhi3oO8FuN17vBI6ELq1w8Z19fW9JSFCarZkxuvbyGIYsCkTdm-5FGmgDl9y-b2gegvJft_gjlCbSrD2M204CS3BasVQD-1ReIQ7qvGz5GADGAF5Q/s640/margin-to-each-side.png" width="640" /></a></div>
<br />
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<span style="font-family: Arial, Helvetica, sans-serif;">Margin property defines the place around an HTML element. It is possible to use negative values to overlap content.</span><br />
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span>
<ul style="background-color: white;">
<li><code style="font-size: 14px;"><span style="font-family: Arial, Helvetica, sans-serif;">margin</span></code></li>
<li><code style="font-size: 14px;"><span style="font-family: Arial, Helvetica, sans-serif;">margin-top</span></code></li>
<li><code style="font-size: 14px;"><span style="font-family: Arial, Helvetica, sans-serif;">margin-right</span></code></li>
<li><code style="font-size: 14px;"><span style="font-family: Arial, Helvetica, sans-serif;">margin-bottom</span></code></li>
<li><code style="font-size: 14px;"><span style="font-family: Arial, Helvetica, sans-serif;">margin-left</span></code></li>
</ul>
<div>
<pre class="codeBox" style="border: 1px solid rgb(204, 204, 204); max-width: 100%; overflow: auto; padding: 10px;"><span style="background-color: white; color: #274e13; font-family: Arial, Helvetica, sans-serif;">#divOne {
margin : 20px;
}
#divTwo {
margin : 20px 10px 20px 10px;
}
#divThree {
margin-top : 20px;
margin-right : 10px;
margin-bottom : 20px;
margin-left : 10px;
}</span></pre>
</div>
<div>
<span style="font-size: 14px;"><span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></span></div>
<div>
<span style="font-size: 14px;"><span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></span></div>
<div>
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgoa_f66AWxnNzPC193S3kjqO5LqXkE2Xs-Q7zreCm-QoGaiSc3cn4m8Jfqj8iFS_0fRU8jQWgHN3UvIFVUQUhb-E-yVvySGud5GMLTui4B8eLXIq__Lxjp0TNvOjduzS5Nrao6z5k3CA/s1600/bc067040fcc7b8c20fe425e675b742b4--html-css-programming.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em; text-align: center;"><img border="0" data-original-height="450" data-original-width="564" height="317" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgoa_f66AWxnNzPC193S3kjqO5LqXkE2Xs-Q7zreCm-QoGaiSc3cn4m8Jfqj8iFS_0fRU8jQWgHN3UvIFVUQUhb-E-yVvySGud5GMLTui4B8eLXIq__Lxjp0TNvOjduzS5Nrao6z5k3CA/s400/bc067040fcc7b8c20fe425e675b742b4--html-css-programming.jpg" width="400" /></a></div>
<div>
<span style="font-size: 14px;"><span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></span></div>
<div>
<span style="font-size: 14px;"><span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></span></div>
<div>
<span style="font-family: monospace;"><span style="font-size: 14px;"><br /></span></span></div>
</div>
It E Researchhttp://www.blogger.com/profile/02660842566926994686noreply@blogger.com0tag:blogger.com,1999:blog-7822657138986038530.post-42090251304821991802018-01-30T22:42:00.001-08:002018-01-30T22:42:51.381-08:00Types of CSS<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjgYg1bXe6_Id5AZ9lY0kft8EyamRRLtECfDmqMwZxLnR0vbx8x9gP7b_x_zZF1KHozRj17TcMWSsjVqajo4-k8jV-wiAP_ocw4atoWxl8wd3qXoZg9SG_IhJSz8-vAepNLuNbsY9_GKw/s1600/types+of+css.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="314" data-original-width="674" height="298" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjgYg1bXe6_Id5AZ9lY0kft8EyamRRLtECfDmqMwZxLnR0vbx8x9gP7b_x_zZF1KHozRj17TcMWSsjVqajo4-k8jV-wiAP_ocw4atoWxl8wd3qXoZg9SG_IhJSz8-vAepNLuNbsY9_GKw/s640/types+of+css.jpg" width="640" /></a></div>
<span style="background-color: white;"><span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></span>
<span style="background-color: white;"><span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></span>
<span style="background-color: white;"><span style="font-family: Arial, Helvetica, sans-serif;">There are three types of CSS</span></span><br />
<br />
<ul style="text-align: left;">
<li><span style="font-family: Arial, Helvetica, sans-serif;">External style sheet</span></li>
<li><span style="font-family: Arial, Helvetica, sans-serif;">Internal style sheet</span></li>
<li><span style="font-family: Arial, Helvetica, sans-serif;">Inline style</span></li>
</ul>
<div>
</div>
<br />
<h2 style="background-color: white; box-sizing: inherit; margin: 10px 0px;">
<span style="color: red; font-family: Arial, Helvetica, sans-serif; font-size: large;">External CSS</span></h2>
<div>
<span style="color: blue; font-family: Arial, Helvetica, sans-serif;"><b>Example -</b></span></div>
<div>
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<div>
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"><!DOCTYPE html></span></div>
<div>
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"><html></span></div>
<div>
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"><head></span></div>
<div>
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"><link rel="stylesheet" type="text/css" href="demo.css"></span></div>
<div>
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"></head></span></div>
<div>
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"><body></span></div>
<div>
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"><h1>Demo1</h1></span></div>
<div>
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"><p>paragraph.</p></span></div>
<div>
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"></body></span></div>
<div>
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"></html></span></div>
</div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<h2 style="background-color: white; box-sizing: inherit; margin: 10px 0px;">
<span style="color: red; font-family: Arial, Helvetica, sans-serif; font-size: large;">Internal CSS</span></h2>
</div>
<div>
<span style="color: blue; font-family: Arial, Helvetica, sans-serif;"><b>Example -</b></span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<div>
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"><!DOCTYPE html></span></div>
<div>
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"><html></span></div>
<div>
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"><head></span></div>
<div>
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"><style></span></div>
<div>
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;">body {</span></div>
<div>
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"> background-color: linen;</span></div>
<div>
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;">}</span></div>
<div>
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;">h1 {</span></div>
<div>
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"> color: maroon;</span></div>
<div>
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"> margin-left: 40px;</span></div>
<div>
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;">} </span></div>
<div>
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"></style></span></div>
<div>
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"></head></span></div>
<div>
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"><body></span></div>
<div>
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"><h1>This is a heading</h1></span></div>
<div>
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"><p>This is a paragraph.</p></span></div>
<div>
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"></body></span></div>
<div>
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"></html></span></div>
</div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<h2 style="background-color: white; box-sizing: inherit; margin: 10px 0px;">
<span style="color: red; font-family: Arial, Helvetica, sans-serif; font-size: large;">Inline CSS</span></h2>
</div>
<div>
<span style="color: blue; font-family: Arial, Helvetica, sans-serif;"><b>Example -</b></span></div>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<div>
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"><!DOCTYPE html></span></div>
<div>
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"><html></span></div>
<div>
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"><body></span></div>
<div>
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"><h1 style="color:blue;margin-left:30px;">This is a heading</h1></span></div>
<div>
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"><p>This is a paragraph.</p></span></div>
<div>
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"></body></span></div>
<div>
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"></html></span></div>
</div>
<div>
<br /></div>
<span style="font-family: Verdana, sans-serif;"><span style="background-color: white; font-size: 15px;"></span></span></div>
It E Researchhttp://www.blogger.com/profile/02660842566926994686noreply@blogger.com0tag:blogger.com,1999:blog-7822657138986038530.post-91205022287536017872018-01-30T22:37:00.002-08:002018-01-30T22:42:51.385-08:00CSS Selector<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEho91PTc_n-ZfjYNGNSl9flFOMp0bM3-qKS1mRbeMaEzOZg87UjduXBxyLd9MHbOLgb48fDg8cutMc_JO6tKU-IAjiQO6VlNN6OU0DmkkSocl341bObk8_5y8g_HyZD9l6YYRtjd9OF3w/s1600/CSS_Selectors_650x3501.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="350" data-original-width="650" height="344" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEho91PTc_n-ZfjYNGNSl9flFOMp0bM3-qKS1mRbeMaEzOZg87UjduXBxyLd9MHbOLgb48fDg8cutMc_JO6tKU-IAjiQO6VlNN6OU0DmkkSocl341bObk8_5y8g_HyZD9l6YYRtjd9OF3w/s640/CSS_Selectors_650x3501.jpg" width="640" /></a></div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="font-family: Arial, Helvetica, sans-serif;">Selectors are a standout amongst the most imperative parts of CSS as they are utilized to choose components on a site page with the goal that they can be styled. You can characterize selectors in different ways.</span><br />
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span>
<h2 style="background-color: white; border: 0px; font-size: 22px; font-stretch: inherit; font-variant-east-asian: inherit; font-variant-numeric: inherit; line-height: 1.1em; margin: 0px; padding: 0px; vertical-align: baseline;">
<span style="font-family: Arial, Helvetica, sans-serif;">Universal Selector</span></h2>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div style="text-align: left;">
<span style="font-family: Arial, Helvetica, sans-serif;"><span style="color: #222222; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;">* {</span><br /><span style="background-color: #f8f8f8; color: #222222; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> </span><span class="cm-property" style="background-color: #f8f8f8; border: 0px; color: #555555; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">margin</span><span class="cm-operator" style="background-color: #f8f8f8; border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">:</span><span style="background-color: #f8f8f8; color: #222222; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> </span><span class="cm-number" style="background-color: #f8f8f8; border: 0px; color: #ff6600; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">0</span><span style="background-color: #f8f8f8; color: #222222; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;">;</span><br /><span style="color: #222222; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> </span><span class="cm-property" style="border: 0px; color: #555555; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">padding</span><span class="cm-operator" style="border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">:</span><span style="color: #222222; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> </span><span class="cm-number" style="border: 0px; color: #ff6600; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">0</span><span style="color: #222222; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;">;</span><br /><span style="background-color: #f8f8f8; color: #222222; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;">}</span></span></div>
<div style="text-align: left;">
<span style="background-color: #f8f8f8; color: #222222; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"><span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></span></div>
<div style="text-align: left;">
<span style="background-color: #f8f8f8; font-size: 12.524px; white-space: pre-wrap;"><span style="color: #222222; font-family: Arial, Helvetica, sans-serif;">* The style rules inside the selector will be applied to each element in a document.</span></span></div>
<div style="text-align: left;">
<span style="background-color: #f8f8f8; font-size: 12.524px; white-space: pre-wrap;"><span style="color: #222222; font-family: Arial, Helvetica, sans-serif;"><br /></span></span></div>
<div style="text-align: left;">
<span style="background-color: #f8f8f8; font-size: 12.524px; white-space: pre-wrap;"><span style="color: #222222; font-family: Arial, Helvetica, sans-serif;"><br /></span></span></div>
<div style="text-align: left;">
<h2 style="background-color: white; border: 0px; font-size: 22px; font-stretch: inherit; font-variant-east-asian: inherit; font-variant-numeric: inherit; line-height: 1.1em; margin: 0px; padding: 0px; vertical-align: baseline;">
<span style="font-family: Arial, Helvetica, sans-serif;">Element Type Selector</span></h2>
<div>
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div style="text-align: left;">
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"><span style="font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;">h1</span><span style="font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> {</span><br /><span style="background-color: #f8f8f8; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> </span><span class="cm-property" style="background-color: #f8f8f8; border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">color</span><span class="cm-operator" style="background-color: #f8f8f8; border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">:</span><span style="background-color: #f8f8f8; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> </span><span class="cm-keyword" style="background-color: #f8f8f8; border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">blue</span><span style="background-color: #f8f8f8; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;">;</span><br /><span style="font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;">}</span></span></div>
<div style="text-align: left;">
<span style="color: #222222; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"><span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></span></div>
<div style="text-align: left;">
<h2 style="background-color: white; border: 0px; font-size: 22px; font-stretch: inherit; font-variant-east-asian: inherit; font-variant-numeric: inherit; line-height: 1.1em; margin: 0px; padding: 0px; vertical-align: baseline;">
<span style="font-family: Arial, Helvetica, sans-serif;">Id Selectors</span></h2>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div style="text-align: left;">
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"><span class="cm-builtin" style="border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">#heading</span><span style="font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> {</span><br /><span style="background-color: #f8f8f8; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> </span><span class="cm-property" style="background-color: #f8f8f8; border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">color</span><span class="cm-operator" style="background-color: #f8f8f8; border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">:</span><span style="background-color: #f8f8f8; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> </span><span class="cm-keyword" style="background-color: #f8f8f8; border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">red</span><span style="background-color: #f8f8f8; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;">;</span><br /><span style="font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;">}</span></span></div>
<div style="text-align: left;">
<span style="color: #222222; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"><span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></span></div>
<div style="text-align: left;">
<span style="color: #222222; font-family: Arial, Helvetica, sans-serif;"><span style="font-size: 12.524px; white-space: pre-wrap;">The ID selector is defined with a hash mark (#), immediately followed by an ID value.</span></span></div>
<div style="text-align: left;">
<span style="color: #222222; font-family: Arial, Helvetica, sans-serif;"><span style="font-size: 12.524px; white-space: pre-wrap;"><br /></span></span></div>
<div style="text-align: left;">
<h2 style="background-color: white; border: 0px; font-size: 22px; font-stretch: inherit; font-variant-east-asian: inherit; font-variant-numeric: inherit; line-height: 1.1em; margin: 0px; padding: 0px; vertical-align: baseline;">
<span style="font-family: Arial, Helvetica, sans-serif;">Class Selectors</span></h2>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div style="text-align: left;">
<span style="font-family: Arial, Helvetica, sans-serif;"><span class="cm-qualifier" style="border: 0px; color: #555555; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">.</span><span style="color: #274e13;"><span class="cm-qualifier" style="border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">blue</span><span style="font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> {</span><br /><span style="background-color: #f8f8f8; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> </span><span class="cm-property" style="background-color: #f8f8f8; border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">color</span><span class="cm-operator" style="background-color: #f8f8f8; border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">:</span><span style="background-color: #f8f8f8; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> </span><span class="cm-keyword" style="background-color: #f8f8f8; border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">blue</span><span style="background-color: #f8f8f8; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;">;</span><br /><span style="font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;">}</span></span></span></div>
<div style="text-align: left;">
<span style="color: #222222; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"><span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></span></div>
<div style="text-align: left;">
<span style="color: #222222; font-family: Arial, Helvetica, sans-serif;"><span style="font-size: 12.524px; white-space: pre-wrap;">The above style rules underline the text in blue in each element in the document in which the class attribute is set in blue. You can make it a bit more specifically, for example:</span></span></div>
<div style="text-align: left;">
<span style="color: #222222; font-family: Arial, Helvetica, sans-serif;"><span style="font-size: 12.524px; white-space: pre-wrap;"><br /></span></span></div>
<div style="text-align: left;">
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"><span class="cm-tag" style="border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">p</span><span class="cm-qualifier" style="border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">.blue</span><span style="font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> {</span><br /><span style="background-color: #f8f8f8; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> </span><span class="cm-property" style="background-color: #f8f8f8; border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">color</span><span class="cm-operator" style="background-color: #f8f8f8; border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">:</span><span style="background-color: #f8f8f8; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> </span><span class="cm-keyword" style="background-color: #f8f8f8; border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">blue</span><span style="background-color: #f8f8f8; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;">;</span><br /><span style="font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;">}</span></span></div>
<div style="text-align: left;">
<span style="color: #222222; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"><span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></span></div>
<div style="text-align: left;">
<h2 style="background-color: white; border: 0px; font-size: 22px; font-stretch: inherit; font-variant-east-asian: inherit; font-variant-numeric: inherit; line-height: 1.1em; margin: 0px; padding: 0px; vertical-align: baseline;">
<span style="font-family: Arial, Helvetica, sans-serif;">Descendant Selectors</span></h2>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div style="text-align: left;">
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"><span class="cm-tag" style="border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">ul</span><span class="cm-qualifier" style="border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">.menu</span><span style="font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> </span><span class="cm-tag" style="border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">li</span><span style="font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> </span><span class="cm-tag" style="border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">a</span><span style="font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> {</span><br /><span style="background-color: #f8f8f8; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> </span><span class="cm-property" style="background-color: #f8f8f8; border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">text-decoration</span><span class="cm-operator" style="background-color: #f8f8f8; border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">:</span><span style="background-color: #f8f8f8; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> </span><span class="cm-string-2" style="background-color: #f8f8f8; border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">none</span><span style="background-color: #f8f8f8; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;">;</span><br /><span style="font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;">}</span><br /><span class="cm-tag" style="background-color: #f8f8f8; border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">h1</span><span style="background-color: #f8f8f8; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> </span><span class="cm-tag" style="background-color: #f8f8f8; border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">em</span><span style="background-color: #f8f8f8; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> {</span><br /><span style="font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> </span><span class="cm-property" style="border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">color</span><span class="cm-operator" style="border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">:</span><span style="font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> </span><span class="cm-keyword" style="border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">green</span><span style="font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;">;</span><br /><span style="background-color: #f8f8f8; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;">}</span></span></div>
<div style="text-align: left;">
<span style="background-color: #f8f8f8; color: #222222; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"><span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></span></div>
<div style="text-align: left;">
<span style="background-color: #f8f8f8; color: #222222; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"><span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></span></div>
<div style="text-align: left;">
<h2 style="background-color: white; border: 0px; font-size: 22px; font-stretch: inherit; font-variant-east-asian: inherit; font-variant-numeric: inherit; line-height: 1.1em; margin: 0px; padding: 0px; vertical-align: baseline;">
<span style="font-family: Arial, Helvetica, sans-serif;">Child Selectors</span></h2>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div style="text-align: left;">
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"><span class="cm-tag" style="border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">ul</span><span style="font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> > </span><span class="cm-tag" style="border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">li</span><span style="font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> {</span><br /><span style="background-color: #f8f8f8; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> </span><span class="cm-property" style="background-color: #f8f8f8; border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">list-style</span><span class="cm-operator" style="background-color: #f8f8f8; border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">:</span><span style="background-color: #f8f8f8; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> </span><span class="cm-keyword" style="background-color: #f8f8f8; border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">square</span><span style="background-color: #f8f8f8; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;">;</span><br /><span style="font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;">}</span><br /><span class="cm-tag" style="background-color: #f8f8f8; border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">ul</span><span style="background-color: #f8f8f8; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> > </span><span class="cm-tag" style="background-color: #f8f8f8; border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">li</span><span style="background-color: #f8f8f8; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> </span><span class="cm-tag" style="background-color: #f8f8f8; border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">ol</span><span style="background-color: #f8f8f8; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> {</span><br /><span style="font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> </span><span class="cm-property" style="border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">list-style</span><span class="cm-operator" style="border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">:</span><span style="font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> </span><span class="cm-string-2" style="border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">none</span><span style="font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;">;</span><br /><span style="background-color: #f8f8f8; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;">}</span></span></div>
<div style="text-align: left;">
<span style="background-color: #f8f8f8; color: #222222; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"><span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></span></div>
<div style="text-align: left;">
<span style="background-color: #f8f8f8; color: #222222; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"><span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></span></div>
<div style="text-align: left;">
<h2 style="background-color: white; border: 0px; font-size: 22px; font-stretch: inherit; font-variant-east-asian: inherit; font-variant-numeric: inherit; line-height: 1.1em; margin: 0px; padding: 0px; vertical-align: baseline;">
<span style="font-family: Arial, Helvetica, sans-serif;">Grouping Selectors</span></h2>
<div>
<span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div style="text-align: left;">
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"><span class="cm-tag" style="border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">h1</span><span style="font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> {</span><br /><span style="background-color: #f8f8f8; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> </span><span class="cm-property" style="background-color: #f8f8f8; border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">font-size</span><span class="cm-operator" style="background-color: #f8f8f8; border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">:</span><span style="background-color: #f8f8f8; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> </span><span class="cm-number" style="background-color: #f8f8f8; border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">36px</span><span style="background-color: #f8f8f8; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;">;</span><br /><span style="font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> </span><span class="cm-property" style="border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">font-weight</span><span class="cm-operator" style="border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">:</span><span style="font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> </span><span class="cm-string-2" style="border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">normal</span><span style="font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;">;</span><br /><span style="background-color: #f8f8f8; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;">}</span><br /><span class="cm-tag" style="border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">h2</span><span style="font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> {</span><br /><span style="background-color: #f8f8f8; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> </span><span class="cm-property" style="background-color: #f8f8f8; border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">font-size</span><span class="cm-operator" style="background-color: #f8f8f8; border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">:</span><span style="background-color: #f8f8f8; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> </span><span class="cm-number" style="background-color: #f8f8f8; border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">28px</span><span style="background-color: #f8f8f8; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;">;</span><br /><span style="font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> </span><span class="cm-property" style="border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">font-weight</span><span class="cm-operator" style="border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">:</span><span style="font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> </span><span class="cm-string-2" style="border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">normal</span><span style="font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;">;</span><br /><span style="background-color: #f8f8f8; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;">}</span><br /><span class="cm-tag" style="border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">h3</span><span style="font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> {</span><br /><span style="background-color: #f8f8f8; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> </span><span class="cm-property" style="background-color: #f8f8f8; border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">font-size</span><span class="cm-operator" style="background-color: #f8f8f8; border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">:</span><span style="background-color: #f8f8f8; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> </span><span class="cm-number" style="background-color: #f8f8f8; border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">22px</span><span style="background-color: #f8f8f8; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;">;</span><br /><span style="font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> </span><span class="cm-property" style="border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">font-weight</span><span class="cm-operator" style="border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">:</span><span style="font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> </span><span class="cm-string-2" style="border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">normal</span><span style="font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;">;</span><br /><span style="background-color: #f8f8f8; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;">}</span></span></div>
<div style="text-align: left;">
<span style="background-color: #f8f8f8; color: #222222; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"><span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></span></div>
<div style="text-align: left;">
<span style="background-color: #f8f8f8; color: #222222; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"><span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></span></div>
<div style="text-align: left;">
<span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"><span class="cm-tag" style="border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">h1</span><span style="font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;">, </span><span class="cm-tag" style="border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">h2</span><span style="font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;">, </span><span class="cm-tag" style="border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">h3</span><span style="font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> {</span><br /><span style="background-color: #f8f8f8; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> </span><span class="cm-property" style="background-color: #f8f8f8; border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">font-weight</span><span class="cm-operator" style="background-color: #f8f8f8; border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">:</span><span style="background-color: #f8f8f8; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> </span><span class="cm-string-2" style="background-color: #f8f8f8; border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">normal</span><span style="background-color: #f8f8f8; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;">;</span><br /><span style="font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;">}</span><br /><span class="cm-tag" style="background-color: #f8f8f8; border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">h1</span><span style="background-color: #f8f8f8; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> {</span><br /><span style="font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> </span><span class="cm-property" style="border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">font-size</span><span class="cm-operator" style="border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">:</span><span style="font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> </span><span class="cm-number" style="border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">36px</span><span style="font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;">;</span><br /><span style="background-color: #f8f8f8; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;">}</span><br /><span class="cm-tag" style="border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">h2</span><span style="font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> {</span><br /><span style="background-color: #f8f8f8; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> </span><span class="cm-property" style="background-color: #f8f8f8; border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">font-size</span><span class="cm-operator" style="background-color: #f8f8f8; border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">:</span><span style="background-color: #f8f8f8; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> </span><span class="cm-number" style="background-color: #f8f8f8; border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">28px</span><span style="background-color: #f8f8f8; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;">;</span><br /><span style="font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;">}</span><br /><span class="cm-tag" style="background-color: #f8f8f8; border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">h3</span><span style="background-color: #f8f8f8; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> {</span><br /><span style="font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> </span><span class="cm-property" style="border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">font-size</span><span class="cm-operator" style="border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">:</span><span style="font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> </span><span class="cm-number" style="border: 0px; font-size: inherit; font-stretch: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">22px</span><span style="font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;">;</span><br /><span style="background-color: #f8f8f8; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;">}</span></span></div>
<div style="text-align: left;">
<span style="background-color: #f8f8f8; color: #222222; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"><span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></span></div>
<div style="text-align: left;">
<span style="background-color: #f8f8f8; color: #222222; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"><span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></span></div>
<div style="text-align: left;">
<span style="background-color: #f8f8f8; color: #222222; font-family: MenschRegular, consolas, courier, monospace; font-size: 12.524px; font-style: inherit; font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"><br /></span></div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
It E Researchhttp://www.blogger.com/profile/02660842566926994686noreply@blogger.com0tag:blogger.com,1999:blog-7822657138986038530.post-91205404539045674432018-01-30T22:30:00.000-08:002018-01-30T22:42:51.388-08:00Introduction of CSS<div dir="ltr" style="text-align: left;" trbidi="on">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiejCgn_sFYsXGnZATLdmGwaPUMPh_sptPCtauXnlBWLY_cjfjhI3B5zQExJL29wX9NXu2r4TWBi7apcwqWEsD0zeofYOT67spg37yJqMUq9NrBeKSMTgdYZO3Are4KqpifhBqebL7qFQ/s1600/7.jpg" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em; text-align: center;"><span style="color: #444444; font-family: Arial, Helvetica, sans-serif;"><img border="0" data-original-height="630" data-original-width="1200" height="336" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiejCgn_sFYsXGnZATLdmGwaPUMPh_sptPCtauXnlBWLY_cjfjhI3B5zQExJL29wX9NXu2r4TWBi7apcwqWEsD0zeofYOT67spg37yJqMUq9NrBeKSMTgdYZO3Are4KqpifhBqebL7qFQ/s640/7.jpg" width="640" /></span></a><br />
<span style="color: #444444; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="color: #444444; font-family: Arial, Helvetica, sans-serif;">CSS stands for CSS Cascading Style Sheets CSS allows you to specify different style attributes for given HTML elements such as colors, backgrounds, fonts etc.</span><br />
<span style="color: #444444; font-family: Arial, Helvetica, sans-serif;"><br /></span>
<span style="color: #444444; font-family: Arial, Helvetica, sans-serif;"><span style="background-color: white;">CSS handles one and feels part of a web page. Using CSS, you can set the color of the text, the style of fonts, the space between the paragraphs, how to shape and exclude the columns, what background images or colors are used, layout design, different devices and screens Can control variations in the performance of sizes. There are also many other effects as well.</span></span><br />
<br />
<ul style="text-align: left;">
<li><span style="color: #444444; font-family: Arial, Helvetica, sans-serif;">Selectors</span></li>
<li><span style="color: #444444; font-family: Arial, Helvetica, sans-serif;">Box model</span></li>
<li><span style="color: #444444; font-family: Arial, Helvetica, sans-serif;">Backgrounds and boundaries</span></li>
<li><span style="color: #444444; font-family: Arial, Helvetica, sans-serif;">Image values and replaced content</span></li>
<li><span style="color: #444444; font-family: Arial, Helvetica, sans-serif;">Text effect</span></li>
<li><span style="color: #444444; font-family: Arial, Helvetica, sans-serif;">2D / 3D Transformation</span></li>
<li><span style="color: #444444; font-family: Arial, Helvetica, sans-serif;">Animation</span></li>
<li><span style="color: #444444; font-family: Arial, Helvetica, sans-serif;">Multiple column layouts</span></li>
<li><span style="color: #444444; font-family: Arial, Helvetica, sans-serif;">user interface</span></li>
</ul>
<br />
<h1 style="background-color: white; border: 0px; font-stretch: inherit; font-variant-east-asian: inherit; font-variant-numeric: inherit; line-height: 36px; margin: 0px; padding: 0px 0px 20px; text-align: center; vertical-align: baseline;">
<span style="color: red; font-family: Arial, Helvetica, sans-serif; font-size: large;">CSS <span style="border: 0px; font-stretch: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;">Syntax</span></span></h1>
<div>
<span style="color: red; font-family: Arial, Helvetica, sans-serif; font-size: large;"><span style="border: 0px; font-stretch: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><br /></span></span></div>
<div>
<span style="border: 0px; font-stretch: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><span style="color: #444444; font-family: Arial, Helvetica, sans-serif;"><br /></span></span></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhdkH_VvecR5GCQRAxIGcQmFCxOz3CE2C0a42aDkCpBsuCNE3fAQyqsuRZbS5DPAx9KJIWqtwo6t7dyhhqYHPrU4sjVgAq5g4aP8Ykzmf-Prr2_G70rVyQBTEX3aU5nHTcCTY3a27Y3-w/s1600/css-syntax.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><span style="color: #444444; font-family: Arial, Helvetica, sans-serif;"><img border="0" data-original-height="340" data-original-width="1030" height="209" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhdkH_VvecR5GCQRAxIGcQmFCxOz3CE2C0a42aDkCpBsuCNE3fAQyqsuRZbS5DPAx9KJIWqtwo6t7dyhhqYHPrU4sjVgAq5g4aP8Ykzmf-Prr2_G70rVyQBTEX3aU5nHTcCTY3a27Y3-w/s640/css-syntax.png" width="640" /></span></a></div>
<br />
<div class="separator" style="clear: both; text-align: center;">
<span style="color: #444444; font-family: Arial, Helvetica, sans-serif;"><br /></span></div>
<div>
<span style="border: 0px; font-stretch: inherit; font-variant: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><span style="color: blue; font-family: Arial, Helvetica, sans-serif;"><b>Example - </b></span></span></div>
<div>
<span style="border: 0px; font-stretch: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><span style="color: #444444; font-family: Arial, Helvetica, sans-serif;"><br /></span></span></div>
<div style="text-align: left;">
<span style="border: 0px; font-stretch: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><span style="color: #274e13; font-family: Arial, Helvetica, sans-serif;"><span class="selector" style="border: 0px; font-stretch: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">h1</span><span style="font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> {</span><br /><span style="font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> </span><span class="property" style="border: 0px; font-stretch: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">color</span><span style="font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;">: </span><span class="property-value" style="border: 0px; font-stretch: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">blue</span><span style="font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;">;</span><br /><span style="font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"> </span><span class="property" style="border: 0px; font-stretch: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">text-align</span><span style="font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;">: </span><span class="property-value" style="border: 0px; font-stretch: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;">center</span><span style="font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;">;</span><br /><span style="font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;">}</span></span></span></div>
<div style="text-align: left;">
<span style="border: 0px; font-stretch: inherit; font-variant: inherit; font-weight: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline;"><span style="font-variant-caps: inherit; font-variant-ligatures: inherit; font-weight: inherit; white-space: pre-wrap;"><span style="color: #444444; font-family: Arial, Helvetica, sans-serif;"><br /></span></span></span></div>
<div style="text-align: left;">
<span style="border: 0px; font-stretch: inherit; font-variant-east-asian: inherit; font-variant-numeric: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;"><span style="color: #444444; font-family: Arial, Helvetica, sans-serif;">H1 The above example has a selector, color and text alignment properties, and blue and center have corresponding values of these properties.</span></span></div>
<div style="text-align: left;">
<span style="border: 0px; font-stretch: inherit; font-variant-east-asian: inherit; font-variant-numeric: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;"><span style="color: #444444; font-family: Arial, Helvetica, sans-serif;"><br /></span></span></div>
<div style="text-align: left;">
<span style="border: 0px; font-stretch: inherit; font-variant-east-asian: inherit; font-variant-numeric: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;"><pre class="codeBox" style="background-color: #f0f0f0; border: 1px solid rgb(204, 204, 204); max-width: 100%; overflow: auto; padding: 10px;"><span style="color: #444444; font-family: Arial, Helvetica, sans-serif;"><!DOCTYPE html>
<html>
<body>
<style>
div {
border: 1px solid black;
}
</style>
<div> Style This! </div>
</body>
</html> </span></pre>
</span></div>
<div style="text-align: left;">
<br /></div>
<div style="text-align: left;">
<span style="border: 0px; font-size: 13px; font-stretch: inherit; font-variant-east-asian: inherit; font-variant-numeric: inherit; line-height: inherit; margin: 0px; padding: 0px; vertical-align: baseline; white-space: pre-wrap;"><span style="color: #222222; font-family: MenschRegular, consolas, courier, monospace;"><br /></span></span></div>
<span style="color: #414141; font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Helvetica, Arial, sans-serif;"><i><span style="background-color: white; font-size: 18px;"></span></i></span></div>
It E Researchhttp://www.blogger.com/profile/02660842566926994686noreply@blogger.com0tag:blogger.com,1999:blog-7822657138986038530.post-47361947859339020662018-01-19T03:21:00.000-08:002018-01-28T23:48:33.448-08:00Methods in Java<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiod7Wbgh5IH3aal5VRCAc_FZ-PPaQQiSW54zsYMzqxkqnStRSdWTmB6l7as2S3JH7bZ6umVJ19htpwjqt9ObYbFmhMH0agM_m6YRR5YlWfrSPoOZ4XshbzGkRZs1-OKgmwE6IdY1qW7A/s1600/function.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="398" data-original-width="742" height="342" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiod7Wbgh5IH3aal5VRCAc_FZ-PPaQQiSW54zsYMzqxkqnStRSdWTmB6l7as2S3JH7bZ6umVJ19htpwjqt9ObYbFmhMH0agM_m6YRR5YlWfrSPoOZ4XshbzGkRZs1-OKgmwE6IdY1qW7A/s640/function.png" width="640" /></a></div>
<span style="background-color: white;"><span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></span>
<span style="background-color: white;"><span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></span>
<span style="background-color: white;"><span style="font-family: Arial, Helvetica, sans-serif;">A method is a group of code that is referred to by name and can be said at any point in the program using the name of the method. Think of a method as a subprogram that works on statistics and often gives a value.</span></span><br />
<span style="background-color: white;"><span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></span>
<span style="background-color: white;"><span style="font-family: Arial, Helvetica, sans-serif;">Each method has its own name in the name of that name, in the event of execution of program branches to the body of that method. When the method expires, the execution program returns to the field of code, from which it was called, and the program continues on the next line of code.</span></span><br />
<span style="background-color: white;"><span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></span>
<h3 style="-webkit-font-smoothing: antialiased; color: #252830; font-size: 1.6em; line-height: 1.15; margin: 0.8em 0px 0.35em;">
<span style="background-color: white;"><span style="font-family: Arial, Helvetica, sans-serif;">Types of Java methods</span></span></h3>
<ul style="-webkit-font-smoothing: antialiased; color: #252830; font-size: 16px; margin-bottom: 1.8em; word-spacing: 3px;">
<li><span style="background-color: white;"><span style="font-family: Arial, Helvetica, sans-serif;">Standard Library Methods</span></span></li>
<li><span style="background-color: white;"><span style="font-family: Arial, Helvetica, sans-serif;">User-defined Methods</span></span></li>
</ul>
<div>
<h3 style="-webkit-font-smoothing: antialiased; color: #252830; font-size: 1.6em; line-height: 1.15; margin: 0.8em 0px 0.35em;">
<span style="background-color: white;"><span style="font-family: Arial, Helvetica, sans-serif;">Standard Library Methods</span></span></h3>
</div>
<div>
<span style="background-color: white;"><span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></span></div>
<div>
<span style="background-color: white;"><span style="font-family: Arial, Helvetica, sans-serif;">Standard library methods are the built-in methods in Java that are easily available for use. These standard libraries come with JVM and JRE in Java archive (* .jar) file with Java Class Library (JCL).</span></span></div>
<div>
<span style="background-color: white;"><span style="font-family: Arial, Helvetica, sans-serif;"><br /></span></span></div>
<div>
<div style="-webkit-font-smoothing: antialiased; color: #252830; font-size: 16px; margin-bottom: 1.4em; word-spacing: 3px;">
<span style="background-color: white;"><span style="font-family: Arial, Helvetica, sans-serif;">For example,</span></span></div>
<ul style="-webkit-font-smoothing: antialiased; color: #252830; font-size: 16px; margin-bottom: 1.8em; word-spacing: 3px;">
<li><span style="background-color: white;"><span style="font-family: Arial, Helvetica, sans-serif;"><code style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border-radius: 2px; font-size: 0.86em; padding: 1px 5px;">print()</code> is a method of <code style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border-radius: 2px; font-size: 0.86em; padding: 1px 5px;">java.io.PrintSteam</code>. The <code style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border-radius: 2px; font-size: 0.86em; padding: 1px 5px;">print("...")</code> prints the string inside quotation marks.</span></span></li>
<li><span style="background-color: white;"><span style="font-family: Arial, Helvetica, sans-serif;"><code style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border-radius: 2px; font-size: 0.86em; padding: 1px 5px;">sqrt()</code> is a method of Math class. It returns square root of a number.</span></span></li>
</ul>
<div>
<pre class="prettyprint prettyprinted" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 1px solid rgb(234, 234, 236); color: #252830; font-size: 15px; line-height: 1.15; margin-bottom: 10px; margin-top: -0.8em; max-height: 600px; overflow: auto; padding: 5px; width: auto; word-spacing: 3px;"><code style="background-color: white;"><span style="font-family: Arial, Helvetica, sans-serif;"><span class="kwd" style="color: darkblue;">public</span><span class="pln" style="color: black;"> </span><span class="kwd" style="color: darkblue;">class</span><span class="pln" style="color: black;"> </span><span class="typ" style="color: #2b91af;">Numbers</span><span class="pln" style="color: black;"> </span><span class="pun" style="color: black;">{</span><span class="pln" style="color: black;">
</span><span class="kwd" style="color: darkblue;">public</span><span class="pln" style="color: black;"> </span><span class="kwd" style="color: darkblue;">static</span><span class="pln" style="color: black;"> </span><span class="kwd" style="color: darkblue;">void</span><span class="pln" style="color: black;"> main</span><span class="pun" style="color: black;">(</span><span class="typ" style="color: #2b91af;">String</span><span class="pun" style="color: black;">...</span><span class="pln" style="color: black;"> args</span><span class="pun" style="color: black;">)</span><span class="pln" style="color: black;"> </span><span class="pun" style="color: black;">{</span><span class="pln" style="color: black;">
</span><span class="typ" style="color: #2b91af;">System</span><span class="pun" style="color: black;">.</span><span class="kwd" style="color: darkblue;">out</span><span class="pun" style="color: black;">.</span><span class="kwd" style="color: darkblue;">print</span><span class="pun" style="color: black;">(</span><span class="str" style="color: maroon;">"Square root of 4 is: "</span><span class="pln" style="color: black;"> </span><span class="pun" style="color: black;">+</span><span class="pln" style="color: black;"> </span><span class="typ" style="color: #2b91af;">Math</span><span class="pun" style="color: black;">.</span><span class="pln" style="color: black;">sqrt</span><span class="pun" style="color: black;">(</span><span class="lit" style="color: maroon;">4</span><span class="pun" style="color: black;">));</span><span class="pln" style="color: black;">
</span><span class="pun" style="color: black;">}</span><span class="pln" style="color: black;">
</span><span class="pun" style="color: black;">}</span></span></code></pre>
<pre class="prettyprint prettyprinted" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 1px solid rgb(234, 234, 236); color: #252830; font-size: 15px; line-height: 1.15; margin-bottom: 10px; margin-top: -0.8em; max-height: 600px; overflow: auto; padding: 5px; width: auto; word-spacing: 3px;"><code><span class="pun" style="background-color: white; color: black;"><span style="font-family: Arial, Helvetica, sans-serif;">
</span></span></code></pre>
<pre class="prettyprint prettyprinted" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 1px solid rgb(234, 234, 236); color: #252830; font-size: 15px; line-height: 1.15; margin-bottom: 10px; margin-top: -0.8em; max-height: 600px; overflow: auto; padding: 5px; width: auto; word-spacing: 3px;"><code><span class="pun" style="background-color: white; color: black;"><span style="font-family: Arial, Helvetica, sans-serif;">
</span></span></code></pre>
<pre class="prettyprint prettyprinted" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 1px solid rgb(234, 234, 236); line-height: 1.15; margin-bottom: 10px; margin-top: -0.8em; max-height: 600px; overflow: auto; padding: 5px; width: auto;"><code><span class="pun" style="background-color: white;"><h2 style="-webkit-font-smoothing: antialiased; color: #252830; font-size: 1.9em; line-height: 1.15; margin: 0.8em 0px 0.45em; white-space: normal; word-spacing: 0px;">
<span style="font-family: Arial, Helvetica, sans-serif;">User-defined Method</span></h2>
<div style="-webkit-font-smoothing: antialiased; color: #252830; font-size: 16px; margin-bottom: 1.4em; white-space: normal; word-spacing: 3px;">
<span style="font-family: Arial, Helvetica, sans-serif;">You can also define methods inside a class as per your wish. Such methods are called user-defined methods.</span></div>
<h3 style="-webkit-font-smoothing: antialiased; color: #252830; font-size: 1.6em; line-height: 1.15; margin: 0.8em 0px 0.35em; white-space: normal; word-spacing: 0px;">
<span style="font-family: Arial, Helvetica, sans-serif;"><a href="https://draft.blogger.com/null" id="create-user-defined" name="create-user-defined" style="-webkit-font-smoothing: antialiased; color: #2b6dad;"></a>How to create a user-defined method?</span></h3>
<div style="-webkit-font-smoothing: antialiased; color: #252830; font-size: 16px; margin-bottom: 1.4em; white-space: normal; word-spacing: 3px;">
<span style="font-family: Arial, Helvetica, sans-serif;">Before you can use (call a method), you need to define it.</span></div>
<div style="-webkit-font-smoothing: antialiased; color: #252830; font-size: 16px; margin-bottom: 1.4em; white-space: normal; word-spacing: 3px;">
<span style="font-family: Arial, Helvetica, sans-serif;">Here is how you define methods in Java.</span></div>
<pre style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border: 1px solid rgb(234, 234, 236); color: #252830; font-size: 15px; margin-bottom: 1.8em; margin-top: -0.8em; overflow: auto; padding: 15px 18.5px; word-spacing: 3px;"><span style="font-family: Arial, Helvetica, sans-serif;">public static void myMethod() {
System.out.println(“My Function called”);
}
</span></pre>
<div style="-webkit-font-smoothing: antialiased; color: #252830; font-size: 16px; margin-bottom: 1.4em; white-space: normal; word-spacing: 3px;">
<span style="font-family: Arial, Helvetica, sans-serif;">Here, a method named <code style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border-radius: 2px; font-size: 0.86em; padding: 1px 5px;">myMethod()</code> is defined.</span></div>
<div style="-webkit-font-smoothing: antialiased; color: #252830; font-size: 16px; margin-bottom: 1.4em; white-space: normal; word-spacing: 3px;">
<span style="font-family: Arial, Helvetica, sans-serif;">You can see three keywords <code style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border-radius: 2px; font-size: 0.86em; padding: 1px 5px;">public</code>, <code style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border-radius: 2px; font-size: 0.86em; padding: 1px 5px;">static</code> and <code style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border-radius: 2px; font-size: 0.86em; padding: 1px 5px;">void</code> before the function name.</span></div>
<ul style="-webkit-font-smoothing: antialiased; margin-bottom: 1.8em;">
<li><span style="color: #252830; font-family: Arial, Helvetica, sans-serif;"><span style="font-size: 16px; white-space: normal; word-spacing: 3px;">Public Keywords My Method () Methodology Public Public Members can be accessed from outside the classroom To know more, visit: Java Public and Private Moderator</span></span></li>
<li style="color: #252830; font-size: 16px; white-space: normal; word-spacing: 3px;"><span style="font-family: Arial, Helvetica, sans-serif;">The <code style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: initial; background-repeat: initial; background-size: initial; border-radius: 2px; font-size: 0.86em; padding: 1px 5px;">static</code> keyword denotes that the method can be accessed without creating the object of the class. To learn more, visit: <i>Static Keyword in Java</i></span></li>
<li><span style="color: #252830; font-family: Arial, Helvetica, sans-serif;"><span style="font-size: 16px; white-space: normal; word-spacing: 3px;">The meaningless keyword means that the method does not return any value. You will learn about returning the value later in this article.</span></span></li>
</ul>
<div>
<span style="color: #252830; font-family: Open Sans, sans-serif;"><span style="font-size: 16px; white-space: normal; word-spacing: 3px;">
</span></span></div>
</span></code></pre>
</div>
</div>
</div>
It E Researchhttp://www.blogger.com/profile/02660842566926994686noreply@blogger.com0