前端的一点笔记

CSS的通配选择器

以前只知道* 可以代表所有的通配符。经过了解，发现可以有如下的通配符
[class^=”icon-“] 这种方式就是class中存在以icon-开头的class
[class*=” icon-“] 这种方式就是class中在后面的classs中有icon-开头的class

列表分割线

列表分割线一般都选择以+选择器来做，因为加号选择器可以屏蔽掉列表的第一项。

Bootstrap的data-属性的使用和理解

看到某教程中出现的data-image-lg可以直接由该元素的data[“image-lg”]属性获得，就去查了一下。果然。bootstrap支持这种形式的自定义 属性。也就是说，我们可以定义任意一个以“data-xxx”开头的属性，然后在jQuery中以$(item).data[“xxx”]来获取自定义的属性的值

Jquery中trigger

trigger之前没有听说过，了解到了之后发现用处还比较打。可以让某一事件或者方法在某个时刻触发，如下，在页面加载完成之后触发resize操作。

$(function(){
    $(window).on('resize',resize);
    $(window).trigger('resize')
})

background-size属性

• length
  设置背景图像的高度和宽度。
  第一个值设置宽度，第二个值设置高度。
  如果只设置一个值，则第二个值会被设置为 “auto”。
  测试
• percentage
  以父元素的百分比来设置背景图像的宽度和高度。
  第一个值设置宽度，第二个值设置高度。
  如果只设置一个值，则第二个值会被设置为 “auto”。
  测试
• cover
  把背景图像扩展至足够大，以使背景图像完全覆盖背景区域。
  背景图像的某些部分也许无法显示在背景定位区域中。background-size取值为cover时，背景图片自己会放大到适合容器的尺寸著作权归作者所有。
• contain
  把图像图像扩展至最大尺寸，以使其宽度和高度完全适应内容区域。
  contain刚好是跟cover相反，是把背景图片缩小到适合元素容器的尺寸著作权归作者所有。