小编jos*_*hnh的帖子
大写或小写doctype？
在编写HTML5 doctype时,正确的方法是什么？
<!DOCTYPE html>
要么
<!doctype html>
推荐指数
解决办法
查看次数
我应该在body或html元素上设置默认的font-size吗？
我喜欢em在创建网站时使用s.因此,我设置一个默认font-size的100.01%开启body元素.
我的问题是我应该在元素font-size上设置默认值吗？两者的利弊(如果有的话)是什么？bodyhtml
推荐指数
解决办法
查看次数
响应式布局 - PX,EM还是%？
我正在构建一个响应式页面布局,它到目前为止工作得很好,但我有一个问题:
我应该使用em,px还是%？
例如,我想将边界半径应用于元素.我应该使用这个代码:
border-radius: 1.563em;
或这个:
border-radius: 25px;
我应该使用ems来获得类似的属性,还是应该坚持使用px？
推荐指数
解决办法
查看次数
如何阻止用户在我的网站上水平滚动
这是网站:http://joshnh.com/
基本上,我有一些超宽的元素,使它们看起来好像是从屏幕的右侧出来.然后我overflow-x: hidden;在身体上使用隐藏溢出,但这并不会阻止页面在用户使用触控板时水平滚动,或者单击并将鼠标拖动到右侧.
该站点是流动的,因此设置overflow-x: hidden;不是问题,但必须在body/ html标签上设置,而不是在内容包装器上设置,因为这会破坏设计.
我也在使用这个jQuery片段来尝试和帮助:
(function($) {
$(window).scroll( function() {
$(window).scrollLeft(0);
});
})(jQuery);
我过去曾成功使用过它,但在这种情况下我似乎无法使用它.这是一个jsFiddle显示上面的代码片段在一个简化的测试用例中工作:http://jsfiddle.net/joshnh/pqpzN/
有什么建议？
PS它在iOS上的行为应该如此.
更新:我想我已经设法让jQuery片段通过触摸板停止水平滚动,但点击和拖动仍然有效(我无法解释,因为测试用例停止点击和拖动,因为它应该在我的现场).
推荐指数
解决办法
查看次数
如何在没有额外标记的情况下将内联块/浮动标头居中？
我有一个可变宽度标题,其背景颜色必须与文本一样宽(不宽).我能想到的唯一方法(没有额外的标记)是将显示设置为内联块或将其浮动到左侧.然而问题是我无法集中标题(另一个要求).
到目前为止,我最接近的是设置position: relative;一个浮动的标题,将其从左侧推过50%,然后将其向后拉25%,但是这不会始终使标题居中.它必须保留在文档的流程中,因此position: absolute;是另一个禁止.
如果你知道一种方法,只使用CSS 而没有额外的标记请告诉我(伪元素很好,我不讨厌IE7支持)!
推荐指数
解决办法
查看次数
伪元素和图像
图像可以有伪元素吗？
在我的测试中,我无法使用:之前或之后使用图像元素,但我希望获得更多信息.
编辑:不幸的是W3C不清楚:
注意.此规范未完全定义:替换元素(例如HTML中的IMG)之前和之后的交互.这将在未来的规范中更详细地定义.
推荐指数
解决办法
查看次数
在div之外放置一个"图像",示例在我的帖子中
好的,让我们看看我能解释一下我的意思,这里有一个图片可以帮助:
因此,正如您在图像中看到的那样,我需要将绿色箭头从其当前位置放置到位于保持它的主div之外.我需要这样,如果页面重新调整大小,箭头将保持在其位置.如果您需要更多信息,请告诉我.对不起,如果这太模糊,我不知道如何解释它.谢谢!
推荐指数
解决办法
查看次数
css边界宽度百分比
我有一个div包装另一个像这样
<div id="container"><div id="box"></div></div>
假设容器的尺寸为100px×100px.我希望盒子的高度为0px,宽度为0px.但是,我希望盒子的左边框填满容器的50%,并且盒子的右边框填满容器的另外50%.
我怎么用css做这个？
推荐指数
解决办法
查看次数
如何创建围绕输入框的 CSS 边框？
我似乎无法通过谷歌来摆脱这个困境。我正在尝试重新创建如下所示的输入框。我想在输入框外部创建一个微妙的透明边框（透明度会有点低，在模型中很难看到。）
它似乎是在文本框内部制作边框，而不是在文本框外部。它还在边框底部（可能是输入框本身的底部）形成鲜明的突出显示。
模型图像
我的输入框 CSS
#merchantForm>form>input.inputValue {
border-radius: 3px;
height: 30px; width: 350px;
margin-top: 5px;
font-family: Helvetica,sans-serif; font-weight: bold; font-size: 19px; color: #333;
-moz-box-shadow: 0px 1px 0px #f2f2f2;-webkit-box-shadow: 0px 1px 0px #f2f2f2;
border-style: solid;
border-width: 5px;
border-color: rgba(0,0,0,0.3);
}
有任何想法吗？我对 CSS 有点陌生，所以也欢迎任何改进我的 CSS 的建议。
推荐指数
解决办法
查看次数
CSS First Child Select,特殊课程遗漏
我在列表的顶部和底部做圆角,每个LI都有背景颜色.由于背景颜色,整个UL的圆角不适用,并且第一个和最后一个LI仍然具有方角.
一切都很好,除了有些场景需要隐藏第一个LI,我用类名做这个,在下面的例子中我有"隐藏我".
<ul>
<li class="hide-me">A</li>
<li>B</li>
<li>C</li>
<li>D</li>
</ul>
因此,在上面的代码中,我想隐藏LI与类"hide-me"并显示LI B,C,D.因此,LI B将具有圆形左上方和右上方,并且LI D将具有圆形左下方和圆形右下方.
我正在使用的CSS就像:
li:first-child {
border-top-left-radius: 8px;
border-top-right-radius: 8px;
}
li:last-child {
border-bottom-left-radius: 8px;
border-bottom-right-radius: 8px;
}
li { background:yellow; }
.hide-me { display:none; }
但正如你所看到的,我上面的CSS会将圆角应用于隐藏的LI A. 但在这种情况下,LI B将位于列表的顶部,因为LI A是隐藏的,但由于它不是UL中的第一个子节点,因此它没有圆角.
因此,对于这种情况,如何为未隐藏的第一个LI应用圆角？
推荐指数
解决办法
查看次数
如何在<li>链接中定位CSS背景图像？
我正在使用左浮动无序列表为网站创建导航,并且正在寻找一种在当前活动页面链接下方定位图像的方法.我认为这可以通过CSS background-image属性以某种方式完成.
谢谢你的帮助!
推荐指数
解决办法
查看次数