Embedded Html Template

Document Sample
Embedded Html Template Powered By Docstoc
					Web Page Template (Outline)
<html>
<head>
        <title></title>

         <style type="text/css">
                Embedded styles:
                                selector     {    property:value;       property:value;}
                                e.g.      h1 { background-color:#ff0000; font-family:Arial; }
                                Note: Selectors can be any ta g such as h1-h6, body, form, etc,
                   Class:
                                .className       { property:value; etc }
                            Note the period before the class name
                   Contextual Selector:
                                #id_name {       property:value; etc }
                                e.g. #footer { background-color:#ff0000; font-size:70%; }
                                Note the # before the contextual selector na me
         </style>

       <script type="text/javascript">
              function doSomething()
              {
                     var name, age;
                     name = document.formName.elementName.value;
              }
       </script>
</head>
<body>
<div id=”header”>
       Welcome!!! <img src=”somePic.jpg” alt=”company logo of turtle” />
</div>
<div id=”maincontent”>
       blah de blah blah blah
</div>
</body>
</html>


CSS:
- Change a font:                       font-family:value;
                                       Some font types/values : serif, sans-serif, cursi ve, monospace, Arial, etc
- Change a foreground color:           color:value;
- Change a ba ckground color:          background-color:value;
- Li nk tag (external sheet)          <link rel=”stylesheet” type=”text/css” href=”filename.css” />
-

Javascript:
-   To retrieve a value from a form:             document.formName.elementName.value;
-   To convert a va riable to an integer:        someVariable = parseInt(someVariable);
-   To convert a va riable to a floa t:          someVariable = parseFloat(someVariable);
-   Ma th.sqrt(number)  returns the squre root of ‘number’
                 o e.g:          alert( Math.sqrt(25) );
                 o e.g:          var number = Math.sqrt(25);
-   Da te()  returns the da te and time
                 o e.g:          alert( Date()       );
                 o e.g:          document.write(“Today is: “ + Date() );
-   If-else:
          if ( va riable == 3 )
          {
                       alert("You entered a 3");
         }
         else i f (va riable > 3)
         {
                      alert("Your number is more than 3.");
         }
         else
         {
                      alert("Your number is less than 3.");
         }


XHTML:
Form ta g:         <form name="nameOfForm">
Textfield:         <input type="text" name="txtName" />
Button:            <input type="button" value="Button Text" onclick="nameOfFunction()" />
Image:             <img src="fileName" alt="alt text" />

Hex Codes for a few common col ors :
- Red:             #ff0000
- Green:           #008000
- Blue:            #0000ff
- Yellow:          #ffff00
e.g. background-color:#ffff00;

Di v ta g: <div id=”id_name”>
Commonl y used names for di v sections : header, maincontent, footer, tableofcontents

				
DOCUMENT INFO
Shared By:
Categories:
Stats:
views:4
posted:11/14/2010
language:English
pages:2
Description: Embedded Html Template document sample