利用CSS实现书签效果实例源码

实现的效果图如下：

示例代码如下：

    
 
 
 
     .div2:before { 
  position: absolute; 
  top: 50px;
  left: 20px;
  z-index: 1;
  height: 0;
  padding-right: 10px;
  font-weight: bold;
  line-height: 0;
  color: #000;
  border: 15px solid #ee7600;
  border-right-color: transparent; 
  content: '书签';
  box-shadow: 0 5px 5px -5px #000;
     }
     .div2:after { 
  content: '';
  position: absolute;
  top: 80px;
  left: 20px;
  border: 4px solid #89540c;
  border-left-color: transparent;
  border-bottom-color: transparent;
     }
 
    
    
 
 
    

总结

以上就是这篇文章的全部内容了，希望本文的内容对大家的学习或者工作能带来一定的帮助，如果有疑问大家可以留言交流。