41.python Full stack path: HTML

Source: Internet
Author: User
Tags closing tag

HTMLWhat is HTML?

Htyper Text Markup Language is Hypertext Markup language

Hypertext: Refers to the page can contain pictures, links, and even music, programs and other non-text elements.

Markup Language: The language in which tags (tags) are composed.

Web page ==html document, parsed by the browser, used to show the

Static Web pages: Static resources, such as xxx.html

Dynamic Web pages: HTML code is dynamically generated by a development language based on user requests

What is a label:
    1. is made up of a pair of bracketed words. For example:
    2. Labels are case-insensitive .
    3. The label is divided into two parts: start tag <a> and end tag </a>. The part between the two tags we call the label body.
    4. Some labeling functions are simple. Use a label. This label is called a self-closing tag. For example: <br/>
    5. tags can be nested. But cannot cross-nest. <a><b></a></b>

Properties of the label:
    1. Usually occurs as a key-value pair. Like Name= "Alex."
    2. Attributes can only be present in the start tag or in the self-closing and label.
    3. Attribute names are all lowercase. * Attribute values must be wrapped in double or single quotes such as name= "Alex"
    4. If the property value is exactly the same as the property name. Write the property name directly. e.g. ReadOnly

<! DOCTYPE html> Label

Defines a document type that tells the browser what HTML specification to use to interpret the document

   

Head Tag
    • <meta>meta Tags: Meta tags have two properties, respectively, they are the Http-equiv property and the Name property, and different attributes have different parameter values, these different parameter values to achieve a different page function.

The 1.name attribute is mainly used to describe the Web page, and its corresponding property value is content,content content is mainly convenient for search engine robot to find information and classify information.

<meta name= "keywords" content= "meta Summary, HTML Meta,meta properties, meta jump" >

<meta name= "description" content= "Old boy training institution was created by an old boy" >

2.http-equiv, as the name implies, is equivalent to the HTTP file header function, it can send back some useful information to the browser to help correctly and accurately display the content of the Web page, with the corresponding property value for content, the contents of the text is actually the variable value of each parameter.

<meta http-equiv= "Refresh" content= "2; Url=https://www.baidu.com ">//(Note the following quotes, respectively, before the number of seconds and after the URL)

<meta http-equiv= "Content-type" content= "Text/html;charset=utf8" >

<meta http-equiv= "x-ua-compatible" content= "ie=edge,chrome=1" >

    • <title> old boy </title>
    • <link rel= "icon" href= "Http://www.jd.com/favicon.ico" > logo icon

Body Tag   Basic Tags:

<P>: paragraph label. The contents of the package are wrapped. And there is a blank line between the contents.

<b> <strong>: Bold label.

<strike>: Add a median line to the text.

<em>: Text becomes italic.

<sup> and <SUB>: Upper corner and lower corner table.

<br>: line break.

<div><span>

    Block-level labels and inline tags:

Block-level label:<p>

Inline Tags: <a><input><sub><sup><textarea><span>

Features of block (blocks) elements
① always start on a new line;
② height, row height, margin and inner margin can be controlled;
The ③ width defaults to 100% of its container unless a width is set.
④ it can accommodate inline elements and other block elements

Features of the inline element
① and other elements are on one line;
The ② is high, the row height and the margin and the inner margin cannot be changed;
The width of the ③ is the width of its text or picture, and cannot be changed.
④ inline elements can only hold text or other inline elements

For inline elements, be aware of the following
Setting width is not valid.
Setting height is invalid and can be set by Line-height.
Setting margin is only valid for margin, upper and lower invalid.
Set padding only left and right padding valid, upper and lower is invalid. Note that the element range is increased, but the content around the element is not affected.

    Special characters:

&lt; &gt;&quot;&copy;&reg;

  Graphic Tags: :

SRC: The path of the picture to display.

ALT: The picture does not load successfully when prompted.

Title: The message when hovering the mouse.

Width: The width of the picture

Height: The height of the picture (width height Two attributes only one will be automatically equal to zoom.)

  Hyperlink tag (anchor label) <a>:

HREF: The resource path format to be connected is as follows: href= "http://www.baidu.com"

Target: _blank: Opens the hyperlink in a new window. Frame name: Opens the connected content in the specified frame.

Name: Defines a bookmark for a page.

For jumping href: #书签名称.

List Label:

<ul>: Unordered list

<ol>: Ordered list

<LI>: Each item in the list.

<dl> definition List

<dt> List Title

<dd> list Items

  Table Tags: <table>:

Border: Table border.

cellpadding: Inner margin

cellspacing: Margin.

Width: Percentage of pixels. (preferably with CSS to set the length width)

<tr>: Table row

<th>: Table Head cell

<td>: Table Data cell

RowSpan: How many rows the cell spans vertically

colspan: How many columns the cell spans (that is, merged cells)

<th>: Table header <tbody> (infrequently used): partitioning the table.

41.python Full stack path: HTML

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.