Skip to main content

HTML DISCUSSION


*  HTML refers to Hyper Text Markup Language.HTML is used as a front design languages in web development.Basically HTML is used for structured the web page of a web site.At the same time it is a basic language for all web development languages.
*  When we designed our task in Html we wrote the coding in text editor.To observe the output of the task it should be saved with file extension (.html/.htm)
*  Html consist of tags and attributes
*  Html is not case sensitive like Java but it mostly sense to tags opening,value and name.Some tags are self closing tags and some are non self closing tags.


Here we can see a normal basic web page code with basic tags in HTML5.
<!DOCTYPE html>
<html>
<head>
<title>Introduction</title>
</head>
<body>
<h1>elements</h1>
<p>tags are used to structure the web page</p>
</body>
</html>


Html consist of opening tag and closing tag.Main difference between them is closing tag end with /.
Let us know about the facilities which are available in the html and their tags and also we can see the open tag and close tag
<html></html> It is a root to create a webpage.
<head></head> It is mainly not for user.not displayed for the client.
<body></body> It is used to express to the user.Most of the tags are under this body tag.
<h1></h1>     It is used to express the heading.h1 refers to largest font size but up to h6 can be used to create headings.
<p></p>       It is used to create a paragraph in the page.


1) Html image tag
<img> To insert a image in webpage this tag is used.It does not have closing tag.
<alt> It is used to express the alternative text for image.It is very useful to users when the absence of image.
                 Eg:   <img src="wrongname.gif" alt="Flowers in Chania">
2)Html table tag
<table></table> To insert a table to the webpage
<tr></tr>       To insert a row   
<th></th>       To insert a table header
<td></td>       To insert a table data.
3)Html colors
    Html colors are used to insert the color.We can't implement the whole task of a web page only using html colors. but basic coloration can be  done.To insert the color we can use various method.
  i)rgb color
  ii)hex value
  iii)hsl value
 iv)rgba hsla value
4)Html links
   Html links are used to linked a new document.When we linked something there is a hyperlink mark will be seen.
  <a href="html_images.asp">HTML Images</a>
 <a href="https://www.w3schools.com/" target="_blank">Visit W3Schools!</a>
5)Html lists
   To lists the content in both bullets and numbering here we used diiferent tags.
   i)Unordered list                           
    <ul>                       
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ul>
output as follows
  • Coffee
  • Tea
  • Milk 
 ii)Ordered list
<ol>
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ol>
output as follows
  1. Coffee
  2. Tea
  3. Milk 
6)Html classes
 Html class is used to style the specific certain element.We call certain class for every element.Stylei it the style tag.
   <style>
.city {
    background-color: tomato;
    color: white;
    padding: 10px;
} 
</style>

<h2 class="city">London</h2>7)Html id
 Id specifies the unique html element
  <style>
#myHeader {
  background-color: lightblue;
  color: black;
  padding: 40px;
  text-align: center;
} 
</style>

<h1 id="myHeader">My Header</h1>8)Html iframe
 Iframe is used to display the webpage within a webpage.
<iframe src="demo_iframe.htm" style="height:200px;width:300px;"></iframe>
9)Html forms
   It is very important in the web page. We can input radio,checkbox and submit etc.
<form>
  <input type="radio" name="gender" value="male" checked> Male<br>
  <input type="radio" name="gender" value="female"> Female<br>
  <input type="radio" name="gender" value="other"> Other
</form>
output as follows

 Male
 Female
 Other


<form action="/action_page.php">
  <fieldset>
    <legend>Personal information:</legend>
    First name:<br>
    <input type="text" name="firstname" value="Mickey"><br>
    Last name:<br>
    <input type="text" name="lastname" value="Mouse"><br><br>
    <input type="submit" value="Submit">
  </fieldset>
</form>

First name:
 
Last name:
 


10)Html tables
It is used to create a table in the web page.But as colors full align of tables cannot be done only using html.
<table width=100%>
  <tr>
    <th>Firstname</th>
    <th>Lastname</th> 
    <th>Age</th>
  </tr>
  <tr>
    <td>Jill</td>
    <td>Smith</td> 
    <td>50</td>
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td> 
    <td>94</td>
  </tr>
</table>








Comments

Popular posts from this blog

ER Diagram

ER is a high level conceptual data base diagram.ER modeling helps us to create well designed data base with systematic analyzement. Thats why it is very important to practice er diagram before create a database. Actually ER Diagram explains the logical structure of database.Even though ER diagram is similar to the flowchart it become unique because of its symbols and conceptual based exposes.

Node.js MongoDB

Now a days all web based application has some database to store the data at the back end. Nodejs frame work have the ability to work with both relational and non relational database. Node.js  MongoDB   NoSQL database mongodb quite fame because of its ability to store the any sort of data at any format.In order work we have to download required module.Mongodb required the module to be installed is mongoose.And also with these modules we can perform many operations.Before that we have to get start mongodb in nodejs. 1.Install MongoDB Driver * We can download from official mongodb driver or open in terminal and execute it     npm install mongodb * Node.js used this module to manipulate mongodb database.   var  mongo = require( 'mongodb' ); 2.Node.js  MongoDB  Create Database To create a database: 1.Create the Mongoclient object 2.Specify the url connection (correct ip address and name of the database want...

GIT HUB

Git hub is a web based hosting service for version control using git.Git hub is a project based management system.It is a good platform for the developers.Git hub is a SCM(Source Code Management. Now we can go through the git hub installing and coding. 1) Installing a git hub in a Linux (in Linux all coding are followed in terminal)         sudo apt-get install git 2)Configuring git hub    When we completed our installing after that we should have to configure our account as follows          get config -- global user.name "user name"           get config -- global user.email "email id"   once we configured our account no need to configure each time. Mainly seven steps are available to push the files in to git hub 1)git<>init 2)git<>add<>./* 3)git<>status 4)git<>commit<>-m<>detail 5)git<>remote<>add<>origin...