What are the similarities and differences between XHTML and HTML?
HTML is a WEB-based network design language, XHTML is an XML-based markup language, XHTML can be thought of XML version of HTML, so it's more rigorous syntax: elements must be closed, must be properly nested, case sensitivity, property Instead of the name attribute value must be enclosed in double quotes, id attribute
Tell us about the CSS box model? What elasticity box model?
Box model of content + padding + border + margin, divided into standard cassette and cassette IE, refers to the standard Content box width, the width IE cassette comprising content, padding, border
Elastic cassette (Flexible Box or flexbox), is a pattern layout for the arrangement of elements on a page, such as page layout to be adapted to different screen sizes and different display devices, elements may operate predictably.
Doctype role? Standard mode with a compatible models have what is the difference?
Declared in the first line of the document, in front of html for the parser to inform the browser what kind of document standards to parse the document, the document will appear if there is no statement in compatibility mode
Standard mode is typesetting and JS are run to the highest standards of browser support
Compatibility Mode page lenient backward-compatible display mode, imitate older browsers, to prevent the site does not work
What are inline elements? Block-level elements are there? Empty elements are those?
There are inline elements: ab span img input select strong
There are block-level elements: div ul ol li dl dt dd h1 h2 h3 h4 ... p
Common empty elements: br hr img input link meta
Tell us about your understanding of the browser kernel?
Browser kernel into JS rendering engine and engine
Common browser kernel What?
Trident kernel: IE, MaxThon, TT, The World, 360, Sogou browser and so on. [Also known as MSHTML]
Gecko-: Netscape6 and above, FF, MozillaSuite / SeaMonkey, etc.
Presto kernel: Opera7 and above. [Opera kernel source as: Presto, now: Blink;]
Webkit core: Safari, Chrome and so on. [Chrome: The branch Blink (WebKit's]
What cssSprite that? What are the advantages and disadvantages?
Sprite image is a web technology application, the background image that are integrated onto a single image, and then using the background-position for image positioning, the advantage of effectively reducing the http request, reducing the byte image, the disadvantage is synthesis is too much trouble, requires precise positioning
What are three layers of the front page? What are they? What is the role?
Layer structure responsible for HTML, responsible for building the structure of the page
The presentation layer is responsible for CSS, responsible for page styles
Layer is responsible for the behavior of JavaScript, responsible for page interaction
css selectors What? How priority algorithm?
Tag selectors, class selectors, selectors ID pseudo class selectors, adjacent selectors, selectors progeny, descendant selectors, selectors wildcard attribute selector
priority:
Proximity principle, below the top cover
! Important> Inline> ID> class> tag
HTML div and span the difference
div is a block-level element, one row alone, the default width is the width of the parent filled, the width and height may be provided
is the span line elements, arranged in a row, the width is the width of the content, and the width and height can not be set
css levels to achieve vertical centering
Positioning, top and left set to 50%, to achieve vertical and then horizontal centering is provided by a translate transform (-50%, -50%)
Positioning, top and left set to 50%, and then by margin-top margin-left half of their width and height is provided to achieve vertical and horizontal centering
Positioning, top, bottom, left, right are set to 0, then vertical and horizontal centering is achieved by auto margin setting
flex layout, to set the center to justify-content to achieve the middle level, and then set the align-items to center Vertical Centering
layout table, display parent element is disposed table-cell, and then set the vertical-align to achieve vertical centering middle, their display to the inline-block, the parent text-align centrally disposed center to achieve the level of
alt and title respectively, as well as specific applications reflect what the meaning of
alt text in place of pictures will be displayed when pictures can not show alt, title is explanatory text when the mouse pointer up