关于一些css技巧实际应用扩展

原创 2016年08月29日 15:11:01
1.单行多行文字超出省略号

多行:
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
word-break: break-all;

单行:
width: 500px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
2.垂直居中

#parent {display: table}
#child{
    display: table-cell;
    vertical-align: middle;
    text-align: center;
}

//css3
.verticalcenter{
    position: relative;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}
3跨浏览器透明度

.transparent {
    filter: alpha(opacity=50); /* internet explorer */
    -khtml-opacity: 0.5;      /* khtml, old safari */
    -moz-opacity: 0.5;       /* mozilla, netscape */
    opacity: 0.5;           /* fx, safari, opera */
}
4.placeholder 不垂直居中

 line-height: normal;
    
    input::-webkit-input-placeholder { /* WebKit browsers */
      line-height: 1.5em;
    }
    input:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
      line-height: 1.5em;
    }
    input::-moz-placeholder { /* Mozilla Firefox 19+ */
      line-height: 1.5em;
    }
    input:-ms-input-placeholder { /* Internet Explorer 10+ */
      line-height: 1.5em;
    }





版权声明:本文为博主原创文章,未经博主允许不得转载。

Netbeans使用技巧,从点滴提高编程效率

Netbeans使用技巧,从点滴提高编程效率作为新手使用Netbeans大概一个月左右,总结了一些使用技巧,帮助更多的朋友提高编写代码的效率,有的技巧确实十分受用! * Html代码中的图片、JS、C...
  • at_wangwei
  • at_wangwei
  • 2016年05月06日 10:52
  • 1837

jquery扩展 详细(包含一些高级使用)

1、类级别的插件开发    类级别的插件开发最直接的理解就是给jQuery类添加类方法,可以理解为添加静态方法。典型的例子就是$.AJAX()这个函数,将函数定义于jQuery的命名空间中。  ...
  • techbirds_bao
  • techbirds_bao
  • 2013年01月23日 15:33
  • 2789

【Unity技巧】开发技巧(技巧篇)

写在前面 和备忘录篇一样,这篇文章旨在总结Unity开发中的一些设计技巧,当然这里只是我通过所见所闻总结的东西,如果有不对之处欢迎指出。 技巧1:把全局常量放到一个单独的脚本中 很...
  • candycat1992
  • candycat1992
  • 2014年05月02日 19:48
  • 10844

在实际项目中总结的一些CSS的使用技巧和重要知识点。

这么久没有写博客了,一来是因为项目工期赶得紧,二来是精力有限,感觉没有太多好的干货分享给大家。今天我就把最基础的HTML和CSS在实际项目中,比较重要的地方给大家写一下,希望对大家的学习和工作有所帮助...
  • zhanghuiqi205
  • zhanghuiqi205
  • 2017年11月02日 15:57
  • 76

jQuery几个重要的实际应用技巧

1.页面元素的引用 通过jQuery选择器获得jQuery对象不能够直接调用DOM定义的方法,例如: $("#mytest").text();//获取id为mytest的元素中的文本内容 $...
  • jiangfei009003
  • jiangfei009003
  • 2015年08月06日 17:08
  • 462

iPhone开发入门(9)--- 实际开发中的应用技巧

添加Action和Outlet截至到现在,我们已经会在 Interface Builder 中用 File's Owner 添加 Action 和 Outlet , 以及由 Write Class F...
  • demigod2009
  • demigod2009
  • 2011年05月10日 22:05
  • 643

浅谈iOS调试技巧的实际应用(二) UI篇

前篇简单介绍了断点及几个调试命令的使用的使用。    做iOS开发, 大部分的工作跟UI相关,而分析UI最重要的就是分析UI的Hierarchy,这篇就是围绕View Hierarchy来详细介绍U...
  • u010850094
  • u010850094
  • 2016年06月06日 10:48
  • 299

浅谈iOS调试技巧的实际应用 UI篇

前篇简单介绍了断点及几个调试命令的使用的使用。 做iOS开发, 大部分的工作跟UI相关,而分析UI最重要的就是分析UI的Hierarchy,这篇就是围绕View Hierarchy来详细介绍UI...
  • u011025344
  • u011025344
  • 2014年07月13日 19:47
  • 345

CSS direction属性简介与实际应用

一、用的少并不代表没有用 至少,在我接触的这么多项目里,没有见到使用过CSS direction属性做实际开发的。 为什么呢?是因为direction长得丑吗? 虽然说dire...
  • qian_xiaona
  • qian_xiaona
  • 2016年03月23日 10:12
  • 477

一些关于HTML与CSS的总结与实际应用

//学习前端也快一年了,觉得有必要好好总结一下这一年来学过的知识。一些是前辈们的精华,文章最后会讲地址一一放出,若原作者有任何介意,请及时联系我删除。 关于DOCTYPE 1.DOCTYPE的作用...
  • WebHank
  • WebHank
  • 2016年07月24日 15:17
  • 1348
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:关于一些css技巧实际应用扩展
举报原因:
原因补充:

(最多只允许输入30个字)