Html, Css, Dom, javascript detail summary, domjavascript

Source: Internet
Author: User

Html, Css, Dom, javascript detail summary, domjavascript

Recently, I have become more and more aware of the importance of the Foundation, and the Details determine the success or failure. Therefore, I hope that I can sort out some small front-end details and make it easier for me to remember and review them.

 

1. when building a webpage Html framework, try to define class or id only for the outer tag (that is, the parent tag), and the inner tag (that is, the Child tag) if it can be expressed through nesting, the nested method is used, without the need to define a new category or dedicated id. The nesting of selector and the collective declaration of selector can greatly reduce the declaration of class and id and simplify Css code.

 

2. On the Html page, RGB is the three primary colors of red, green, and blue. Each color is composed of different percentages of the three colors, which are divided into 0 ~ 255, for example, rgb (100%, 100%, 100%), rgb (255,255,255), and # FFFFFF all refer to white, where # FFFFFF is a hexadecimal representation, the first two are the red component, the middle is the green component, and the last two are the blue component.

About the color of the basics, it is recommended to read: http://jingyan.baidu.com/article/ab0b5630c585e8c15bfa7d75.html

 

3. in different browsers, the compatibility of width and height values is poor. If no special declaration is made, in IE7, content + padding is specified) + border refers to the width or height of content in Firefox or google. To make it compatible in different browsers, you can make the following declaration in the first line of Html:


<! DOCTYPE html PUBLIC "-// W3C // dtd xhtml 1.0 Strict // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

In this way, it refers to the width and height of content. <! DOCTYPE> Declaration must be the first line of the HTML document, located before the

Details <! DOCTYPE> declaration usage see: http://www.w3school.com.cn/tags/tag_doctype.asp

 

4. the top, right, bottom, and left Css attributes must be used together with the position attribute, it indicates the distance between the boundary of a block and the page border (when the position attribute is set to absolute) or the original position (when the position attribute is set to relative.

 

5. If the node that uses getElementById () to obtain the given id has the name attribute of the element with the same name, this element will be returned in IE browser. This is a very serious Bug, so we should try to avoid duplication of the id and the name attribute of other elements when building the framework.

 

6. meta is an auxiliary tag in the head area of the html language. In almost all webpages, we can see the following html code:

<Head>
<Meta http-equiv = "content-Type" content = "text/html; charset = gb2312">

</Head>
Maybe you think the code is dispensable. In fact, if you can use the meta tag well, it will bring unexpected results, for example, adding keywords will be automatically collected by large search sites; you can set the page format and refresh, etc. In addition, to allow the browser to identify the correct encoding, the meta charset tag should appear prior to the title Tag.

Details: http://wenku.baidu.com/link? Url = Tk4vageSbJlE0iBKQS0FQTH0-YCR00YR6bejflnrkNVRA2zJaOWRHvVKJ44_Kmn2V79C7gou3KEt1e9-CRlePn_iCDfz0wdeG2F-EX6yoie

 

7. <div> what is different from <span> labels: <div> is a block-level element. The inner element is automatically wrapped, while <span> is just a row element, there is no line feed before and after it.

 

8. XHTML 1.0 requires that all tags be closed, and all null tags without pairs must end with/>. For example,

Related Article

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.