使用CSS集中...有点奇怪? [英] to center using CSS... a bit weird?

查看:74
本文介绍了使用CSS集中...有点奇怪?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述



http://www.0011。 com / test_size3.html


以徽标为中心HTML 4.01 check"页面底部的按钮,

我使用


< div style =" width:10px;保证金:0px auto">


< / div>


包围该按钮....


如果使用HTML,我会使用< center>


但是,我知道10px以上是错的...我可以使用60px或

100px ...这更接近那个图像的大小....但是,

这意味着我需要知道图像的确切宽度

正确居中吗?


因为在HTML中,我只需要使用< centerand忘记

它...如何来CSS需要知道大小...所以如果彼得进入

并换成不同的图像,他不知道改变

的宽度为CSS样式,然后它没有正确居中?

解决方案

On Sun,2007年10月28日04:28:50 -0700,Summercool写道:




http://www.0011.com/test_size3.html


将徽标置于中心位置HTML 4.01 check页面底部的按钮,

我使用


< div style =" width:10px;保证金:0px auto">


< / div>


包围该按钮....


如果使用HTML,我会使用< center>



你*是*使用HTML,它只是< centeris长期弃用,因为

演示文稿应该通过CSS指定。


但是,我知道10px以上是错误的......我可以使用60px或

100px ...更接近那个图像的大小....但是,

这是否意味着我需要确切知道图像的宽度是什么?
正确居中?



CSS具有'text-align''属性,它实际上适用于元素的所有内联

内容。你只需要以下形式的东西,

用相关属性替换省略号:

< div style =" text-align:center;">

< a ...>< img ...>< / a>

< / div>

-

萨法拉(Stephen Morley)


CSS中的白色空间属性:
http://www.safalra.com/web-design/cs ... pace-property /


10月28日上午5:13,Safalra(Stephen Morley) < use ... @ safalra.com>

写道:


>

CSS有''text-align''属性,实际上适用于元素的所有内联

内容。你只需要以下形式的东西,

用相关属性替换省略号:


< div style =" text-align:center; ">

< a ...>< img ...>< / a>

< / div>



这很好......如何将文本框置于文本框中...

文本应该留下 - 在这种情况下,

,然后使用< div style =" width:100px;保证金:0自动 ?


so ...以文本和img为中心,使用" text-align:center"

居中div,使用固定宽度和自动左右边距...


除了text / img vs div之外还需要考虑哪些案例?我想知道为什么这个

差距...使用< center?


2007年10月28日星期日06:45:15 -0700,Summercool写道:


[snip centering things]

so ... to center text and img,使用text-align:center

居中div,使用固定宽度和自动左右边距...


更多情况下除了text / img vs div之外还考虑一下?我想知道为什么这个

的差异...使用< center是不是更优雅?



否 - 混合内容和演示文稿显然不够优雅。当然

你仍然通过使用style属性来做到这一点,但下一步是

继续使用外部样式表并保持HTML纯粹和语义。

关于那个主题,并回答你的另一个问题,表格不需要宽度

居中 - 样式表中的以下代码将所有表格集中:

表{

保证金:0自动;

}

-

Safalra(Stephen Morley)


CSS中的''white-space''属性:
http://www.safalra.com/web-design/cs...pace-property/


in

http://www.0011.com/test_size3.html

to center the logo "HTML 4.01 check" button at the bottom of the page,
I used

<div style="width: 10px; margin: 0px auto">

</div>

to wrap around that button....

if using HTML, i would have used <center>

However, I know the 10px above is wrong... I could use 60px or
100px... which is closer to the size of that image there.... however,
does that mean I need to know exactly what width that image is to
properly center it?

because while in HTML, I just need to use <centerand forget about
it... how come CSS requires knowing the size... so if Peter comes in
and change to a different image, and he didn''t know about changing the
width for the CSS style, then it is not properly centered?

解决方案

On Sun, 28 Oct 2007 04:28:50 -0700, Summercool wrote:

in

http://www.0011.com/test_size3.html

to center the logo "HTML 4.01 check" button at the bottom of the page,
I used

<div style="width: 10px; margin: 0px auto">

</div>

to wrap around that button....

if using HTML, i would have used <center>


You *are* using HTML, it''s just that <centeris long deprecated as
presentation should be specified through CSS.

However, I know the 10px above is wrong... I could use 60px or
100px... which is closer to the size of that image there.... however,
does that mean I need to know exactly what width that image is to
properly center it?


CSS has the ''text-align'' property, which actually applies to all inline
content of an element. You just need something of the following form,
replacing the ellipses with the relevant attributes:
<div style="text-align:center;">
<a ...><img ...></a>
</div>
--
Safalra (Stephen Morley)

The ''white-space'' Property In CSS:
http://www.safalra.com/web-design/cs...pace-property/


On Oct 28, 5:13 am, "Safalra (Stephen Morley)" <use...@safalra.com>
wrote:

>
CSS has the ''text-align'' property, which actually applies to all inline
content of an element. You just need something of the following form,
replacing the ellipses with the relevant attributes:

<div style="text-align:center;">
<a ...><img ...></a>
</div>

that''s nice... how about to center a textbox... inside the textbox
the text should be left-justified.
in that case, then use <div style="width: 100px; margin: 0 auto" ?

so... to center text and img, use "text-align:center"
to center a div, use fixed width and auto left and right margin...

any more case to consider besides text/img vs div? i wonder why this
disparity... wasn''t it somewhat more elegant using <center?


On Sun, 28 Oct 2007 06:45:15 -0700, Summercool wrote:

[snip centring things]
so... to center text and img, use "text-align:center"
to center a div, use fixed width and auto left and right margin...

any more case to consider besides text/img vs div? i wonder why this
disparity... wasn''t it somewhat more elegant using <center?


No - mixing content and presentation is decidedly inelegant. Of course
you''re still doing that by using the style attribute, but the next step is
to move on to external stylesheets and leave your HTML pure and semantic.
On that topic, and to answer your other question, tables don''t need a width
to be centred - the following code in a stylesheet will centre all tables:
table{
margin:0 auto;
}
--
Safalra (Stephen Morley)

The ''white-space'' Property In CSS:
http://www.safalra.com/web-design/cs...pace-property/


这篇关于使用CSS集中...有点奇怪?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