草庐IT

border-box

全部标签

html - CSS box-shadow 只出现边距

所以,我的网站有一个标题和一个包含RevolutionSlider的div。我正在尝试在标题下方和slider上方添加一个框阴影。但它不起作用,除非我也将margin-bottom添加到标题中-但这会使整个练习变得毫无意义。这是代码:#header{display:block;min-height:99px;background:#FFFFFF;border-top:3pxsolid#8dddcd;border-bottom:1pxsolid#ecf0f1;line-height:99px;box-shadow:010px10px10pxrgba(0,0,0,0.3);}#rev{po

html - CSS box-shadow 只出现边距

所以,我的网站有一个标题和一个包含RevolutionSlider的div。我正在尝试在标题下方和slider上方添加一个框阴影。但它不起作用,除非我也将margin-bottom添加到标题中-但这会使整个练习变得毫无意义。这是代码:#header{display:block;min-height:99px;background:#FFFFFF;border-top:3pxsolid#8dddcd;border-bottom:1pxsolid#ecf0f1;line-height:99px;box-shadow:010px10px10pxrgba(0,0,0,0.3);}#rev{po

html - Firefox/Safari 设置高度为 [specified height - padding - border] for input[type=button]

当我使用以下CSS时:input[type=button]{background-color:white;border:1pxsolidblack;font-size:15px;height:20px;padding:7px;}使用这个HTML:我希望看到这个,所以总高度变成了36px:1pxborder7pxpadding20pxcontent(with15pxtext)7pxpadding1pxborder但是Firefox3.6和Safari4都显示了这个:(没有在其他浏览器中测试过)Screenshothttp://labs.spiqr.nl/upload/files/1223

html - Firefox/Safari 设置高度为 [specified height - padding - border] for input[type=button]

当我使用以下CSS时:input[type=button]{background-color:white;border:1pxsolidblack;font-size:15px;height:20px;padding:7px;}使用这个HTML:我希望看到这个,所以总高度变成了36px:1pxborder7pxpadding20pxcontent(with15pxtext)7pxpadding1pxborder但是Firefox3.6和Safari4都显示了这个:(没有在其他浏览器中测试过)Screenshothttp://labs.spiqr.nl/upload/files/1223

javascript - 如何删除点击时的 "Dotted Border"?

如你所见我想在单击按钮后以某种方式删除虚线。有什么想法吗?谢谢伙计们:这是我的CSS和HTML的当前状态,但仍然没有使用:.myButtoninput{position:absolute;display:block;top:5%;left:87%;height:44px;border:none;cursor:pointer;width:43px;font:bold13pxsans-serif;;color:#333;background:url("hover.png")00no-repeat;text-decoration:none;}.myButtoninput:hover{back

javascript - 如何删除点击时的 "Dotted Border"?

如你所见我想在单击按钮后以某种方式删除虚线。有什么想法吗?谢谢伙计们:这是我的CSS和HTML的当前状态,但仍然没有使用:.myButtoninput{position:absolute;display:block;top:5%;left:87%;height:44px;border:none;cursor:pointer;width:43px;font:bold13pxsans-serif;;color:#333;background:url("hover.png")00no-repeat;text-decoration:none;}.myButtoninput:hover{back

html - border radius + overflow hidden + inner element (progress bar) 使锯齿状边缘伪影

我正在尝试构建一个进度条,非常简单。我有一个嵌套在托盘内的酒吧。托盘上设置了overflow:hidden和border-radius。这是jsFiddle证明问题。如您在图片中所见,进度条左侧有一个锯齿状的瑕疵。父级进度条(深色背景)的抗锯齿边缘似乎在流血出去。所需的行为是bar/fill元素用于消除进度条的锯齿。我尝试过的一个简短的解决方案是绝对定位内部div,但是进度条需要能够从0%到1%进行动画处理,并且看起来没有overflow:hidden剪辑。我在Chrome和Firefox看到了这个工件,所以我不会立即怀疑它是Webkit中的错误。我还注意到这个错误也会影响Bootst

html - border radius + overflow hidden + inner element (progress bar) 使锯齿状边缘伪影

我正在尝试构建一个进度条,非常简单。我有一个嵌套在托盘内的酒吧。托盘上设置了overflow:hidden和border-radius。这是jsFiddle证明问题。如您在图片中所见,进度条左侧有一个锯齿状的瑕疵。父级进度条(深色背景)的抗锯齿边缘似乎在流血出去。所需的行为是bar/fill元素用于消除进度条的锯齿。我尝试过的一个简短的解决方案是绝对定位内部div,但是进度条需要能够从0%到1%进行动画处理,并且看起来没有overflow:hidden剪辑。我在Chrome和Firefox看到了这个工件,所以我不会立即怀疑它是Webkit中的错误。我还注意到这个错误也会影响Bootst

html - 为创造性地使用 "Flex-Box"而回退到旧的(和烦人的)浏览器

我不太喜欢那些提供一些标准但没有推理出可接受的解决方案的问题,但在这种情况下,我也有一个问题:没有JavaScript的兼容性,除了Modernizr。.(原因是他们放慢了页面速度。)我使用了新奇的CSS3flexbox来创建一个菜单,如果有一些额外的空间,它会显示一些额外的链接。您可以看到一个(希望)工作演示here.最大的问题是:如何在不使用有点著名的FlexieJS的情况下为(咳嗽)烦人(/咳嗽)的InternetExplorer和旧浏览器提供回退。图书馆?除了为菜单(ul)设置最大百分比宽度(实际上不起作用)之外,仅使用css2是否可以实现这一点?你能至少指出我正确的方向吗?谢

html - 为创造性地使用 "Flex-Box"而回退到旧的(和烦人的)浏览器

我不太喜欢那些提供一些标准但没有推理出可接受的解决方案的问题,但在这种情况下,我也有一个问题:没有JavaScript的兼容性,除了Modernizr。.(原因是他们放慢了页面速度。)我使用了新奇的CSS3flexbox来创建一个菜单,如果有一些额外的空间,它会显示一些额外的链接。您可以看到一个(希望)工作演示here.最大的问题是:如何在不使用有点著名的FlexieJS的情况下为(咳嗽)烦人(/咳嗽)的InternetExplorer和旧浏览器提供回退。图书馆?除了为菜单(ul)设置最大百分比宽度(实际上不起作用)之外,仅使用css2是否可以实现这一点?你能至少指出我正确的方向吗?谢