Simple understanding of Web source (HTML source code)

Source: Internet
Author: User

No matter what program programmers do, basic will touch HTML, if you do Web development This is the guy who eats, mobile app has not learned HTML does not matter, but to a glance can understand the source code of the Web page, have the opportunity to learn the best in person HTML5, the most self-improvement or helpful

HTML, hyper-text markup language. Simply understand that certain words are added to the language of the logo to achieve the desired specific effect. The Web page is written by this HTML language. As a set of markup language, basically as long as understand the use of various tags, even learn html

The syntax format of HTML is divided into nested and non-nested two classes, nested in the form of "tags" ... , non-nesting is only labeled. In addition, depending on the tag, some tags come with attribute parameters, which are denoted by the tag attribute = "parameter value", which can be added or removed according to the individual needs of the corresponding attribute tag

       . Basic framework

Like a fan, the Web page also includes "head" and "body", which is the marker symbol.

The tag contains basic information such as the title of the page, the language code, the description of the Web page, and the content of the page that we actually see is placed within the tag. Now let's introduce the basic information in .

Page title (tag format )

Create page title text: title //The text written here is displayed in the title bar of IE.

Web page Document information (tag format )

Description page Content type: //This page is txt text or HTML format, the language encoding method is GB2312 (that is, Simplified Chinese).

Keyword information describing a webpage:

Detailed description of the webpage:
Refresh page: //5 seconds after refreshing and linking to xxx.html

Ii. Elements of Composition

No matter how the Web page is ever changing, the most basic elements that make up a Web page are roughly five types, namely text, pictures, tables, hyperlinks, and form controls, so here's a list of the five elements.

Text (tag format <font> </font>)

Specify text font: <font face= "song body" > Arial text </font>

Specify text size: <font size= "3" > 3rd text </font>

Specify text color: <font color= "#FF0000" > red text </font>//page color is 16-bit encoded, so #ff0000 is shown in red. You can check the relevant information to learn about other color coding.

Picture (tag format )

//src specified as the path address, Width is wide, height is altitude, border is border size, align is horizontal position.

Table (tag format <table> <tr> <td> </td> </tr> </table>)

<table width= "height=" border= "1" align= "center" cellpadding= "2" cellspacing= "2" bgcolor= "#FF0000" > <tr> <td> here to add text or pictures, etc. </td> </tr> </table>/width, height, border, align as in the above example, cellpadding is the spacing between the border and the cell. CellSpacing is the spacing between cells, bgcolor is the table background color.

The above-mentioned elements are only present in the current page, and the appearance of web hyperlinks greatly changed people's browsing habits, according to their preferences, click to the relevant links to view the page information.

Hyperlinks (tagged format <a> </a>)

<a Href= "xxx.htm" title= "hint text" > link text or picture </a>//href is the linked page after being clicked, title is the hint text that appears after the mouse hovers over the linked text or picture.

form controls (marker symbols are <input>, <textarea> </textarea>, <select> </select>)

Form control to achieve the interaction between people and the Web page, like we often go to the forum, shopping sites, etc. have its "figure."

Text box: <input type= "text" value= "This is the text box" >//value is the value of the control, each of the following form controls can be set, no default is empty

Password box: <input type= "Password" >

Radio Box: <input type= "Radio" >

check box: <input type= "Check" >

Submit button: <input type= "Submit"

Reset button: <input type= "reset" >

Hidden area: <input type= "hidden" >

Text field: <textarea rows= "6" cols= "" "> </textarea>//rows is the number of rows, cols is width

List box: <select> <option> Project 1 <option> Project 2 <option> Project 3 </select>

, view HTML page source code can understand the content of the Web page, structure, according to our own needs of the data in the page changes, filtering, typesetting. So it is good to learn a language, to learn the old.


Simple understanding of Web source (HTML source code)

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.