小编Nie*_*sol的帖子

在某些输入上删除IE10的"清除字段"X按钮?

这是一个有用的功能,但是有没有办法禁用它?例如,如果表单是单个文本字段并且旁边已经有一个"清除"按钮,那么也有多余的X.在这种情况下,删除它会更好.

可以这样做,如果是,怎么做?

css internet-explorer-10

722
推荐指数
5
解决办法
29万
查看次数

"在首映内容中消除渲染阻止CSS"

我一直在使用Google PageSpeed的见解来尝试提高我网站的效果,到目前为止,它已经证明非常成功.像延迟脚本这样的东西工作得很漂亮,因为我已经有了一个内部版本的jQuery .ready()来推迟脚本直到页面完全加载,我所要做的就是内联该特定功能并将完整脚本移动到页面末尾.这很有效.

但是现在我发现自己瞪着核对清单上剩下的一个黄点:"在首映内容中消除渲染阻止CSS".

我的CSS设置方式是让一个全局_.css文件包含一般适用于页面结构的样式,或者在整个站点的多个或两个位置使用.然后,大多数页面都有一个关联的CSS文件(例如,party.phpparty.css)包含特定于该特定页面的样式.所有CSS文件都无限期地缓存,因为我附加/t=FILEMTIME到文件名(后来用.htaccess删除它们),以保证文件在更改时更新.

因此,无论如何,Google建议内联上层内容所需的关键样式.麻烦是......好吧,看看这个截图:http://prntscr.com/1qt49e

正如你所看到的...... 所有内容都是首屈一指的!人们讨厌滚动,尤其是涉及加载许多页面的游戏.因此,我将网站设计为适合一个屏幕(假设分辨率足够好).所以这意味着... 所有的风格都适用于上面的内容!那么......有什么解决方案吗?或者我是否在那个近乎完美的分数上坚持那个黄色标记?

css pagespeed

153
推荐指数
4
解决办法
12万
查看次数

索引布尔字段是否有任何性能提升?

我正要写一个包含a的查询WHERE isok=1.顾名思义,isok是一个布尔字段(实际上TINYINT(1) UNSIGNED是根据需要设置为0或1).

索引此字段是否有任何性能提升?引擎(在这种情况下是InnoDB)是否会更好或更差地查找索引?

mysql indexing innodb

87
推荐指数
5
解决办法
3万
查看次数

CSS background-image-opacity?

如何使用CSS为文本或图像提供透明背景相关?,但略有不同.

我想知道是否可以更改背景图像的alpha值,而不仅仅是颜色.显然我可以用不同的alpha值保存图像,但我希望能够动态调整alpha.

到目前为止,我得到的最好的是:

<div style="position: relative;">
    <div style="position: absolute; left: 0px; right: 0px; top: 0px; bottom: 0px;
                      background-image: url(...); opacity: 0.5;"></div>
    <div style="position: relative; z-index: 1;">
        <!-- Rest of content here -->
    </div>
</div>
Run Code Online (Sandbox Code Playgroud)

它有效,但它体积庞大,丑陋,并且在更复杂的布局中混乱.

html css css3

67
推荐指数
7
解决办法
32万
查看次数

CSS动画延迟重复

我最近发现了如何"正确"使用CSS动画(之前我认为它们无法像在JavaScript中那样制作复杂的序列).所以现在我正在了解它们.

对于这个效果,我试图在一个类似进度条的元素上进行渐变"闪光"扫描.类似于对原生Windows Vista/7进度条的影响.

@keyframes barshine {
  from {background-image:linear-gradient(120deg,rgba(255,255,255,0) -10%,rgba(255,255,255,0.25) -5%,rgba(255,255,255,0) 0%);}
  to {background-image:linear-gradient(120deg,rgba(255,255,255,0) 100%,rgba(255,255,255,0.25) 105%,rgba(255,255,255,0) 110%);}
}
.progbar {
  animation: barshine 1s 4s linear infinite;
}
Run Code Online (Sandbox Code Playgroud)

正如你所看到的,我试图延迟4秒,然后在1秒内扫过闪光,重复.

但是,它似乎animation-delay只适用于第一次迭代,之后闪耀不断反复扫描.

我"解决"了这个问题如下:

@keyframes expbarshine {
  from {background-image:linear-gradient(120deg,rgba(255,255,255,0) -10%,rgba(255,255,255,0.25) -5%,rgba(255,255,255,0) 0%);}
  80% {background-image:linear-gradient(120deg,rgba(255,255,255,0) -10%,rgba(255,255,255,0.25) -5%,rgba(255,255,255,0) 0%);}
  to {background-image:linear-gradient(120deg,rgba(255,255,255,0) 100%,rgba(255,255,255,0.25) 105%,rgba(255,255,255,0) 110%);}
}
.progbar {
  animation: barshine 5s linear infinite;
}
Run Code Online (Sandbox Code Playgroud)

