HTML Basic Learning (II)

3.2

Continuing on an HTML basis, a few years ago the page was made using a tabular label layout, which is now rarely used, basically using div layouts

• Table: Displaying tabular data

<Table>    <TR>       <th></th><!--Text Center Bold to large, play the role of the table head -       <TD></TD>    </TR>    <TR>       <TD></TD>       <TD></TD>    </TR></Table>

• Common Properties:

border: Adding a border to a table

Width: setting widths for tables

Height: Set the table to high

CellSpacing: Specifies the white space between cells.

CellPadding: Specifies the gap between the edge of the unit and its contents.

• Other tags in the table:

  <!-- <th></th>  function to the table header     <caption></caption> Set the caption for the table     <thead></thead >   headers used to hold the top of the list    <tbody></tbody>  is typically used to store the main data in the page    <tfoot></tfoot>   Used to set the bottom portion of the table (which does not normally appear  )--  

• Forms: Used to collect information that is filled out in form elements and is now often used to register login fills, search boxes, and so on
• Input series: determined by the type attribute the element has the display content

2. Type = text: TextBox (Set Value property to set default value for text box)
4. Type = password: Password box (set the Value property to set the default value for the text box)
6. Type = hidden: hidden fields (not commonly used)
8. Type = Radio: Radio box (set checked property to set the default check, by setting the Name property of multiple radio boxes to make them a group, creating mutually exclusive effects)
10. Type = checkbox: Multi box (set checked property to set default check)
12. Type = button: (Set the Value property to set the default value of the button)
14. Type = Reset: Reset (Set the Value property to set the default value of the button)
16. Type = Image: Picture button (set src property to set Picture of picture button)
18. Type = Submit: Commit (Set the Value property to set the default value of the button)

• Select: drop-down box
• Option: Set the drop-down box option to use with SELECT
• The selected property sets the default options for the drop-down box.

 <  select     >  <  option  >  options 1</ option     >  <  option  >  options 2</ option  >  </ select  >   

• Textarea: Text field

  < textarea ></ Teatarea >

• Form Label: A variable single element (control) for managing all

  < form >         table cell element </form>

• HTML space Merge phenomenon: In the HTML content in the same place no matter how many small spaces, line wrapping, indentation HTML in the parsing will follow a space to parse. If you need to use it, you need a code writing specification.

• Special characters:

  <!-- &nbsp; space       &lt; less than sign       &gt; greater than sign       &copy; copyright       &amp: And No.       &yen: RMB       & REG: Registered trademark       &deg: Celsius       &plusmn: sign       &times: Multiplication sign       &divide: Division sign       &sup2: Superscript 2       &sup3: Superscript 3  -

• seo: Search engine Optimization to improve the ranking of pages in Search tools.
• search engine: In the network environment, the information collection, Then provide the platform for user search function
• Common practice: Pay to buy rankings, GF outer chain, label semantics
• Determine page semantics: let the page "Run Naked" (remove CSS)
• core idea: Use the right label in the right place to make each label play its part.
• meaning:

1. The friendliness of search engines
2. Enhance the user experience
3. Facilitates the readability, maintenance and development efficiency of the Code

• There are two exceptions to the label, they are non-semantic, often used to page layout style typesetting:

< Div ></ Div > <!-- block-level elements  -

• Characteristics:

1. Take a separate line on the page
2. If you do not set a line on a wide page by default
3. Typically used as a container layout

   < span ></ span > <!-- in-line elements  -

• Characteristics:

1. One line can put multiple
2. The display size is determined by the content.

The basics of HTML are probably all that, and it's a lot easier to learn the hard way after you've mastered it. Here are some points of knowledge about the basics of CSS.

• CSS definition: Cascading style sheets (cascading style sheets) cascading style Sheets, is used to beautify the page.
• Where to write CSS:

1. inline (inline): is written inside the page, inside the head tag, Write in the Style tab.
2. outer (outer): A CSS style sheet that is written externally, The link tag is written in the head tag when the HTML page is called with the link tag. <link rel= ' stylesheet ' href= ' out-of-the-box CSS ';
3. inline: written in the style attribute of the element.

• syntax structure:

    selector  { property: value;.. }  

• Each property has a corresponding value, which is called: Key-value pair
• font Properties: Font settings
• Span style= "font-family:"microsoft yahei"; Font-size:16px ">font-style: Controls whether the font is italic
• Optional properties:

1. Normal OK
2. Italic Italic Body
3. Oblique Italic body
4. Font-weight: Controlling font weight

• Optional assignment:

1. Normal OK
2. Bold and Bold
3. Bolder more coarse
4. Lighter fine Body
5. 100-900 (400 equivalent to normal,700 equivalent to bold)

Note: Bolder and lighter will be limited by the font, General Chinese to reach the bold is the largest, and the general Chinese is not a small body

• Font-size: Controlling Font size
• Assignment mode: number + length unit (px)
• Font-family: Setting fonts
• Optional assignment

1. Microsoft Yahei
2. Song Body
3. ...

• Font ligatures (font:font-weight, Font-style, Font-size, font-family)

Features: Font-weight and Font-style can be omitted and swapped position

Font-size and font-family can only be fixed in position and cannot be omitted

• Color properties: Font color settings
• Color Assignment Method:

/* color Word: color:red; hexadecimal notation: color: #0094ff; Format: # Two-bit red two-bit green two-bit blue RGB notation: Color:rgb (255,255,0); Format: rgb (red scale, green ratio, blue scale) If the ratio is a number, the minimum is 0, the maximum is 255 if it is a percentage, the minimum is 0%, the maximum is 100%* /

• Width and height: used to control the width and height of the element, respectively

Today is the first day to continue tomorrow

HTML Basic Learning (II)