Static web Development
Chapter HTML (Hyper Text Markup Language)
1 knots
Getting Started with HTML
Html
Hypertext Markup Language
Interpreted by the browser execution
A hypertext document written by a developer is a Web page
Xhtml
HTML upgrade to XML over product
Fully compatible with HTML4.01
and has the syntax of XML
Case insensitive
The first part is to add some auxiliary or attribute information to the HTML page, the contents of it will be loaded first, and the body part is the place where the data is actually stored.
<meta http-equiv= "Content-type" content= "Text/html;charset=utf-8" >//which encoding set is used in this document Utf-8
<font color= "Red" size= "2" > can see me. </font>//do not specify the encoding, garbled; label is case insensitive
You can use a professional HTML compiler to compile HTML:
Adobe Dreamweaver
Microsoft Expression Web
CoffeeCup HTML Editor
For beginners, it is recommended to use a text compiler to learn HTML
editplus,notepad++
2 knots
Font labels
<title></title>
<font color= "Red" sixe= "+2" face= "Microsoft Ya Black" ></font>//size can not specify size, only +-;face to specify the font style; font is deprecated, all using CSS
Title label
...
Special characters
<<
>>
spaces
" "
®®
™™
&&
©©
Common single Tag tags:<br/>//show they need to be transferred
Common double Tag Tags:<front></front>
3 knots
List label
Disc:css1 the default value. Solid Circle
Circle:css1 Hollow Circle
SQUARE:CSS1 Solid Block
Decimal:css1 Arabic numerals
Lower-roman:css1 Lowercase Roman Numerals
Upper-roman:css1 Capital Roman Numerals
Lower-alpha:css1 lowercase English alphabet
Upper-alpha:css1 Capital English alphabet//UL attribute has three values, used to specify the list of symbols, not in favor of using
Unordered list
<ul style= "List-style-type:disc" >
<li> First </li><li> second </li><li> third </li>
</ul>
Ordered list
<ol style= "List-style-type:upper-alpha" >
<li> </li><li> two </li><li> three </li><li> four </li>
</ol>
Defining lists (definition list)
<dl>
<dt> Games </dt>//definition Table
<dd> through FireWire </dd>//description description
<dd>lol</dd>
<dt> Department </dt>
...
</dl>
4 knots
Image label
Boder= "3px"//Border
Title= "mouse pointer to the prompt text"
Alt= "Show prompt when not shown"//different browser version may not be prompted, not more than 1024 characters
Width= "200px"
height= "300px"
/>
5 knots
Table Label--------------------------------------------------------------------------------------------------------------------- ---------(*)
Used to format data
Cellspacing= the distance between the "0px" cell and the adjacent cell; collapse; cellpadding the distance between the cell contents and the border
<table border width= "100%" cellpadding= "5px" cellspacing= "0px" style= "Border-collapse:collapse" >
<caption> title </caption>
<thead>
<tr>
<th> number </th><th> name </th><th> age </th>
</tr>
</thead>
<tbody>//multiple tbody tags, can control the loading of data locally, reduce waiting time
...
</tbody>
<tfoot>//and Tbody are the same, add a line at the end of the table
</tfoot>
<tr>
<td> number </td><td> name </td><td> age </td>
</tr>
...
</table>
<td> Common Properties
Colspan>rowspan---merged cells
6 knots
Hyperlinks (HyperLink)
<a href= "http://www.rupeng.com" target= "_blank" > such as Peng </a>
Target: Specifies the window in which to open, with 4 values
_blank open a link in a newly opened blank window window
_parent: Open in parent window
_self: Open in own page (default)
_top: Open at the top (front) of the entire browser
Static web development HTML