Examples of getting started with HTML and getting started with HTML
Three methods of page layout:
A. TABLE layout: outdated
B. DIV + CSS: current mainstream
C. HTML5 layout labels: future trends
1. Student renewal Table Design
Note:
<Body>
<Table height = "250px" width = "600" border = "1" align = "center" cellpadding = "10" rules = "all">
<Caption align = "top"> grade Score Table </caption>
<Tr bgcolor = "# ccc" align = "center" valign = "center">
<Th> class </th>
<Th> name </th>
<Th> age </th>
<Th> score </th>
2. Simple webpage Layout
3. Simple Web Framework
Note: main framework
<! DOCTYPE>
<Html>
<Head>
<Title> HTML framework </title>
<Meta charset = "UTF-8">
</Head>
<Frameset rows = "90, *, 90" frameborder = "1" border = "1">
<Frame name = "top" frameborder = "1" src = "top.html"/>
<Frameset cols = "20%, 80%">
<Frame name = "left" src = "left.html"/>
<Frame name = "right" src = "right.html"/>
</Frameset>
<Frame name = "bottom" src = "bottom.html"/>
</Frameset>
</Html>
4. Form Design
Program:
<Form>
Account: <input type = "text" name = "name" value = "Enter the user name" size = "10" maxlength = "5">
<Br>
<Br>
Password: <input type = "password" name = "password" size = "5">
<Br>
<Br>
Hobbies: <input type = "checkbox" name = "tiyu" checked = "checked"> sports <input type = "checkbox" name = "changge" check = "checked"> singing
<Br>
<Br>
Gender: <input type = "radio" name = "sex" checked = "checked"> male <input type = "radio" name = "sex" checked = "checked"> female
<Br>
<Br>
Self-introduction: <br>
<Textarea cols = "35" rows = "10" name = "ziwojieshao">
Here is self-introduction
</Textarea>
<Br>
Address:
<Select name = "dizhi">
<Option> Sichuan </option>
<Option> Beijing </option>
<Option> Shanghai </option>
<Input type = "submit" value = "submit">
<Input type = "reset" value = "reset">
<Input type = "button" value = "button">
</Form>