Home > Developer > Web Develop
What is HTMLThe HTTP protocol in the application layer is responsible for data transfer and parsing.
In the upper socket, when transmitting HTTP data with the socket, it is necessary to declare at the beginning of the message that the HTTP protocol/corresponding HTTP version status code status code means \r\n\r\n The real string content.
Hypertext Markup Language, is a markup language that marks sections of a Web page to be displayed. A set of browser-aware rules.
The browser renders the page code file sequentially, interpreting and displaying the content based on the marker. There may be differences in the label interpretations for different browsers.
Static Web page File extension:. html. htm. js ...
Use tag tags to set the display of the Web page as
<! DOCTYPE html> #让浏览器知道用哪种HTML来解析它. #开头标记, there is a corresponding marker at the end. Tells the browser that it is an HTML document.?
HTML tag format< Tag Name Property 1 = "Property value 1" Property 2 = "Property value 2" ......> content section </tag name >
< Tag Name property = "Property value 1" Property 2 = "Property value 2" .../>
Write with the document before the front,Role: Declares the type of resolution of the document. Avoid the spooky mode of the browser.
Resolving typesIf not written, the default is Backcompat
Provides meta-information about the page, descriptions and keywords for search engine and update frequency.
is located at the head of the document and does not contain any content.
The information provided is not visible to the user
Properties of the META tag
<meta http-equiv="Refresh" content="2;URL=https://www.oldboy.com"> //(注意后面的引号，分别在秒数的前面和网址的后面) <meta http-equiv="content-Type" charset=UTF8"> <meta http-equiv = "X-UA-Compatible" content = "IE=EmulateIE7" />
<title><meta name="keywords" content="meta总结,html meta,meta属性,meta跳转"> <meta name="description" content="培训机构是由一群很人创建的">
Web page Label Signature
<link>Link some pictures to tags, etc.
<script>???
<body>Block-level labelsThe difference between a block-level element and an in-line element is that the so-called block element is the element that begins to render on another line, and the inline element does not need another row. 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.
Paragraph label, with a space between the top and bottom of the line after wrapping
<div>< >；"；©®
Block-level elements, and there is no practical meaning. It is mainly given a different performance by CSS styles.
<span>inline rows (inline elements) have no practical meaning, and are mainly given different performances by CSS styles.
Picture label
<a> </a>src: 要显示图片的路径.alt: 图片没有加载成功时的提示.title: 鼠标悬浮时的提示信息.width: 图片的宽height:图片的高 (宽高两个属性只用一个会自动等比缩放.)
Hyperlink label
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
Note: The URL address is made up of 4 parts
The 1th part: for agreement: HTTP//, ftp://, etc.
Part 2nd: For the site address: can be a domain name or IP address
Part 3rd: Directories for pages in the site: Stu
Part 4: For page names, such as index.html
Each part is separated by a "/" symbol.
List label<a href="" target="_blank" >click</a>href属性指定目标网页地址。该地址可以有几种类型： 绝对 URL - 指向另一个站点（比如 href="http://www.jd.com） 相对 URL - 指当前站点中确切的路径（href="index.htm"） 锚 URL - 指向页面中的锚（href="#top"）
<table><ul>: 无序列表 [type属性：disc(实心圆点)(默认)、circle(空心圆圈)、square(实心方块)]<ol>: 有序列表 <li>:列表中的每一项.<dl> 定义列表 <dt> 列表标题 <dd> 列表项
Basic structureA table is a two-dimensional data space, a table consists of several 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.
<table> <tr> <th> title <th> # first column, Th<th> title <th> </tr> <tr> <td>< Span class= "Zh-hans" > content </td> <td> content </td> </tr></TABLE>
Form Labels <from><tr>: table row<th>: table head cell<td>: table data cell属性: border: 表格边框. cellpadding: 内边距 cellspacing: 外边距. width: 像素 百分比.（最好通过css来设置长宽） rowspan: 单元格竖跨多少行 colspan: 单元格横跨多少列（即合并单元格）
Used to transfer data to the server, enabling users to interact with the Web server
Can include input series tags, such as text fields, checkboxes, radio boxes, submit buttons, and so on.
You can also include labels such as textarea, select, FieldSet, and label.
Form PropertiesHTML forms are a more complex part of HTML elements, and forms are often combined with features such as scripting, dynamic pages, and data processing, so it's important to make dynamic Web sites.
Forms are generally used to collect user input information.
How a form works: When a visitor browses a page with a form, they can fill in the necessary information and then press a button to submit it. This information is transmitted over the Internet to the server.
This data is processed by a specialized program on the server and returns an error message if there is an error and requires that the error be corrected. When the data is complete and correct, the server feeds back an input completion information
Type
type:text text input box Pass Word password input box radio radio box checkbox Multi marquee submit submit button button button ( need to cooperate with js use.) button submission: Form form needs to add attribute Enctype= upload files Note two: 1 request must be post 2 enctype= "Multipart/form-data" Property
NameThe key of the form submission item. Note and IDThe difference between attributes: Nameproperty is the name used when communicating with the server;and the IDproperty is the name used by the browser side, which is primarily designed to facilitate client programming, while the CSSand JavaScriptValue used in:The value of the form submission item.For different input types, the valueThe use of attributes is also different:type="button", "reset", "submit"- defines the displayed text on the button type="text", "password", "hidden" - define the initial value of the input field type="checkbox", "Radio", "image"- defines the value associated with the input Checked:radio and checkbox readonly is selected by default: read-only. Text and passworddisabled: works well for the input used . <textarea> Multi-line text box<select> 下拉选标签属性 name:表单提交项的键. size：选项个数 multiple：multiple <optgroup>为每一项加上分组 <option> 下拉选中的每一项 属性： value:表单提交项的值. selected: selected下拉选默认被选中
<form id= "Form1" name= "Form1" method= "post" action= <textarea cols= "width" rows= "height" name=< Span class= "Zh-hans" > "name" > default content </ Textarea></FORM> Define the:<label> label to define the callout (tag) for the INPUT element.
Description: The 1 Label element does not present any special effects to the user. 2 The For property value of the <label> tag should be the same as the id attribute value of the related element.
<FormMethod="POST"action="" ><label for= " Username "> user name </ label> <input type= "Text" name= "Username" id= "Username" size= "20"/></FORM> The FIELDSET element groups related elements within a form.
<fieldset> tags Package a portion of the form's content to generate a field for a set of related forms.
When a set of form elements is placed inside the <fieldset> tag, the browser displays them in a special way, they may have special boundaries, 3D effects, or even create a sub-form to process the elements.
The <fieldset> tag does not have a required or unique attribute. The <legend> tag defines the caption for the fieldset element.
All of the global properties contained<fieldset> << Span class= "Hljs-name" >legend> login bar </ legend> Enter login information, Bora Bora ... <input type= "text" ></FIELDSET>
Span style= "font-size:18px" > front-end learning site< Span class= "Hljs-name" > < Span class= "Hljs-tag" > recommended：https://developer.mozilla.org/en-US/
Front-end--1, HTML basics
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
