Version: 2013.4.19 latest: snowinmay.net === 2013.4.19 === Problem description:
In order to give websites a good user experience on mobile terminals, responsive design content was added to the page. Specifically, when the page width is small to a certain extent, another CSS style is called. Today, I mainly want to improve the loading problem. Solution: The image exists independently. When you switch to an image, the image is displayed. The problem is that when the network speed is low, image loading is slow during image switching, which affects the user experience. Better solution: 1. Combine the image sets. 2. When the website is opened, the image is loaded. 3. When you click an image, the image is buffered before being displayed. Problems found today: IE6, and 8 cannot be identified after a responsive design. So you need to judge the browser first. The solution is to use conditional comments to determine the browser. Other problems with http://www.cnblogs.com/dtdxrk/archive/2012/03/06/2381868.html. IE6, and 8 have no rounded corners. To add the rounded corners to IE6, and 8: 1. Image background (most practical); 2. Let ie support the CSS 3 rounded corner attribute method. Http://www.cnblogs.com/snowinmay/archive/2013/04/19/3031116.html IE6, 7 Navigation text not floating. The reason is that when the display attribute of the block element is set to inline-block, the IE6/IE7 browser does not support it. Solution: Disable? There are two methods: 1. Use the display: inline-block attribute to trigger the block element, and then define the display: inline, let the block element be presented as an inline object (two displays must be placed in two CSS declarations to achieve the effect, which is a classic bug in IE. If the display: inline-block is defined first, then set the display back to inline or block, and layout will not disappear ). The Code is as follows (... for other omitted attributes ):
Div {display: inline-block;...} Div {display: inline ;}
2. Set the block element to inline object submission (set the attribute display: inline), and then trigger the layout of the block element (for example, Zoom: 1 or float attribute ). The Code is as follows:
Div {display: inline-block; _ ZOOM: 1; _ display: inline;}/* Recommended */Div {display: inline-block; _ ZOOM: 1; * display: inline;}/* recommended: ie67 */
