@charset "Utf-8";/*! * @ Name: Base.css * @ function: 1, reset browser Default style * 2, set generic atomic class *//* prevent user to customize the effect of background color on webpage, add let user can customize font */html {background:white; Color:black;} /* The internal and external margins often make each browser style behave differently */body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input, Textarea,p,blockquote,th,td,hr,button,article,aside,details,figcap
', ' header ', ' Hgroup ', ' menu ', ' nav ', ' section ', ' Summary ', ' time ', ' mark ', ' Audio ', ' video ', i = 0, len = tags.length; for (; i PNG32 Transparent (IE6)Mainly used for compatibility with IE6, not recommended, because this CSS code is more memory consuming. . some_element { background:url (image.png); _background:none; _filter:progid:dximagetransform.microsoft.alphaimageloader (src= ' image.png ', s
-decoration:None;BlR:expression (This.onfocus=this.blur ());}a:hover{text-decoration:Underline;}/*Clear Float*/. Clearfix:before,.clearfix:after{Display:Block;content: " ";Clear:both;}. Clearfix{Zoom:1;/*For ie67*/}/*Reset HTML5 tag, IE need to createelement in JS (tag)*/article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{Display:Block;}/*HTML5 media files are aligned with IMG*/Audio,canvas,video{Display:Inline-block;*display
Advantages of structured Labeling:1, convenient browser processing and recognition, improve the quality of web pages and semantics.2, reduce a lot of meaningless div tags, enhance the readability of the code. Structured Tags: (header,nav,body,article,section,aside,hgroup,figure,figcaption,footer)Document structure of the HTML51 Header>...Header>2 nav>...nav>3 article>4 Section>... Section>5 article>6 aside>...aside> 7 Footer>...Footer>Picture str
Excerpt from: http://www.cnblogs.com/yuzhongwusan/archive/2011/11/17/2252207.htmlHTML5 can do a lot of things for us, the most delicious is the application of semantic tags, if you have been in chrome or other support HTML5 browser used its ox x, then this article will certainly be useful to you, because now you can also use in IE HTML5.All right! Big front end today's theme is: HTML5 ShivHere are the html5.js files that quote Google, and the benefits are not:Copy the code to the Head section, a
>The code for the HTML interface is only responsible for encapsulating the data. The interface effect of the unlinked CSS is as follows:
CSS part of their own Baidu attributes are added to the comments, suitable for beginners.@charset "Utf-8";/*CSS Document*/html, body, Div, span, applet, object, IFRAME,H1, H2, H3, H4, H5, H6, p, blockquote, PRE,A, ABBR, acronym, address, BI G, cite, Code,del, DFN, EM, img, INS, KBD, Q, S, Samp,small, Strike, strong, sub, SUP, TT, VAR,B, u, I, CENTER,DL,
header), Hgroup (header Group), HR (horizontal split line), NoScript (content displayed when scripting is not supported or disabled), OL (with sequence list), output (form output), p (paragraph), Pre (preformatted text), section (a page segment), Table (table), TFOOT (table footer), UL (unordered list), Vidio (video). The inline elements are listed as follows:B (Bold), big (large font), I (Italic), small (small font), TT (equal width), abbr (abbrevia
@charset "Utf-8";/*! * @ Name: Base.css * @ function: 1, reset browser Default style * 2, set generic atomic class*//*prevents users from customizing the effect of background color on Web pages, adding allows users to customize fonts*/HTML{background: White;Color:Black;}/*internal and external margins often make different browser styles behave differently*/body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th, Td,hr,button,article,aside,details
more accurate in semantics and better for devices such as screen readers.Aside labelAside tags are used to load non-body content and are treated as a separate part of the page. It contains content that is separate from the main content of the page and can be deleted without affecting the content of the page, the chapters, or the information the page is about to convey. Examples include ads, groups of links, sidebar, and so on.Header LabelFooter LabelThe footer tag defines the footer of a sectio
1. Micro-formatA.HTML5 in the micro-format. is a way to add additional information to a Web page by using new tags in HTML5 additional information such as the date and time of the occurrence of the comforting time, the date of the article publication, etc.B. is to simplify the browser to extract data, convenient search engine searching2.time elementsA.pubbdate attributes, plus his search engine/browser can easily identify that date is the article, the News published dateB.C.D.UTC Standard Time,
before IE browser does not support Cssset the HTML5 element as a block elementThe following CSS will set HTML5 elements (article, aside, figure, header, footer, etc.) as block elements.Article, aside, details, figcaption, figure, Footer, Header, Hgroup, menu, nav, section { display:block;} CSS Body StructureI will not explain the details of the CSS file here. The width of the main container "pagewrap" of the page is set to 980px. The header is
relevant people, then provide information when it is necessary to determine the accuracy of information, do not pigtailed; 4.address tags cannot have h1~h6\ Article\address\aside\footer\header\hgroup\nav\section and other labels;This element is used to introduce charts, graphs, photographs, etc., the corresponding scene is like a magazine picture, before the HTML5 is not a special label to do this, before the implementation of this function is to use
when it is necessary to determine the accuracy of information, do not pigtailed; 4.address tags cannot have h1~h6\ Article\address\aside\footer\header\hgroup\nav\section and other labels;This element is used to introduce charts, graphs, photographs, etc., the corresponding scene is like a magazine picture, before the HTML5 is not a special label to do this, before the implementation of this function is to use the non-semantic div tag; Usage tip: 1.fi
, then provide information must determine the accuracy of information, do not pigtailed; 4.address tags cannot have h1~h6\article\address\aside\footer\header\hgroup\nav\ section and other labels;This element is used to introduce charts, graphs, photographs, etc., the corresponding scene is like a magazine picture, before the HTML5 is not a special label to do this, before the implementation of this function is to use the non-semantic div tag; Usage ti
HTML5 new Features
New DOCTYPE:
Scripts and links do not require the type attribute, such as Lingk, script;
semantic tags, such as: header, footer, Hgroup, mark, figure, Small, article,
Properties and Validation,
New attributes, such as: placeholder, required, autofocus, pattern, AutoComplete, data, contenteditable
Automatic check, such as: Required automatic check is empty, pattern regular match, Min,max maximum
Ref
the document, page, or website, the purpose is to allow developers to develop or reuse data independently. The structure of article is generally as follows:
Article applications include Forum posts, blog articles, user comments, and interactive widgets. (Special section) except its content, article has a title (usually in the header) and a footer.
2): hgroup label: this label combines the titles of a webpage or section. It is much easier to put
").animate({ scrollTop: $($(this).attr("href")).offset().top + "px" }, { duration: 500, easing: "swing" }); return false; });});
5. Fade-in and fade-out when the mouse slides
$(document).ready(function(){ $(".thumbs img").fadeTo("slow", 0.6); // This sets the opacity of the thumbs to fade down to 60% when the page loads $(".thumbs img").hover(function(){ $(this).fadeTo("slow", 1.0); // This should set the opacity to 100% on hover },function(){ $(this).fadeTo("s
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.