草庐IT

html - 容器居中对齐,子元素左对齐

我有X幅图像(所有图像的高度和宽度都相同),我想在网页上显示它们。但是我想让页面在调整浏览器大小时自动在一行中显示最大数量的图像(不调整图像大小),并以固定的距离显示图像。此外,图片应在页面中央分组在一起,并依次显示。例如当浏览器窗口的宽度只能连续显示3张图像时,它们应该显示如下。每行3张图像以固定距离组合在一起,位于页面中央,一张接一张。如果浏览器变宽,可以连续显示4张图像,它们应该像这样显示。每行4张图像(不调整图像大小),以固定距离组合在一起,在页面中央,一张接一张。到目前为止,我已经编写了以下代码:HTMLCSSimg{height:200px;width:200px;padd

html - 居中宽度未知的div

我有div其中包含所有页面内容,包括页眉页脚等。所以我想将这个div居中到我页面的中心,现在我有了这个css:#page{position:relative;margin:auto;width:1000px;}它有效,但我的问题是这个div中的内容不断变化,所以宽度也发生变化,它可以是1000px或10100px所以我需要类似width:auto;的东西,怎么能做那样的事呢? 最佳答案 参见:http://jsfiddle.net/thirtydot/rjY7F/HTML:i'maswideasmycontentCSS:body{t

html - 居中宽度未知的div

我有div其中包含所有页面内容,包括页眉页脚等。所以我想将这个div居中到我页面的中心,现在我有了这个css:#page{position:relative;margin:auto;width:1000px;}它有效,但我的问题是这个div中的内容不断变化,所以宽度也发生变化,它可以是1000px或10100px所以我需要类似width:auto;的东西,怎么能做那样的事呢? 最佳答案 参见:http://jsfiddle.net/thirtydot/rjY7F/HTML:i'maswideasmycontentCSS:body{t

html - 是什么让 <button> 元素上的文本垂直居中?

似乎有一些魔力我不明白的元素。考虑这个标记:SomeTextSomeText还有这个CSS:.button{background:darkgrey;height:40px;border:2pxsolidgrey;width:100%;box-sizing:border-box;font-size:14px;font-family:helvetica;text-align:center;margin-bottom:20px;/*I'mawareIcouldusethistocenterit*//*line-height:40px;*/}是什么让按钮元素中的文本垂直居中?Webkit似乎预

html - 是什么让 <button> 元素上的文本垂直居中?

似乎有一些魔力我不明白的元素。考虑这个标记:SomeTextSomeText还有这个CSS:.button{background:darkgrey;height:40px;border:2pxsolidgrey;width:100%;box-sizing:border-box;font-size:14px;font-family:helvetica;text-align:center;margin-bottom:20px;/*I'mawareIcouldusethistocenterit*//*line-height:40px;*/}是什么让按钮元素中的文本垂直居中?Webkit似乎预

html - 如何使两个相邻 float 的div居中

我已经编写了以下HTML,试图将两个div彼此相邻。LoremipsumdolorsitametLoremipsumdolorsitamet但是,我编写的代码导致两个div一直向左浮动。这样做正确的是并排float两个div。我需要更改什么才能使两个div并排居中? 最佳答案 不使用float:left,而是使用display:inline-block:Loremipsumdolorsitamet,consecteturadipisicingelitLoremipsumdolorsitamet每个内部div的顶部通过使用vertic

html - 如何使两个相邻 float 的div居中

我已经编写了以下HTML,试图将两个div彼此相邻。LoremipsumdolorsitametLoremipsumdolorsitamet但是,我编写的代码导致两个div一直向左浮动。这样做正确的是并排float两个div。我需要更改什么才能使两个div并排居中? 最佳答案 不使用float:left,而是使用display:inline-block:Loremipsumdolorsitamet,consecteturadipisicingelitLoremipsumdolorsitamet每个内部div的顶部通过使用vertic

html - 在 100% 高度 div 中垂直居中文本?

我正在使用一个占父div高度100%的div。div只包含一行文本。div不能有固定的高度。所以我的问题是。如何使文本行垂直居中?我试过使用:display:table-cell;line-height:200%;如果div绝对定位很重要。当前CSS.requests{position:absolute;right:0;height:100%;width:50px;padding:010px;background-color:#69A4B5;display:table-cell;vertical-align:middle;border-bottom-right-radius:5px;}

html - 在 100% 高度 div 中垂直居中文本?

我正在使用一个占父div高度100%的div。div只包含一行文本。div不能有固定的高度。所以我的问题是。如何使文本行垂直居中?我试过使用:display:table-cell;line-height:200%;如果div绝对定位很重要。当前CSS.requests{position:absolute;right:0;height:100%;width:50px;padding:010px;background-color:#69A4B5;display:table-cell;vertical-align:middle;border-bottom-right-radius:5px;}

css - 居中基于百分比的 div

最近,一位客户要求他的网站基于百分比而不是基于像素。该百分比将设置为80%。正如你们所知,如果容器是基于像素的,那么将容器居中是非常容易的,但是如何将基于百分比的主容器居中?#container{width:80%;margin:0pxauto;}这不会使容器居中:( 最佳答案 margin属性支持百分比值:margin-left:10%;margin-right:10%; 关于css-居中基于百分比的div,我们在StackOverflow上找到一个类似的问题: