CSS：基本缩进问题 [英] CSS: basic indentation question
问题描述
您好，
我想在常见问题解答页面上实现以下
效果，而不需要
来诉诸html表。使用CSS做什么是
最好的方法（请注意
缩进是否像桌子一样）？
Best问候...... :-)
J''uring测试常见问题
================ ====
问：我的名字是Joe Doe还是我的
名字John Doe？
A：我怎么知道？我尝试用谷歌搜索
，发现几场比赛
但仍然无法分辨。所以，嘿，你好b $ b可能是乔，约翰，其他人，
或者你甚至可能不是人类。
nz******@cs.mun.ca （Neil Zanella ）写道：
我想在没有
求助html表的情况下为FAQ页面实现以下
效果。什么是使用CSS做到这一点的最佳方法（注意缩进是如何表格式的）？
如果你问的是CSS，那么正确的组就是ciwastylesheets。
相应的后续设置。
J''测试常见问题
====================
问：我的名字是Joe Doe还是我的名字？ John Doe？
A：我怎么知道？我尝试用谷歌搜索，发现了几场比赛
但仍然无法分辨。所以嘿，你可能是乔，约翰，其他人，或者你甚至可能不是人类。
我认为这是要理解的是，正确的文本行
（不包括Q：和A：）从相同的位置开始。这是从你的描述中完全明显的_not_
，因为只有当您使用等宽字体查看消息时，它才变得明显（？）
。
这听起来很棘手，我担心你至少需要额外的加价来
makeQ：和A：可以设置样式的元素，除了
明显（？）标记
< h2>问：我的名字是Joe Doe还是我的名字？
名字John Doe？< / h2>
< p>
A：如何我知道吗？我尝试用谷歌搜索
，发现几场比赛
但仍然无法分辨。所以，嘿，你好b $ b可能是Joe，John，其他人，
或者你甚至可能不是人类。
< / p>
使用< span> Q：< / span>和< span> A：< / span>，一种方法可能是
span {position：absolute;
left：-1.5em; }
h2，p {position：relative;
margin-left：1.5em; }
h2 {font-size：100％; }
（虽然您可能希望使用< span>和< p>，或者
的一些容器，因为你页面上可能还有其他< span>和< p>
元素。）
-
Yucca， http://www.cs.tut.fi/~jkorpela/
关于网页创作的网页： http://www.cs.tut.fi/~jkorpela/www.html
" Neil Zanella" < NZ ****** @ cs.mun.ca>写在
comp.infosystems。 www.authoring.html：
问：我的名字是Joe Doe还是我的名字John Doe？
它可能是以多种方式完成。这是一个。
在CSS中：
p.qa {margin-left：2em; text-indent：-2em}
span.qa {width：2em}
在HTML中：
< p class =" qa" ;>< span class =" qa"> Q：< / span>是我的名字......< / p>
（未经测试）
-
Stan Brown ，Oak Road Systems，Tompkins County，New York，USA
http://OakRoadSystems.com/
HTML 4.01规范： http：// www.w3.org/TR/html401/
验证者： http://validator.w3.org/
CSS 2.1规范： http://www.w3.org/TR/CSS21/
验证者： http://jigsaw.w3.org/css-validator/
2004年8月28日12:49:42 -0700， nz ****** @ cs.mun.ca （Neil Zanella）写道：
[越过ciwas和f-up相应设置]
我想为FAQ页面实现以下
效果...
J''uring测试常见问题
========= ===========
问：我的名字是Joe Doe还是我的名字John Doe？
A：我怎么知道？我尝试用谷歌搜索
并发现了几场比赛
但仍然无法分辨...
这是一个CSS问题，你可能想要看看
''ciwas''常见问题解答中的一些灵感。
http://www.css.nu/faq/ciwas-aFAQ.html
这里有样式表...
http://www.css.nu/includes/ciwas-FAQs.css
我为''ciwas''常见问题解答'写了样式表''几年前，我记忆中的常见问题解答列表就像你想要的那样从现代浏览器到IE4x / NS4x浏览器一直出现。 。
-
雷克斯
Hello,
I would like to achieve the following
effect for an FAQ page without having
to resort to html tables. What is the
best way to do it using CSS (note how
the indentation is table-like)?
Best Regards... :-)
The J''uring Test FAQ
====================
Q: Is my name Joe Doe or is my
name John Doe?
A: How would I know? I tried searching
with Google and found several matches
but still cannot tell. So hey, you
could be Joe, John, someone else,
or you may not even be human.
nz******@cs.mun.ca (Neil Zanella) wrote:
I would like to achieve the following
effect for an FAQ page without having
to resort to html tables. What is the
best way to do it using CSS (note how
the indentation is table-like)?
If you are asking about CSS, the right group is c.i.w.a.stylesheets.
Followups set accordingly.
The J''uring Test FAQ
====================
Q: Is my name Joe Doe or is my
name John Doe?
A: How would I know? I tried searching
with Google and found several matches
but still cannot tell. So hey, you
could be Joe, John, someone else,
or you may not even be human.
I assume that this is to be understood so that the text lines proper
(excluding "Q:" and "A:") start at the same position. This is _not_
completely evident from your description, since it becomes apparent (?)
only when your message is viewed using a monospace font.
This sounds tricky, and I''m afraid you''ll at least need extra markup to
make "Q:" and "A:" elements that can be styled, in addition to the
obvious (?) markup
<h2> Q: Is my name Joe Doe or is my
name John Doe?</h2>
<p>
A: How would I know? I tried searching
with Google and found several matches
but still cannot tell. So hey, you
could be Joe, John, someone else,
or you may not even be human.
</p>
Using <span>Q:</span> and <span>A:</span>, one approach might be
span { position: absolute;
left: -1.5em; }
h2, p { position: relative;
margin-left: 1.5em; }
h2 { font-size: 100%; }
(though you probably want to use classes for <span> and maybe <p>, or for
some containers of them, since you might have other <span> and <p>
elements on the page as well).
--
Yucca, http://www.cs.tut.fi/~jkorpela/
Pages about Web authoring: http://www.cs.tut.fi/~jkorpela/www.html
"Neil Zanella" <nz******@cs.mun.ca> wrote in
comp.infosystems.www.authoring.html:
Q: Is my name Joe Doe or is my
name John Doe?
It could be done in several ways. Here''s one.
In CSS:
p.qa {margin-left:2em; text-indent:-2em}
span.qa {width:2em}
In HTML:
<p class="qa"><span class="qa">Q:</span> Is my name ...</p>
(untested)
--
Stan Brown, Oak Road Systems, Tompkins County, New York, USA
http://OakRoadSystems.com/
HTML 4.01 spec: http://www.w3.org/TR/html401/
validator: http://validator.w3.org/
CSS 2.1 spec: http://www.w3.org/TR/CSS21/
validator: http://jigsaw.w3.org/css-validator/
On 28 Aug 2004 12:49:42 -0700, nz******@cs.mun.ca (Neil Zanella) wrote:
[crossed to ciwas and f-up set accordingly]
I would like to achieve the following
effect for an FAQ page... The J''uring Test FAQ
==================== Q: Is my name Joe Doe or is my
name John Doe?
A: How would I know? I tried searching
with Google and found several matches
but still cannot tell...
This is a CSS issue really and you might want to have a look at the
''ciwas'' a-FAQ for some inspiration.
http://www.css.nu/faq/ciwas-aFAQ.html
which has its style sheet here...
http://www.css.nu/includes/ciwas-FAQs.css
I wrote the style sheet for the ''ciwas'' FAQ''s several years ago and to
the best of my memory the FAQ lists comes out pretty much as you want
all the way from modern browsers and down into IE4x/NS4x browsers.
--
Rex
这篇关于CSS：基本缩进问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
