HTML&SCC Basic Knowledge

Source: Internet
Author: User

HTML common base tags with semantic tags
    • EM, emphasize
    • Strong, higher level than EM emphasis
    • ABBR, defining abbreviations, and using the title attribute with each other
    • Address, defining the element
    • BLOCKQUOTE, which defines a block reference, typically produces indentation
    • Cite, usually, a paragraph of the introduction of a book, you can use cite to explain
    • Ins, defining the text to be inserted
    • Del, define the deleted text
Labels with a certain style
    • b, define bold text
    • I, define italic text
    • Big, define large text
    • Small, defining the small font text
    • SUP, superscript text
    • Sub, subscript text
    • BDO, defining text display direction, properties: Dir, Value, Ltr,rtl
Output Class label
    • Pre, style output in code
    • Code, defining the text of the computer codes
    • KBD, defining keyboard text
    • var, defining variables
function Class label a label
    • Define hyperlinks to implement page jumps
    • Defining anchor points for bookmark functionality
List
    • Unordered list Ul,li
    • There are sequence tables Ol,li
Page nesting
    • Iframe
Image
    • Learn to
Form
    • Table Title Caption Label
    • Table header th Tag
    • Row TR label for table
    • Table cell TD label
    • Header thead label for table
    • Skeleton tbody Labels for tables
    • End of Table Tfoot label
* Basic links for all links on the page
    • Label (inside head tag)
form input field <input>:
    • Type property: Button,file,hidden,text,password,radio,checkbox,image,reset,submit.
    • Other properties to understand
Text input area <textarea>:
    • Cols property, which specifies the number of visible columns
    • Rows property, which specifies the number of rows visible
    • Disabled property, disables the current text input area
    • Name property, names of the current text area
    • ReadOnly property, the current text area is read-only
Button:
    • Disabled property, disable this button
    • Name property, button name
    • Type properties, button types
    • Value property, which displays the default value of the text content on the button
tags in drop-down menu form <label> grouping related elements in form <fieldset>css what is CSS

Cascading Style Sheets (full name: Cascading style Sheets) is a computer language used to represent file styles such as HTML (an application of the standard Universal Markup Language) or XML (a subset of the standard Universal Markup Language). CSS can not only statically modify the Web page, but also with a variety of scripting language dynamically to the elements of the page format.

How CSS is used
  1. Inline styles, also known as inline styles, are written in a label style, affecting only the elements within that tag. Suitable for all sub-labels except <script>.
  2. The internal style, defined in the Style tab, is placed in the head tag, and the style you set can affect the entire HTML page.
  3. External styles, writing CSS styles and placing them inside a separate. css file.
CSS Base Selector
  • HTML selector:
    Select elements with HTML tag names:
    1. All HTML tags can be used as selectors
    2. No matter how deep the label is, it will be selected.
    3. Select all labels instead of specific labels. So what we're setting up with the HTML tag Selector is some common problems.

  • Class selector:
    1. Any label can have an id attribute and a property value (because the ID is a global attribute). The ID name cannot be arbitrarily named. Case sensitive, the name of the ID can have a numeric letter underlined, but to start with a letter.
    2. But the ID name cannot be duplicated

  • ID selector:
    1. Any label can use the class attribute (the Class attribute is also a global property)
    2.class property names can be reused
    3. In a class attribute, you can have more than one class property value.
Block-level element and inline element concepts
    • Block-level elements: refers to block-level boxes from top to bottom one by one, the vertical distance between boxes is calculated by the vertical margin of the box. For example <div> tags.
    • Inline labels: can be distributed within the same line. such as <span> tags.
The difference between two types of elements
    1. The inner element section cannot set the width and height. The width and height of the inline element are the width and height of the label content. Block-level elements can be set to width and height.
    2. Block-level elements are exclusive on one line. The inline element, however, has the ability to monopolize a row and only share one row with other inline elements.
    3. If the block-level element does not set the width, the block-level element is automatically stained with the full width of the parent element.
Transformation of block-level elements and inline elements

Use the Display property to convert. As follows:

Display:block, Inlin-block

Integrated Selector
    • Descendant selector: Div p
    • Anxiety selector: h3.test
    • Level selector: div,p
    • Child (direct son) element selector: div>p
    • Sequence selector: UL Li:first-child ul Li:last-child
    • Adjacent Brother selector: div+p
    • Ordinary brother selector: Div~p
The inheritance and layering of CSS
  • Some styles of CSS are inherited, so what is inheritance? Inheritance is a rule that allows a style to be applied not only to a particular HTML tag element, but also to its descendants. For example, the following code: If a color is applied to the P tag, the color setting applies not only to the P tag, but also to all child element text in the P tag, where the child element is the span label.
  • Cascading is in the HTML file for the same element can have more than one CSS style exists, when the same weight of the style exists, according to the order of the CSS style to decide, in the back of the CSS style will be applied.
  • Weight Issues : Universal Selector (*) < element (type) Selector < class Selector < property selector < pseudo-class < ID selector < inline style

Note:!important can change the weight of the "individual attribute" to infinity. Use as little as possible.

HTML&SCC Basic Knowledge

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.