常用html样式--2

1:灰色背景

#hidebg { 
  position:fixed;left:0px;top:0px;
  background-color:#000;
  width:100%;  /*宽度设置为100%，这样才能使隐藏背景层覆盖原页面*/
  filter:alpha(opacity=60);  /*设置透明度为60%*/
  opacity:0.6; 
  display:none; 
  z-index:90;
  height: 100%;
}

2：删除线效果

text-decoration:line-through;

3：jquery寻找父元素下的其他子元素

$('.div_1').click(function(){
    $(this).parent().find('.div_2').show();
});

4：渐入渐出

$(".div_1").slideToggle();

5:绝对定位
绝对定位的元素的位置相对于最近的已定位祖先元素。

上面的例子中 class=‘son’ 想使用绝对定位,但是它的父级 class="father" 和它父级的父级 class="grandfather"都没有定位，所以 class=‘son’ 的定位是相对于body的。

上面的例子中 class=‘son’ 想使用绝对定位,但是它的父级 class="father" 设置了一个position:relative，所以 class=‘son’ 的定位是相对于 class="father" 的。

6、黑色透明背景

    background: #000;
    opacity: 0.42;

7、border渐变

border-image: -webkit-linear-gradient( red, blue) 30 30;
border-image: -moz-linear-gradient( red, blue) 30 30;
border-image: linear-gradient( red, blue) 30 30;

8丶多行溢出显示省略号

display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;