CSS - 随笔分类 - Mr.Kay

【解决方案】子div用了float浮动之后，如何撑开父元素，让父元素div自动适应高度的问题

摘要：重点：给父容器的CSS添加一个 overflow 属性， overflow:hideen;-------------------------------------------------------------------------------------以下为... 阅读全文

posted @ 2017-08-09 10:02 Mr.Kay 阅读(1211) 评论(0) 推荐(0)

【解决方案】禁止手机页面中A标签长按弹出路径框

摘要：给a标签设置CSS：-webkit-touch-callout: none;ps：关于Label不可选中文本的css:-webkit-touch-callout: none; /* iOS Safari */-webkit-user-select: none; /* ... 阅读全文

posted @ 2017-07-31 16:24 Mr.Kay 阅读(342) 评论(0) 推荐(0)

【解决方案】display: box; 盒子布局无效的问题

摘要：例子如下css：.find_nav_list ul {display: -moz-box;display: -webkit-box;display: box; }.find_nav_list ul li {display: block; -moz-box-flex: ... 阅读全文

posted @ 2017-07-24 17:25 Mr.Kay 阅读(385) 评论(0) 推荐(0)

Jquery超简单遮罩层实现代码

摘要：本文转自： Jquery超简单遮罩层实现代码在开发中，为了避免二次提交，遮罩层的运用越来越普遍看了很多代码，下面跟大家分享一下我认为最简单的遮罩层实现方式：1.样式如下设置：CSS代码：[html] view plain copy print? 其中： opac... 阅读全文

posted @ 2017-07-20 11:21 Mr.Kay 阅读(246) 评论(0) 推荐(0)

CSS3动画入门 CSS动画如何使用（举例说明）

摘要：本文直接通过代码演示及注释初步了解一下CSS3动画的使用。演示效果可以直接拷贝代码运行一下即可~另外推荐几个不错的动画网站：Animate.cssAnimista动画工具动画演示 changereset 阅读全文

posted @ 2017-03-27 13:19 Mr.Kay 阅读(562) 评论(0) 推荐(0)

CSS 禁止文字选中

摘要：现象：html中可能有些地方不想让用户复制文字，或是用a标签做了个点击按钮，点快的时候文字会被选中，很丑，这个时候可以使用下面的方案禁止文字选中。原因：鼠标点快了。解决方案：不同的浏览器设置的内容不一样，user-select不是一个W3C的标准，浏览器的支持不完成，... 阅读全文

posted @ 2017-03-23 11:20 Mr.Kay 阅读(2810) 评论(0) 推荐(0)

【解决方案】去掉谷歌浏览器获取焦点时默认的input、textarea的边框和背景

摘要：1、使用Chrome的都知道，当鼠标焦点在input、textarea这些元素上时，Chrome默认的会给它们加上黄色的边框，我以前一直以为这是chrome的特性，没法去掉，原来是css的效果，outline这个属性。你可以用下面的css代码去掉所有元素的边框： *... 阅读全文

posted @ 2017-03-22 17:25 Mr.Kay 阅读(265) 评论(0) 推荐(0)

CSS 如何设置垂直居中

摘要：1、水平居中我们都知道，可以直接用：margin:0 auto;2、垂直居中，需要做一点小小的计算，关键代码如下：height: 600px;position: absolute;top: 50%;margin-top:-300px;如需水平且垂直居中：height:... 阅读全文

posted @ 2017-03-22 09:46 Mr.Kay 阅读(134) 评论(0) 推荐(0)

【解决方案】Ext.grid.CheckboxSelectionModel 实现锁住指定行不被选中

摘要：效果图1：注：如图，要对 sm 为 CheckboxSelectionModel 类型的 grid 实现指定行锁住而不被选中，锁住的条件由该行的某一字段的数据决定，图中根据“状态”决定改行能否被选中。实现方法（js中对这个 grid 的 sm 属性做配置）：sm:ne... 阅读全文

posted @ 2016-12-30 19:55 Mr.Kay 阅读(499) 评论(0) 推荐(0)

pointer-events: none——CSS实现禁用鼠标点击事件！巧妙解决ExtJs表格单行禁用功能！

摘要：注：该篇更好的解决方案见：【解决方案】Ext.grid.CheckboxSelectionModel 实现锁住指定行不被选中需求如下：实现效果如下：注：深灰色的背景色丑是丑了点，但是也正是这样才让前面的勾选框看上去不存在，实际上这个checkbox还是存在的，只是颜色... 阅读全文

posted @ 2016-12-20 17:06 Mr.Kay 阅读(345) 评论(0) 推荐(0)

Extjs鼠标长按事件（实现长按按钮触发事件的方法：mousedown、mouseup）

摘要：实现效果：注：实现的效果其实就是监听鼠标长按的事件，当鼠标左击长按改变按钮的样式，当鼠标放开之后还原按钮的样式。实现方法：extjs: Ext.get("loginBtn").on("mousedown", function () { ... 阅读全文

posted @ 2016-11-29 11:06 Mr.Kay 阅读(481) 评论(0) 推荐(0)

CSS3 -webkit-transition(属性渐变)

摘要：-webkit-transition：CSS属性(none|all|属性) 持续时间时间函数延迟时间CSS属性(transition-property)：要变化的属性，比如元素变宽则是width，文字颜色要变色这是color；W3C给出了一个可变换属性的列表... 阅读全文

posted @ 2016-11-22 14:51 Mr.Kay 阅读(9475) 评论(0) 推荐(0)

修改checkbox样式

摘要：效果如下：点击之后：代码如下： testCheck 稍微解释一下：其实checkbox的样式还是浏览器的原始样式，只是它的大小和位置改了一下，然后在它的上面（::before）重画了一个假象。----------------------------... 阅读全文

posted @ 2016-11-08 21:40 Mr.Kay 阅读(537) 评论(0) 推荐(0)

ExtJs 通过 toggleClass 实现样式切换 ——以及更多的CSS操作

摘要：此处重点介绍一下 toggleClass的应用，如图：css ↓extjs ↓修改之后 ↓同样是为了实现一个样式切换的效果，之前不知道 toggleClass这个神器的时候还傻傻地用 hasClass + removeClass + addClass 来进行判断操作。... 阅读全文

posted @ 2016-11-02 11:28 Mr.Kay 阅读(365) 评论(0) 推荐(0)

【解决方案】CSS 给 label 设置宽高无效

摘要：如图，我的代码是这样的：html中：订馆 css中：.statusCheck0 , .statusCheck1{ color: white; width: 20px ; height: 20px; line-height: 20px; ... 阅读全文

posted @ 2016-10-23 12:07 Mr.Kay 阅读(1593) 评论(0) 推荐(0)

ExtJs 实现点击修改DOM样式增删clssName

摘要：实现效果图如下：如图，就是实现点击之后给对象添加一个样式（add一个className），同事删除其它对象的这个类名（通过className查找对象，再remove这个className）。实现难点如下：1、如何通过className遍历对象可参考: ExtJs 获... 阅读全文

posted @ 2016-09-29 11:38 Mr.Kay 阅读(352) 评论(0) 推荐(0)

ExtJs中如何实现点击之后修改类名（class）

摘要：直接上代码check:function(){ var cmp = this.ownerCt; if (this.checked == true) { cmp.addClass("magazineTableRowSelecte... 阅读全文

posted @ 2016-09-18 15:24 Mr.Kay 阅读(334) 评论(0) 推荐(0)

css限制显示字数，文字长度超出部分用省略号表示

摘要：直接放关键代码：#bookName{ white-space:nowrap; /*文本不换行*/ text-overflow:ellipsis;/*设置超出部分显示...*/ -o-text-overflow:ellipsis; overflow: hidden;}-... 阅读全文

posted @ 2016-07-14 13:07 Mr.Kay 阅读(1787) 评论(0) 推荐(0)

CSS3阴影 box-shadow的使用和技巧总结

摘要：本文转自：http://blog.csdn.net/freshlover/article/details/7610269text-shadow是给文本添加阴影效果，box-shadow是给元素块添加周边阴影效果。随着html5和CSS3的普及，这一特殊效果使用越来越普... 阅读全文

posted @ 2016-05-18 16:13 Mr.Kay 阅读(199) 评论(0) 推荐(0)

CSS中关于多个class样式设置的不同写法

摘要：html中：这是AAAAAAAAAAAAAAAAAAAAAAA样式这是BBBBBBBBBBBBBBBBBBBBBB样式 css中：.containerA .containerB { color: red; font-s... 阅读全文

posted @ 2016-04-14 10:17 Mr.Kay 阅读(1682) 评论(0) 推荐(0)

Mr.Kay

随笔分类 - CSS

公告