Home > Developer > JavaScript
HTML/CSS from scratch-html basics (1), css-html
I. web standard 1.1 Structure
(1) extended Hypertext Markup language (xhtml)
(2) W3C (world wide web consortium)
A. the structure (xhtml, xml), presentation (css), and standards are developed.
(1) css (cascading style Sheet) stacked style sheets
1.3 actions(1) ECMA (Europan Computer Manufactures Association) European Computer field Commerce Federation
A. Developed the Document Object Model (DOM) Text Object Model.
B. ECMAscript standards
<! Doctype html>
<Html>
<Head>
<Meta charest = "UTF-8"> <! -- Encoding format -->
<Title> </title>
</Head>
<Body>
<H1> .
.
.
<H6> <P> </p> <! -- Paragraph -->
</Body>
</Html>
<Tag attribute 1 = "attribute value 1" attribute 2 = "attribute value 2"> </Tag>
As follows:
<Strong> </strong> <B> </B> <! -- Bold -->
<Em> </em> <I> </I> <! -- Tilt -->
<Tag attribute = "property value"/>
As follows:
<Hr/> <! -- Horizontal line -->
<Br/> <! -- Line feed -->
<! -- Insert an image -->
& Nbsp; space
4.1 List
A. ordered list
<Ol> ordered
<Li> </li>
<Li> </li>
<Li> </li>
</Ol>
B. unordered list
<Ul> unordered
<Li> </li>
<Li> </li>
<Li> </li>
</Ul>
C. Custom list
<Dl> definition list
<Dt> interpreted </dt>
<Dd> description </dd> definition description
</Dl>
Note: The dd can be repeated, but only one dt is allowed;
In the ordered list, the parameter tyle = "A", start = "3", // the first sequence starts from C.
<A href = "path address" target = "_ blank"> </a>
The path is divided into: absolute path (https // www.baidu.com), relative path such as (images/inder.html ).
The default target attribute value is _ self; _ blank indicates that a new window is opened.
<Div> </div>
Note: a. Automatic line feed between blocks
B. If the div block is limited to width and height and the content is Chinese, the new line is automatically wrapped. If it is English, it will overflow.
<Span> </span>
Note: line breaks are not provided between blocks a and span, and the width and height cannot be limited. The length varies with the length of the text.
1. Syntax: <table width = "" height = "" border = "1 (table box pixel)" bordercolor = "table box color" cellspacing = "0 (cell spacing) "cellpadding =" the content is pixel away from the Left Border ">
2. description; when the cellpadding attribute is used in the table to set the width and height, if the given width exceeds the configured width and height, the table will be opened.
<Tr>
<Th>
<Th> <! -- Th header becomes thick -->
<Th>
</Tr>
<Tr>
<Td>
<Td> <! -- Td cell, tr row -->
<Td>
</Tr>
3. Cell merging attributes
Colspan merge Columns
Rowspan merge rows
Syntax: rowspan = "3" // merge three rows
4. Form
A. Form box
Syntax: <form name = "form name" method = "post/get" action = ""> </form>
Note:
B. Text Box
<Input type = "text" value = "Default value"/>
C. Password box
<Input type = "password" placeholder = "prompt message"/>
D. Single region
<Input type = "radio" name = "custom name (consistent, required)"/>
As follows:
<Input type = "radio" name = "sex" value = "male"/> male
<Input type = "radio" name = "sex" value = "female"/> female
E. Multi-choice box
<P> mate selection criteria </p>
<Input type = "checkbox" name = "boy" value = "185"/> 185
<Input type = "checkbox" name = "boy" value = ""/> black
<Input type = "checkbox" name = "boy" value = "male"/> male
<Input type = "chechbox" name = "boy" value = "Northeast"/> Northeast China
Disabled = "disabled" (disabled or disabled)
Checked = "checked" (selected by default)
F. Reset
(1) <input type = "reset" value = "default"/> (reset, clear the data filled in above)
G. Button
(1) <input type = "button" value = "Only jump, not submit"/>
(2) <input type = "submit" value = "both jump and submit"/>
Note: When a button is used as a tag, both the <button> button </button> jump and submit
H. drop-down list
(1) <select name = "">
<Option> </option>
<Option> </option>
</Select>
I. text fields
<Textarea cols = "width" rows = "number of rows" name = "">
</Textarea>
Note:
(1) Place the preceding text box in form;
(2) What is the difference between the post/get attribute value of the method attribute in form?
A. get is used to obtain data from the server, and post is used to transmit data to the server;
B. get is to add the parameter value to the URL specified by the Action attribute of the submitted form. The value corresponds to each field in the form one by one. You can see it in the URL,
Post uses HTTP. The post Mechanism places the fields in the form and their content in the html header and sends them to the URL address of the ACTION attribute. You cannot see this process.
C. For the get method, the server-side ReqestQueryString obtains the value of the variable. For the post method, the server uses Request. Form to obtain the submitted data.
D. The size of get data transmission is not greater than 2 kb, and the size of post data is large, which is generally unrestricted.
F. Low get security, high post security, but high transmission efficiency
(3) usage of value in input
A. type = "button"/"reset"/"submit"; indicates the text on the button.
B. type = "text"/"password"; indicates the initial value.
C. type = "check"/"radio" definition and input values
(4) form nesting
<Table>
<Form>
<Tr>
<Td> <input type = "text" placeholder = "Enter the user name"> </td>
<Td> <input type = "password" placeholder = "enter the password"> </td>
</Tr>
<Tr>
<Td> <input type = "button" value = "forgot password? "> </Td>
<Td> <button> log on </button> </td>
</Tr>
</Form>
</Table>
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
