Shulou(Shulou.com)06/02 Report--

This article mainly explains "what are the interview questions of html5 and css3". Interested friends may wish to have a look. The method introduced in this paper is simple, fast and practical. Let's let the editor take you to learn what are the interview questions of html5 and css3.

New features of CSS3

1.css3 implements fillet (border-radius), shadow (box-shadow), and frame picture (border-image).

two。 Add special effects (text-shadow), linear gradient (gradient), rotation (transform) to text

3 modify the size of the background image (background-size)

4. Added more CSS selector multi-background rgba

5. The only pseudo element introduced in CSS3 is:: selection, which is used to change the color of the text and the background color of the text when selecting the text

6. Media query, multi-column layout

What are the new features of html5 and what elements have been removed?

What's new:

1. Drag and drop release (Drag and drop) API

two。 Better semantic content tags (header,nav,footer,aside,article,section)

3. Audio and video API (audio,video)

4. Canvas (Canvas) API

5. Geographic (Geolocation) API

6. Local offline storage localStorage long-term storage data, the data will not be lost after the browser is closed

7.sessionStorage data is automatically deleted after the browser is closed

8. Form controls, calendar, date, time, email, url, search

9. New technologies webworker, websocket, Geolocation

Removed elements:

1. Elements of pure expression: basefont,big,center,font, smeme, strike, Tet, etc.

two。 Elements that have a negative impact on usability: frame,frameset,noframes

What is the difference between local storage (Local Storage) and cookies (data stored on the user's local terminal)?

Cookies: both server and client can access it. The size is only about 4KB. It is valid and will be deleted when it expires.

Local storage: only the local browser can access the data, and the server cannot access the local storage until it is sent to the server through the channel of POST or GET; 5MB per domain; no expired data, which will be retained until the user clears it from the browser or removes it using Javascript code

How to realize the communication between multiple tabs in the browser?

Call localstorge, cookies and other local storage methods

How do you optimize the files and resources of the website?

File merge File minimization / File Compression use of CDN managed caches

What is responsive design?

It is about making different devices have different sizes and functions in the process of making web pages. Responsive design is to enable all people to make the website work properly on these devices.

What is the use of the HTML5 Canvas element?

The Canvas element is used to draw graphics on a web page, and its tag is powerful because it can manipulate graphics directly on the HTML.

Please use CSS to implement: a rectangular content, projection, fillet, hover state slowly become transparent CSS implementation: a rectangular content, projection, fillet, hover state slowly become transparent body {margin: 0; padding: 0;} .a {width: 200px; height: 100px; border-radius: 10px Box-shadow: 10px 10px 5px # 888888; background-color: aqua; transition: 2s;} .a: hover {opacity: 0;} how do you implement the page design, and how do you think the front end should get the job done with high quality? How to design a layout of "product" on the full screen?

First of all, it is divided into head, body and feet. To achieve rendering is the most basic work, accurate to 2px; communicate with designers, product managers and project participation to make a good page structure, page refactoring and user experience to deal with hack, compatible and write beautiful code format

Describe the difference between progressive enhancement and elegant degradation

Progressive enhancement of progressive enhancement: build pages for low-version browsers to ensure the most basic functions, and then improve the effect, interaction and additional functions for advanced browsers to achieve a better user experience.

Gracefully downgrade graceful degradation: build full functionality from the start, and then be compatible with lower-version browsers.

Difference: elegant demotion starts with a complex status quo and attempts to reduce the supply of user experience, while progressive enhancement starts with a very basic, functional version and expands to meet the needs of the future environment. Demotion (functional decay) means looking back, while progressive enhancement means looking forward while ensuring that its roots are in a safe zone.

Why is it more efficient to use multiple domain names to store website resources?

CDN caching is more convenient

Break the concurrency limit of browser

Save cookie bandwidth

Save the number of connections in the main domain name and optimize the response speed of the page

Prevent unnecessary security problems

Could you describe the difference between cookies,sessionStorage and localStorage?

SessionStorage is used to store data in a session (session) locally, which is accessible only to pages in the same session and is destroyed when the session ends. So sessionStorage is not persistent local storage, just session-level storage. LocalStorage is used for persistent local storage, and the data will never expire unless it is actively deleted.

The difference between web storage and cookie

The concept of Web Storage is similar to that of cookie, except that it is designed for greater storage capacity. The size of Cookie is limited, and every time you request a new page, Cookie is sent, which virtually wastes bandwidth. In addition, cookie also needs to specify a scope and cannot be called across domains.

In addition, Web Storage has methods such as setItem,getItem,removeItem,clear, unlike cookie, which requires front-end developers to encapsulate setCookie,getCookie. But Cookie is also indispensable: the role of Cookie is to interact with the server as part of the HTTP specification, while Web Storage is simply created to "store" data locally.

At this point, I believe you have a deeper understanding of "what are the interview questions for html5 and css3?" you might as well do it in practice. Here is the website, more related content can enter the relevant channels to inquire, follow us, continue to learn!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.