-
【雪碧图的实现原理】 css -- background position控制； x,y为负值，左上角顶点作为0.0坐标； 控制一个层可显示的区域范围大小，通过一个窗口，进行背景图的滑动；查看全部
-
【使用CSS雪碧图的原则】 1.静态图片，不随用户信息的变化而变化 2.小图片，图片容量比较小。＜3~5K 3.加载量比较大查看全部
-
<i></i>经常被写的人用来放置小图标 <h3>在淘宝首页有H1/H2大标题的，H2是菜单栏大标题，H3就是菜单栏下面标签 【去掉ul】 <style> ul{list-style:none} </style> 【给菜单栏加分割线】 1.<style> h3{margin:0;padding:0} ul{list-style:none;} li h3{font-size:14px;font-weight:400} li{ display:block; height:31px; line-height:31px; overflow:hidden; border-bottom:1px soild #dedede } .cat{width:150px; background:#f8f8f8; border:1px soild #bbb; } </style>查看全部
-
【雪碧图的实现方式】 1、PS手动拼图，缺点就是必须得自己再计算各个小图的坐标 2、使用sprite工具自动生成，快速的建立雪碧图的效果，优化设计 CSS sprite自动生成工具——CssGaga，windows环境下快速生成雪碧图的工具 下载网址：http://www.99css.com/archives/1524查看全部
-
【雪碧图的实现原理】 css -- background position控制； x,y为负值，左上角顶点作为0.0坐标； 控制一个层可显示的区域范围大小，通过一个窗口，进行背景图的滑动；查看全部
-
【使用雪碧图的原则】 1.静态图片，不随用户信息的变化而变化 2.小图片，图片容量比较小。＜3~5K 3.加载量比较大 一些大图不建议拼成雪碧图，可能会非常大，加载会很慢。 将网站的静态图片集成到一张背景图片上，然后通过坐标来获取图片内容，以此来减少向服务器端的http请求次数，从而提高网页的响应速度。 *在网页上，每请求一次，就会和服务器链接一次，建立链接是要额外时间的查看全部
-
网页上哪些元素会用雪碧图？ 通常来说首页的banner不会使用雪碧图， 有纯色背景的按钮也不会做雪碧图，直接用CSS样式 一些icon也是字体， 动态的图片一般不会用雪碧图，一般用img标签查看全部
-
使用雪碧图的原因查看全部
-
雪碧图的应用场景查看全部
-
内联元素如果应用了float，这个元素将被指定为块级元素，就可设置宽高查看全部
-
自动生成雪碧图的工具：CssGaga 下载地址：http://www.99css.com/archives/1524查看全部
-
雪碧图的使用情况查看全部
-
雪碧图查看全部
-
雪碧图编程挑战查看全部
-
一、准备一个空白的HTML页面，同时完成css reset样式： 1.reset样式可以参考别的大型网站的reset规则。 2.要添加utf-8的meta标签。 3.注意要reset H3的默认样式。 4.li和ul要去掉默认的样式。 5.为ul的容器div增加class，并设置样式。 <head> <meta charset="utf-8"> <title>index.html</title> <style type="text/css"> h3{margin:0; padding:0; font-size:14px; font-weight:400;} li{list-style:none; display:block; height:31px; line-height:31px; overflow:hidden; border-bottom:1px solid #dedede;} .box{width:150px; background:#f8f8f8; border:1px solid #bbb;} </style> </head> 二、完成页面当中的展示列表HTML的结构代码： 1.注意标签的语义化，无序列表需使用ul和li。 2.标题部分要使用h3标签。 3.每个li结构当中会有一个i标签用来展示icon。 <body> <div class="box"> <ul> <li><i></i><h3>服装内衣</h3></li> <li><i></i><h3>鞋包服饰</h3></li> <li><i></i><h3>运动户外</h3></li> <li><i></i><h3>珠宝手表</h3></li> <li><i></i><h3>手机数码</h3></li> <li><i></i><h3>家电办公</h3></li> <li><i></i><h3>护肤彩妆</h3></li> <li><i></i><h3>母婴用品</h3></li> </ul> </div> </body>查看全部
举报
0/150
提交
取消