文档章节

CSS填坑代码大全

ITer在路上
 ITer在路上
发布于 2015/10/08 16:28
字数 328
阅读 110
收藏 13

1. 文字溢出省略号显示

white-space: nowrap; text-overflow: ellipsis; overflow: hidden;

2. 文字换行

/*强制不换行*/
white-space:nowrap;
/*自动换行*/
word-wrap: break-word;
word-break: normal;
/*强制英文单词断行*/
word-break:break-all;

3. 画三角形

width: 0; 
height: 0; 
border-style: solid; 
border-width: 0 100px 100px 100px; 
border-color: transparent transparent #f00 transparent;

4. 强制出现滚动条

html{  height: 101%;}

5. 清除浮动

.clearfix{*zoom: 1;}
.clearfix{overflow:hidden;_zoom:1;}
.clearfix:after{clear:both;display:table;content:"”;}

6. 给div实现透明效果,支持ie7+

opacity: 0.5; 
filter: progid:DXImageTransform.Microsoft.Alpha(opacity=50);

7.去掉Webkit(chrome)浏览器中input(文本框)或textarea的黄色焦点框

input,button,select,textarea{ outline:none;}
textarea{ resize:none;}

8.去掉chrome记住密码后自动填充表单的黄色背景

input : -webkit-autofill {
    background-color : #FAFFBD ;
    background-image : none ;
    color : #000 ;
}

9.min-height: 最小高度兼容代码

min-height:500px;height:auto !important;height:500px;overflow:visible;

10.placeholder占位符颜色自定义

input:-moz-placeholder { color: #369; }

::-webkit-input-placeholder { color:#369; }

11.焦点去除背景

-webkit-tap-highlight-color: rgba(255, 255, 255, 0);

-webkit-tap-highlight-color: transparent;  
// i.e. Nexus5/Chrome and Kindle Fire HD 7

12.手机版本网页a标记虚线框问题

a:focus { outline:none; -moz-outline:none; }

13.输入框聚焦发光效果

input[type=text],
textarea{
     -webkit-transition: all 0.30s ease-in-out;
     -moz-transition: all 0.30s ease-in-out;
     -ms-transition: all 0.30s ease-in-out;
     -o-transition: all 0.30s ease-in-out;
     outline: none;
     border: 1px solid #ddd;
}

input[type=text]:focus, 
textarea:focus {
    box-shadow: 0 0 5px rgba(81, 203, 238, 1);
    border: 1px solid rgba(81, 203, 238, 1);
}

© 著作权归作者所有

ITer在路上
粉丝 1
博文 40
码字总数 13808
作品 0
深圳
程序员
私信 提问
喷下干货。。。

看了一个所谓很有干货的文章。想起内涵和外延的定理。内涵越多的,外延越少,反之亦然。也就是所谓,内涵越多的货,越干。干到最后,就是个石头。喜欢干货的,无非身上带的石头少,遇到问题,...

中山野鬼
2013/10/15
927
10
webpack4配置详解之常用插件分享

前言(https://blog.csdn.net/weixin_43254766/article/details/83267838)   继上一次webpack的基础配置分享之后,本次将分享一些工作中项目常用的配置插件、也会包含一些自己了解过觉得不错...

苏南-首席填坑官
2018/11/19
479
1
Next.js 踩坑入门系列(四)— 中期填坑

Next.js踩坑入门系列 (一) Hello Next.js (二) 添加Antd && CSS (三) 目录重构&&再谈路由 (四) Next.js中期填坑 (五) 引入状态管理Redux 陆续更新... 填坑 第一坑 - params形式路由 上一篇在...

luffyZhou
2018/09/06
0
0
从无到用写个股票分析APP(一)

前言:再给自己挖个坑吧。 我想写个什么东西呢? 一:可以浏览当下相关资讯,以及大盘指数实时更新。 二:添加自选股票,可以查看该股票的走势图,相关资讯以及基本数据。 三:通过 server 端...

youerning
2018/06/28
0
0
webpack4配置详解之逐行逐句分析

前言(https://blog.csdn.net/weixin_43254766/article/details/83267838)   经常会有群友问起、、、甚至配置等等方面的问题,有些是我也不懂的,慢慢从大家的相互交流中,也学到了不少。 ...

苏南-首席填坑官
2018/11/12
244
1

没有更多内容

加载失败,请刷新页面

加载更多

如何使用Selenium WebDriver截屏

有谁知道是否可以使用Selenium WebDriver截屏? (注:不是硒RC) #1楼 吉顿 import org.openqa.selenium.OutputType as OutputTypeimport org.apache.commons.io.FileUtils as FileUtils......

技术盛宴
35分钟前
4
0
高阶函数

定义:能够包装函数的,使原本函数增加一些额外的福利的函数 比如: function higherOrderFn(fn){} 能够对fn增加一些额外的福利 应用场景: (function () { var getLogin = functio...

gtandsn
40分钟前
9
0
架构师成长之后

小致Daddy
42分钟前
6
0
Git 介绍和日常命令

git 介绍 GitHub是一个面向开源及私有软件项目的托管平台,因为只支持git 作为唯一的版本库格式进行托管,故名GitHub。 GitHub于2008年4月10日正式上线,除了Git代码仓库托管及基本的 Web管理...

郭靖Michael
今天
9
0
技巧以管理R会话中的可用内存

人们使用什么技巧来管理交互式R会话的可用内存? 我使用下面的函数(基于Petr Pikal和David Hinds在2004年r-help列表中的发布)列出(和/或排序)最大的对象,并偶尔对其中一些对象进行rm() ...

javail
今天
6
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部