4 ways to reference CSS to HTML pages1. Inline Type
Setting CSS styles in the style attribute of the tag does not essentially reflect the benefits of CSS, so it is not recommended to use
<div style= "width:100px;height:100px;background:red;" ></div>
2, embedded (inline) embedded will be on the page of the various elements of the set to focus on tag Inside<style> tags. This is convenient for a single Web page, but for a site that contains many pages, if each page is nested in its own style, it loses the great benefits of CSS.
<style type= "Text/css" >p{color:red; }</style>
3, import-type and linked to the purpose is to introduce a separate CSS file into the HTML file,the difference between the two is that their grammatical rules are inconsistent. <style type= "Text/css" > @import "Mystyle.css";</style>
4, the link type (outer chain Type)This method does not require a style tag, but rather refers to an external style directly through the link style.It is generally recommended to use link to refer to external CSS style methods. <linkhref= "Mystyle.css"Rel= "stylesheet" type= "Text/css"/>
Advantages of using link to reference external CSS
- 1, in favor of SEO, using this method to reference external CSS files, will make the HTML page of the source code a lot less than directly add CSS style, because the search engine spider crawling Web page is not crawling CSS files, so that the HTML source code is very small, so that spiders crawl faster, less processing, Increase the weight of this page, in favor of ranking.
- 2, save the HTML to make the browser download Web page when separate threads, like loading a page at the same time there are two lines in the open a page truth, so that the page opened exceptionally fast. (The HTML source code and CSS file are downloaded at the same time when the user browses this webpage, making it faster)
- 3, modify the style of the page is convenient, just modify the CSS style can modify the page's art style, if in the site project this method, because the whole station has applied the common CSS basic style, so modify the whole station style according to Quick and convenient.
JS Code also has a similar two-way 1, inline <button onclick= "alert (' Hello ')" > external double inner single </button>
2. Embedded(inline type) <script> ... </script>3,LINK Type(outer chain Type) <scriptsrc= "My.js"Type= "Text/javascript" ></script>
From for notes (Wiz)
Several methods of using CSS and JS
