css积累中。。。

一、div或者p中文字居中效果。

    第一种方法：在div中使用 height和line-height来约束。

.alert-ban{
  top: 50%;
  width: 120px;
  height: 35px;
  line-height: 35px;
  position: fixed;
  background: #545252;
  border-radius: 5px;
  margin-top: 40%;
  margin-left: 35%;
  text-align: center;
  }

    overflow:hidden是为了防止div中的文字过多超出div。

    如图：

        

    第二种方法：

    若是一段内容，它的高度是可变的那么咱们就可使用上一节讲到的实现水平居中时使用到的最后一种方法，就是设定        Padding，使上下的padding值相同便可。一样的，这也是一种“看起来”的垂直居中方式，它只不过是使文字把                 <div> 彻底填充的一种方式而已。可使用相似下面的代码： 

    

div {   
  padding:25px;   
}

    这种方法的优势就是它能够在任何浏览器上运行，而且代码很简单，只不过这种方法应用的前提就是容器的高度必须是可伸     缩的。

二、css hack

        

    参考博客：http://blog.csdn.net/freshlover/article/details/12132801

三、overflow属性

基本语法
overflow-x : visible | auto | hidden | scroll 
语法取值
visible  :默认值。不剪切内容也不添加滚动条。假如显式声明此默认值，
             对象将以包含对象的 window 或 frame 的尺寸裁切。而且 clip 属性设置将失效 
auto     : 在必需时对象内容才会被裁切或显示横向滚动条 
hidden   :?不显示超过对象尺寸的内容 
scroll   : 老是显示横向滚动条 

使用说明
检索或设置当对象的内容超过其指定宽度时如何管理内容。全部对象的默认值是 visible ，除了 textarea 对象和 body 对象的默认值是 auto 。设置 textarea 对象此属性值为 hidden 将隐藏其滚动条。对于 table 来讲，假如 table-layout 属性设置为 fixed ，则 td 对象支持带有默认值为 hidden 的 overflow 属性。若是设为 scroll 或者 auto ，那么超出 td 尺寸的内容将被剪切。若是设为 visible ，将致使额外的文本溢出到右边或左边（视 direction 属性设置而定）的单元格。自IE5开始，此属性在MAC平台上可用。自IE6开始，当你使用 !DOCTYPE 声明指定了 standards-compliant 模式，此属性能够应用于 html 对象。此属性对于 currentStyle 对象而言是只读的。对于其余对象而言是可读写的。对应的脚本特性为 overflowX 。

    场景：有时候咱们在展现一个列表，每一个列表中的描述可能长度不一，可是咱们又要实现列表中的每一个项高度一致。超出部分用省略号来代替。

    配合

text-overflow:ellipsis

    能够实现。（注：最好在文字先后加上<nobr>标签，你懂得）

四、html右侧页面空出一截

    

解决办法：

html {
  width: 100%;
  overflow: hidden;
}

五、div中加三角形

    效果图：

    

    代码：

    

{  
  height: 0;
  line-height: 0;
  border-width: 14px;
  border-style: solid;
  border-color: transparent transparent transparent #1000FF;
  left: 160px;
  position: relative;
}

    其余位置的三角形只要修改border-color就好了。

六、div中加三角形

html中浏览器给定一些默认的样式，要去掉的话就重写对应的代码（像input框中的背景颜色，select框中的右侧尖角）

  关注开发，欢迎加好友交流，一块儿成长：

      qq群： 175677844

       微信：