I. HTML FIRST knowledge
1.web Service Essence
ImportSocketdefMain (): Sock=Socket.socket (socket.af_inet, socket. Sock_stream) Sock.bind (('localhost', 8081)) Sock.listen (5) whileTrue:Print("server is working .....") conn, address=sock.accept () Request= CONN.RECV (1024) Conn.sendall (bytes ("http/1.1 201 Ok\r\n\r\n","UTF8") ) Conn.close ()if __name__=='__main__': Main ()
View Code
What is 2.html?
- The Hypertext Markup Language (hypertext Markup language,html) marks individual parts of the page to be displayed in a label language . A set of rules, a browser-aware rule
- The browser renders the Web page file sequentially, and then interprets and displays the content based on the marker. However, it is important to note that for different browsers, the same label may not have the exact same interpretation (compatibility)
- Static Web page File extension:. html or. htm
3.html is not what?
HTML is not a programming language, but a markup language (markup language)
HTML uses tag tags to describe web pages
4.html structure
5.html label Format
Syntax for Tags:
< Tag Name Property 1 = "Property value 1" Property 2 = "Property value 2" ......> content section </tag name >
< Tag Name Property 1 = "Property value 1" Property 2 = "Property value 2" .../>
Two. Common tags
<! Doctype> label
<! The doctype> declaration is positioned at the front of the document, before the
Function: Declares the parsing type (document.compatmode) of the document, avoiding the bizarre mode of the browser.
commonly used tags in
<meta> tags
The <meta> element provides meta-information about the page (meta-information), a description of the search engine and the frequency of updates, and keywords.
The <meta> tag is located in the header of the document and does not contain any content.
The information provided by <meta> is not visible to the user
commonly used tags in <body>Basic Tags (
block-level labels and inline tags )
" " " "
<div> and <span>
<div></div>: <div> is just a block-level element that has no practical meaning. It is mainly given a different performance by CSS styles.
<span></span>: <span> represents inline rows (inline elements) and has no practical meaning, and is mainly given a different representation by CSS styles.
The difference between a block-level element and an in-line element
The so-called block element is the element that begins to render on another line, and the inline element does not need another line. If you insert these two elements separately in a Web page, you will not have any effect on the page.
These two elements are specifically designed to define a CSS style.
graphic Tags:
" " src: The path of the picture to be displayed. alt: The picture does not prompt when it is loaded successfully. Title: Tip Information when hovering the mouse. Width: The height of the picture: high (width height two attributes only one will be automatically scaled.) " "
hyperlink tag (anchor tag): <a> </a>
What is a hyperlink? A hyperlink is a link from a Web page to a target, which can be another page, a different location on the same page, a picture, an e-mail address, a file, or even an application.
What is a URL? The URL is the abbreviation for the Uniform Resource Locator (Uniform Resource Locator), also known as the Web address, which is the address of the standard resource on the Internet. URL example http://www.sohu.com/stu/intro.htmlhttp://222.172.123.33/stu/ Intro.htmlurl address consists of 4 parts 1th: For the Protocol: http://, ftp://, etc. 2nd: For the site address: can be a domain name or IP address 3rd: For the page in the Site Directory: Stu Part 4: For the page name, for example Index.html each partis separated by a "/" symbol.
URL
" " <a href= "" target= "_blank" >click</a>href property specifies the destination page address. The address can have several types: absolute URL-point to another site (such as href= "http://www.jd.com) relative URL-refers to the exact path in the current site (href=" index.htm ") anchor URL- Point to the anchor in the page (href= "#top")
List Label
" " <ul>: Unordered list [type attribute: disc (solid dot) (default), Circle (Hollow Circle), Square (solid square)]<ol>: Sequence table <li>: Each item in the list. <dl> Define list <dt> list title <dd> list item '
Table Tags: <table>
Table Concept table is a two-dimensional data space, a table consists of a number of rows, a row and a number of cells, cells can contain text, lists, patterns, forms, digital symbols, preset text and other tables and other content. The most important purpose of the table is to display the table class data. Tabular data refers to data that best fits into a tabular format, which is organized by rows and columns. The basic structure of the table:
<table> <tr> <td> title </td> <td> title </td> </tr> <tr> <td> content </td> <td> content </td> </tr></table>
" " <tr>: Table row<th>: Table head cell<td>: Table Data cell property: border: Table border. cellpadding: Inner margin cellspacing: margin. Width: Percentage of pixels. (preferably with CSS to set the length and width) rowspan: How many rows the cell spans vertically colspan: how many columns (i.e. merged cells) the cells span
Practice:
1<! DOCTYPE html>2"en">34<meta charset="UTF-8">5<title> Recipes </title>67<body>8 9 Ten<table border="1px"cellpadding="10px"cellspacing="0px"style="Border-color:blue"> One<tr> A<th colspan="5"> Monday Recipes </th> -</tr> - the<tr> -<TD rowspan="2"> Vegetarian </td> -<TD colspan="2"> Grass Eggplant </td> -<td> shallot Tofu </td> + -</tr> +<tr> A<TD colspan="2"> Pepper Lentils </td> at<td> Fried Chinese Cabbage </td> -</tr> - -<tr> -<TD rowspan="2"> Meat Dishes </td> -<TD colspan="2"> Braised prawns with oil </td> in<TD > Pork </td> -</tr> to +<tr> -<TD colspan="2"><a href="curriculum. HTML">"2.jpg"alt=""> Sea cucumber shark fin </a></td> the<td> Roasted Whole sheep </td> *</tr> $ Panax Notoginseng</table> - the + A</body> theRecipes<! DOCTYPE html>"en">"UTF-8"> <title> Timetable </title>"1px"cellpadding="Ten"cellspacing="3"style="border-color:red"><tr> curriculum </tr><tr> <td> projects </td> <TD colspan="5"align="Center"> Classes </td> <td colspan="2"align="Center"> Rest </td></tr><tr> <td> week </td> <td> Monday </td> <td> Tuesday </td> <td> Wednesday </td> <td> Thursday </td> <td> Friday </td> <td> Saturday </td> <td& gt; Sunday </td></tr><tr> <TD rowspan="4"> Morning </td> <td> language </td> <td> math </td> <td> English </td> <td> English </td& Gt <td> Physics </td> <td> computers </td> <td rowspan="4"> Rest </td></tr><tr> <td> math </td> <td> Math </td> <td> Geography </td> <td> history </td> <td> chemistry </td> <td> computer </td></tr><tr> <td> Chemical </ Td> <td> languages </td> <td> Sports </td> <td> computers </td> <td> English </td> < ;td> computer </td></tr><tr> <td> politics </td> <td> English </td> <td> sports </td> ; <td> history </td> <td> Geography </td> <td> computer </td></tr><tr> <td rowspan="2"> PM </td> <td> languages </td> <td> math </td> <td> English </td> <td> English </td& Gt <td> Physics </td> <td> computers </td> <td rowspan="2"> Rest </td></tr><tr> <td> math </td> <td> Math </td> <td> Geography </td> <td> history </td> <td> chemistry </td> <td> Computers </td></tr></table></body> TimetableHTML first Knowledge (DAY46)