前端网页优化的一些问题以及localStorage

最新推荐文章于 2024-12-20 21:16:18 发布

wive

最新推荐文章于 2024-12-20 21:16:18 发布

阅读量587

点赞数

CC 4.0 BY-SA版权

分类专栏： IDE工具

本文链接：https://blog.youkuaiyun.com/javadhh/article/details/54426145

IDE工具专栏收录该内容

12 篇文章

订阅专栏

本文介绍了网页布局中常见的浏览器内核差异导致的问题及解决方法，包括如何统一元素间距、字体设置、图片属性优化等，同时探讨了提高网页加载速度的策略。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

/**每个浏览器的内核不一样
元素与元素（div）之间的margin，以及元素内容与元素边框之间的距离padding都不一样
因此指定：**/
*{margin:0; padding:0;}


//一般采用：UTF-8国际编码   很久以前的项目经常用gbk，比如淘宝，腾讯用的gbk gb2312

//页面三要素： 
<title> 
<meta name="Keywords" content="" >
<meta name="description" content="">


/**
<img>标签：
alt属性：搜索引擎主要看这个，因为它不知道图片的真正内容。
	如果不写，搜索引擎对你降分
height,width属性：
	一定要写，不写的话，浏览器内核对你的图片再次计算
	效率有影响
**/


//最舒服的设置：
font-family:"微软雅黑";
font-size:12px;

//颜色优化：
#996600   -->  #960


/**大型网站为什么把样式放在head,原因是为了减少一次http请求次数
（等待主要时间花在下载网页元素（html,css,js.flash）
，每增加一个元素网页平均时间增加40毫秒
在网页整体大小相近的情况下，http请求次数少，
用户打开网页的速度越快（腾讯，京东）**/



//把centent中列表内容全部放到浏览器缓存session中
localStorage.setItem("datas",$(".centent").html());  //放在浏览器session中

//去除session中的值，设置动态效果
var datas = localStorage.getItem("datas");



//不要列表自带的样式
##ul li
.car .c_ul li{list-style:none;}