Heim  >  Artikel  >  Web-Frontend  >  学习笔记1_html/css_WEB-ITnose

学习笔记1_html/css_WEB-ITnose

WBOY
WBOYOriginal
2016-06-24 11:22:57977Durchsuche

一,background-clip:border-box 默认/ padding-box / content-box;背景被裁剪到边框 / 内边距 / 内容区,css3属性。兼容写法如下:

     -webkit-background-clip: padding-box;     -moz-background-clip: padding;     background-clip: padding-box;<br /><br />二,雪碧图。
CSS Split,中文名CSS雪碧图。简单的就是说,通过背景定位,将许多小的图片放在同一张大图上面,减少HTTP请求次数,加速网站。要做到这一点需要两个技术:      1.CSS技术
   background:#color url(#image_src) #left #top #repeat;参数说明:#color:图片没有显示之前的颜色,透明的话,不填写#image_src:背景图片地址#left:图片水平方向的偏移量#top:图片垂直方向的偏移量#repeat:当容器大于图片大小时,背景扩展方式      2.PS合成图片的定位===============示例:PS制作大图片时,定位一个图片的位置为(10,20)那么CSS应该这样写 background: url("../background.png") 10px 20px no-repeat;
三,
min-width: 160px;_width:160px; 最小宽高度这样写。
    
四,
-webkit-box-shadow: 0 5px 10px rgba(0,0,0,0.2);-moz-box-shadow: 0 5px 10px rgba(0,0,0,0.2);box-shadow: 0 5px 10px rgba(0,0,0,0.2);阴影写法。
五,JavaScript 放置在文档最后面可以使页面加载速度更快。

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn