小编tw1*_*w16的帖子
CSS:设置背景颜色,该颜色是窗口宽度的50%
试图在"分为两部分"的页面上获得背景; 两侧有两种颜色(看似通过background-color在body标签上设置默认值,然后将另一种颜色应用于div拉伸窗口的整个宽度).
我确实提出了一个解决方案,但遗憾的是该background-size属性在IE7/8中不起作用,这是该项目必须的 -
body { background: #fff; }
#wrapper {
background: url(1px.png) repeat-y;
background-size: 50% auto;
width: 100%;
}
既然它只是纯色可能有一种方法只使用常规background-color属性？
推荐指数
解决办法
查看次数
如何使内联元素出现在新行上,或者块元素不占用整行？
我无法弄清楚如何用CSS做到这一点.如果我只是使用<br>标签,它可以完美地工作,但我试图避免这样做,原因很明显.
基本上,我只是想.feature_desc span开始一个新的线路,但是:
- 如果我使它成为内联元素,它将没有换行符.
- 如果我把它作为一个块元素,它将扩展以适应整条线,将每个图标放在自己的行上,并在屏幕上浪费大量空间(每个
.feature_wrapper都会有一个略微不同的大小,但没有一个会像整个屏幕都很宽.)
示例代码:这可以,但使用br标记:
<li class='feature_wrapper' id='feature_icon_getstart'>
<span style='display: none;' class='search_keywords'>started</span>
<span class='feature_icon spriteicon_img' id='icon-getstart'><a href='getstarted/index.html' class='overlay_link'></a></span><br/>
<span class='feature_desc'><a href='getstarted/index.html' >Getting Started Wizard</a></span>
</li>
我想用CSS来设置这个样式来实现相同的结果:
<li class='feature_wrapper' id='feature_icon_getstart'>
<span style='display: none;' class='search_keywords'>started</span>
<span class='feature_icon spriteicon_img' id='icon-getstart'><a href='getstarted/index.html' class='overlay_link'></a></span>
<span class='feature_desc'><a href='getstarted/index.html' >Getting Started Wizard</a></span>
</li>
有任何想法吗？或者我是以错误的方式来做这件事的？
推荐指数
解决办法
查看次数
是否可以使用输入值属性作为CSS选择器？
是否可以使用CSS选择器来定位具有特定值的输入？
示例:如何根据以下内容定位下面的输入 value="United States"
<input type="text" value="United States" />
推荐指数
解决办法
查看次数
Chrome和Safari中的jQuery UI对话框的滚动条问题
我正在使用jQuery UI对话框modal=true.在Chrome和Safari中,这会通过滚动条和光标键禁用滚动(使用鼠标滚轮滚动和向上/向下翻页仍然有效).
如果对话框太高而无法放在一个页面上,则会出现问题 - 笔记本电脑上的用户会感到沮丧.
有人在三个月前在jQuery bug跟踪器上提出了这个问题 - http://dev.jqueryui.com/ticket/4671 - 它看起来不像修复它是一个优先事项.:)
任何人都这样:
- 对此有所解决？
- 有一个建议的解决方案,将提供一个体面的可用性体验？
我正在尝试使用鼠标悬停/滚动到表单的位,但它不是一个很好的解决方案:(
编辑:道具给Rowan Beentje(谁没有在SO afaict)寻找解决方案.jQuery UI通过捕获mouseup/mousedown事件来阻止滚动.所以下面的代码似乎解决了它:
$("dialogId").dialog({
open: function(event, ui) {
window.setTimeout(function() {
jQuery(document).unbind('mousedown.dialog-overlay')
.unbind('mouseup.dialog-overlay');
}, 100);
},
modal: true
});
使用风险自负,我不知道其他非模态行为解除了这个东西可能允许的范围.
推荐指数
解决办法
查看次数
jquery改变背景图像
我正在尝试用jQuery交换两个图像.使用我尝试的悬停事件:
$("#wlt-DealView .buyButton_new").mouseover(function(e){
$('.buyButton_new').css('background-image','url(../images/compra_mouseOver.png)');
});
$("#wlt-DealView .buyButton_new").mouseout(function(e){
$('.buyButton_new').css('background-image','url(../images/compra_normal.png)');
});
但是图像没有显示,在我从中获取鼠标后,它会触发第二个事件.它应该与第一张图片一起更新,但事实并非如此.
你可以看看这里:http://107.20.186.103/deals/cuerpon.
将鼠标悬停在" 购买"按钮上.
推荐指数
解决办法
查看次数
避免IE 10锚点/链接上的灰色背景
当你点击它们时,你如何避免IE 10应用于锚点的烦人的灰色背景？
推荐指数
解决办法
查看次数
在浏览器中居中一页水平滚动网站(不以div为中心)
当浏览器打开我的页面时,浏览器应该已经位于整个页面的中心.
含义:我有一个水平的单页,而不是从左边开始向右(例如这个),将从中间开始,并能够滚动到右侧和左侧的内容.
这是一个视觉:
如果可能的话,我想避免通过JavaScript或jQuery进行dom-ready滚动(我正在使用它进行导航辅助和东西),并且只使用纯html5/css或者至少将屏幕重点放在预先准备好的屏幕上的JavaScript/jQuery的.
我的两个想法:
a)将容器向左移动,例如使用margin-left:-x,但通常将其切断.
b)从一开始就将屏幕向右移动.
唉,我自己太不自然了.
ps这里我的jsfiddle一致性:http://jsfiddle.net/alexdot/2Dse3/
推荐指数
解决办法
查看次数
无法使用CSS将宽度和高度应用于-webkit-scrollbar
::-webkit-scrollbar {
width: 5px;
height: 5px;
}
::-webkit-scrollbar-thumb {
background-color:#808080;
}
为什么宽度和高度属性不起作用？
推荐指数
解决办法
查看次数
background-size:封面会在Chrome for Android中留下空白区域
我正在尝试为我的网站获得一个漂亮的全屏图像背景.它在我测试过的几乎所有浏览器(browsershots.org)中都运行良好,但在我的Android平板电脑上的Chrome中它没有按预期工作.你可以看到背景中有很多白色,它应该是所有图像.
链接: http ://test.socie.nl
CSS:
body {
background: url(../../images/background/image1.jpg) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
出乎意料的结果:
推荐指数
解决办法
查看次数
IE 9问题中<canvas>的z-index
我遇到一个奇怪的问题,z的索引为a <canvas>; 不能在IE9中渲染为正确的图层.请看看这个jsfiddle:
http://jsfiddle.net/xacto/MTUHX/
这是它应该如何工作:
- 红色方框应该是超链接的,并且是顶层.
- 青色
<canvas>应该是下一层. - 带绿色背景的方框应位于底部.
这适用于Chrome,Firefox甚至IE8.但是,在IE9中,青色<canvas>是顶层,红色轮廓的超链接框不再可点击,除了底部的小区域,它不覆盖青色<canvas>.
这是另一件值得注意的事情:如果你改变了<canvas>a <div>即改变了这条线:
var can = $('<canvas></canvas>').css({...
至
var can = $('<div></div>').css({...
它也适用于IE9.这让我相信这是一个<canvas>相关的问题,而不仅仅是一个z指数问题.
我根据网络上的建议尝试了很多z索引组合,但似乎没有任何效果.如果有人对此有答案,我们将不胜感激.
PS有些人可能会问为什么<canvas>要通过JavaScript添加它以及为什么它被添加为第一个元素<body>.没有详细说明,使用<canvas>它的第三方应用程序要求以这种方式添加它.
推荐指数
解决办法
查看次数