【第22期】观点:IT 行业加班,到底有没有价值?

关于一些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;
    }





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

相关文章推荐

用 Eclipse 开发 iPhone Web 应用程序

使用 Aptana 的 iPhone Development 插件和 iUi 框架创建 iPhone Web 应用程序
  • isiqi
  • isiqi
  • 2008-03-06 08:53
  • 593

多屏复杂动画CSS技巧三则

当下CSS3应用已经相当广泛,其中重要成员之一就是CSS3动画。并且,随着CSS动画的逐渐深入与普及,更复杂与细腻的动画场景也如雨后春笋般破土而出。例如上个月做的「企业QQ-新年祝福」活动: 感...

程序员升职加薪指南!还缺一个“证”!

CSDN出品,立即查看!

MySQL服务器的linux性能优化和扩展技巧

MySQL服务器的linux性能优化和扩展技巧 作者:Yoshinori Matsunbu 作者现在是DeNA公司的数据库和基础设施架构师。之前在SUN公司工作。他也是HandlerSocket的作者。这个是MySQL的NoSQL插件。 本文是根据他的PPT整理而成的,如有不正确敬请指教。 ...

经验分享:多屏复杂动画CSS技巧三则

当下CSS3应用已经相当广泛,其中重要成员之一就是CSS3动画。并且,随着CSS动画的逐渐深入与普及,更复杂与细腻的动画场景也如雨后春笋般破土而出。例如上个月做的「企业QQ-新年祝福」活动: ...

Java 运行时监控,第 3 部分: 监控应用程序生态系统的性能与可用性

在本系列(共三篇文章)的 第 1 部分 和 第 2 部分 中,我介绍了监控 Java 应用程序的技巧和模式,在这两部分中我把
收藏助手
不良信息举报
您举报文章:深度学习:神经网络中的前向传播和反向传播算法推导
举报原因:
原因补充:

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