from并且80%完全相同,导致动画长度的80%的"延迟".

这是有效的,但对于我的下一个动画,我需要延迟变量(特定元素的常量,但使用动画的元素之间的变量),而动画本身保持完全相同的长度.

使用上面的"解决方案",当我想要的是更长的延迟时,我最终会得到一个更慢的动画.

是否有可能animation-delay适用于所有迭代,而不仅仅是第一次?

css css-animations

67
推荐指数
5
解决办法
10万
查看次数

如何倒计时约会

我想知道是否有人可以帮助我.经过几个小时在这里和网络上不知疲倦地搜索我似乎无法使用jquery找到一个简单的倒计时.我不想使用任何类型的插件只是一个简单的jquery代码来从日期倒计时.我已设法在下面找到此代码.但即使有这个代码放在我的网站上也没有出现.我从jquery.com添加了jquery文件,并添加了带counterID但没有的正确div .如果有人能够解释或告诉我如何在一个采用日期格式并返回倒计时的函数中进行简单的倒计时,我将非常感谢帮助.

var end = new Date('02/19/2012 10:1 AM');

    var _second = 1000;
    var _minute = _second * 60;
    var _hour = _minute * 60;
    var _day = _hour * 24;
    var timer;

    function showRemaining() {
        var now = new Date();
        var distance = end - now;
        if (distance < 0) {

            clearInterval(timer);
            document.getElementById('countdown').innerHTML = 'EXPIRED!';

            return;
        }
        var days = Math.floor(distance / _day);
        var hours = Math.floor((distance % _day) / _hour);
        var minutes = Math.floor((distance % _hour) …
Run Code Online (Sandbox Code Playgroud)

javascript

49
推荐指数
2
解决办法
10万
查看次数

类更改时``display:none`的CSS转换?

我开始使用过渡来"现代化"网站的感觉.到目前为止,:hover转型运作良好.现在我想知道是否有可能基于其他事情触发转换,例如当一个类发生变化时.

这是相关的CSS:

#myelem {
    opacity: 0;
    display: none;
    transition: opacity 0.4s ease-in, display 0.4s step-end;
    -ms-transition: opacity 0.4s ease-in, display 0.4s step-end;
    -moz-transition: opacity 0.4s ease-in, display 0.4s step-end;
    -webkit-transition: opacity 0.4s ease-in, display 0.4s step-end;
}
#myelem.show {
    display: block;
    opacity: 1;
    transition: opacity 0.4s ease-out, display 0.4s step-start;
    -ms-transition: opacity 0.4s ease-out, display 0.4s step-start;
    -moz-transition: opacity 0.4s ease-out, display 0.4s step-start;
    -webkit-transition: opacity 0.4s ease-out, display 0.4s step-start;
}
Run Code Online (Sandbox Code Playgroud)

触发更改的JavaScript是:

document.getElementById('myelem').className = "show";
Run Code Online (Sandbox Code Playgroud)

但过渡似乎并没有发生 - …

css css-transitions

49
推荐指数
2
解决办法
4万
查看次数

CSS中更聪明的单词突破?

如果我只穿上word-break: break-all一个元素,我经常会这样做:

大家好,我正在输入一个
太长而不适合的消息!

显然这会更好:

大家好,我正在输入一条
太长而不合适的消息!

但同时如果有人写道:

BLAAAAAAAAARRRRRRRRRRRRGGGGGGGGHHHHHHHH !!!!!!

然后我希望它是:

BLAAAAAAAAARRRRRRRRRR
RGGGGGGGGHHHHHHHH !!!!!!

我似乎无法找到实际做到这一点的方法.

请注意,元素的宽度不固定,可能会更改.

css word-break

41
推荐指数
3
解决办法
1万
查看次数

<select>元素上"向下箭头"的CSS?

是否可以在下拉选择元素上设置向下箭头的样式?即,(<select><option>--></option></select>)

我怀疑答案是否定的,因为IE处理特定元素的方式.如果没有办法,有没有人知道使用javaScript的'假'下拉框会模仿这种行为,但是我能够自定义吗?

html css jquery

36
推荐指数
3
解决办法
17万
查看次数

为什么我的图像下方有空间?

即使padding:0;margin:0应用了图像,图像也会在下方获得神秘的空白空间.

示范

截图

红色边框应该拥抱图像,但底部有空间.

是什么导致这种情况,我该如何删除这个空间?

html css image

33
推荐指数
2
解决办法
4134
查看次数