First, the HTML
A set of rules
Learn rules, write HTML files
Multiple HTML files when you write a template
1. Tags
Divided into self-closing, automatic
DOCTYPE declares the document type
Note:<!---->
①<meta charset= "UTF-8" >
<meta http-equiv= "Refresh" content= "" "Url=> #刷新, also can jump
Meta can also define keywords for crawler name= "keywords" content= ""
Used to describe Name= "description" content= ""
<meta http-equiv= "x-ua-compatible" content= "IE=EMULATEIE9; EmulateIE8 ">
Enables HTML to be compatible with high versions
<link><style><script>
Link can specify CSS file path, icon and path <link rel= "shortcut icon" href= "" >rel Specifies whether it is an icon or CSS
②<body>
Special symbols:
Space: Can avoid conflicts with label symbols
<p> paragraph, a line of content, p and P tags have line spacing between, want to wrap, <br>, no spacing, general recommended self-closing <br/>
<span> Inline Labels
Block-level Tags: p,h, comes with features, Div is whiteboard, layout usage is highest, and span is similar
Inline Tags: span (whiteboard) for CSS Landscaping
The existence of tags for JS get value
Chrome: Positioning and viewing styles
<input/>: self-closing, inline type=submit to submit form forms
<form>: Can only get the value of input box inside the tag, other tags cannot get
Three properties:
Method: How to submit
Action: Submit Web page
Enctype: Form data type
<input type= ' Radio ' name= ' Gender '/> name same can only be selected, plus value to distinguish
Default value: checked= "Checked"
<input type= ' checkbox ' name= ' favor ' value= '/> name grouping, value values
<input type= ' file ' name= '/>
<input type= ' reset ' value= '/> Reset
Multiline text and drop-down boxes
<textarea name= ' > Default Write Middle </textarea>
<select name= ' > #size: Box showing size multipe= ' multipe '
<option value= ' ></option> #selected = ' selected ' is selected by default
</select>
Back to Top
<a href= ' ></a> #target = '-blank ' new page open inline
-Jump
-Anchor: href= ' #i2 ' <div id= ' i2 ' ></div> jump to the beginning of the label where the ID repeats when clicked does not jump
#自定义大小, can be wrapped in a tag jump
#alt = "Picture Displays text when loading fails
#title = "Display text when mouse is placed
<ul>
<li>
<ol>
<li>
<dl>
<dt> Layering
<dd> Child Columns
<table border= ' 1 ' >
<tr>
<td>
Formal wording
<table border= ' 1 ' >
<thead>
<tr>
<th>
<tbody>
<tr>
<TD colspan= ' 2 ' > #合并两个单元格, rowspan same
<label for= ' I1 ' > #通过for对input进行关联
<input id= ' I1 '
<fieldset> #包裹框
<legend> Login </legend>
<input>
</fieldset>
Front-end HTML