Search This Blog

09 January 2018

Basic HTML Elements



                   HTML  HYPER TEXT MARKUP LANGUAGE
       
What is HTML?

        HTML is a Standard Markup Language  used to Creating  webpage and webapplication.HTML was created by Berners-Lee  in 1991 . The Standard HTML was Published  by  1995


Advantage of  HTML?

        Easy to use and Learn

       Support all Browser

       Any One Can Edit

   Fast to Download

Basic Syntax:

<html>

<title>HTML</title>>

</head>

</head>






HTML TAGS AND  DESCRIPTION
Document OutLine:
<!Doctype>  Version of html
<html>   HTML document
<head>  Page information
<body>  page contents
<title>   page Title


Comments:
<!--  Comment text-->





Lists:
<ol>   Orderd List
<ul>   Unorderd list
<li>  List Item
<dl> Definition List
<dt>  Definition Term
<dd> Term Description
Objects:
<objects>  Object
<param/>   Parameter
Page Information:
<base>   base url
<meta>  Meta data
<title> title
<limk> Relevant Resources
<style> Style Resources
<script> Script Resources
Texts:
<p> - Paragraph
<span> --> text content
<label>  --> text the body content or else
<pre> --> 
Forms: 
<form>Form
<Fieldset> Collection of fields
<legend> form legend
<label> input label
<input> form  input
<select> drop down
<optiongroup> group of options
<textarea> large text input
<button> button

Tables:
<table>ètable
<caption>ècaption
<thead>èTable header
<tbody>ètable body
<tfoot>ètable footer
<colgroup> columngroup
<col> column
<tr> table row
<th> header cell
<td> table cell

Empty Elements:
<area>
<base>
<br>
<hr>
<img>
<input>
<link>

Content Editable Attribute and Add the placeholder Attribute For Text Elements like span,label,div,p:

.fname[contentEditable][placeholder]:empty::before{
  content: attr(placeholder);
  color: #38a7e4;
}


[contentEditable][placeholder]:empty::before{
  content: attr(placeholder);
  color:gray;
}
[contentEditable][placeholder]:focus::before{
opacity: .2;
cursor: text;
}

 @media print {

    body {

      font-size: 10pt;

    }

    a[href]:after {

      content: none !important;

    }

    .pagebreak {

      page-break-before: always;

    }

    .background-card h4:not(:first-child) {

      margin-top: 0 !important;

    }

    .card {

      border: 0;

      padding: 0;

    }

    .container {

      max-width: 100%;

      width: 100%;

    }

    .contact-details .detail .icon {

      color: #888 !important;

    }

    .background-card h4 {

      padding-bottom: 0.5em;

      margin-bottom: 0.5em;

      margin-top: 1em !important;

    }

    h4 > .fa {

      display: none !important;

    }

    .card-nested {

      padding: .5rem 0 .5rem 0;

    }

    .labels {

      display: inline;

    }

    .skill-info {

      margin-left: 0;

    }

    blockquote {

      font-size: 100%;

    }

  }









No comments:

Post a Comment

Jquery or Javascript Start Exam Time

 <script> function startTimer() {      var date = "<?php echo $date ?>"; // dynamic date      var time = "<?...