当前位置:  开发笔记 > 前端 > 正文

如何使用CSS在HTML文档中插入换行符

如何解决《如何使用CSS在HTML文档中插入换行符》经验,为你挑选了3个好方法。

我正在编写一个Web服务,我希望将数据作为XHTML返回.因为它是数据,而不是标记,我想保持它非常干净 - 没有额外的

s或s.但是,为了方便开发人员,我还希望在浏览器中使返回的数据合理可读.要做到这一点,我认为一个好的方法是使用CSS.

我特别想要做的是在某些地方插入换行符.我知道display:block,但它在我正在尝试处理的情况下并不真正起作用 - 带有字段的表单.像这样的东西:

Thingy 1: Thingy 2: Thingy 3: Thingy 4:

我想要渲染,以便每个标签显示在与相应输入字段相同的行上.我试过这个:

input.a:after { content: "\a" }

但这似乎没有做任何事情.



1> BrewinBomber..:

最好将所有元素包装在标签元素中,然后将css应用于标签.:before和:after伪类不是以一致的方式完全支持的.

标签标签具有很多优点,包括增加可访问性(在多个级别上)等等.


然后在标签元素上使用CSS ...

label {display:block;clear:both;}


(当您在输入元素周围包装标签时,不需要for ="one".)
软件具有一致的启动和停止指标更好.

2> Jim..:

表单控件由浏览器专门处理,因此很多东西不一定能正常工作.其中一个是生成的内容 - 它不适用于表单控件.而是将标签包装并使用label:before { content: '\a' ; white-space: pre; }.您也可以通过浮动所有内容并添加clear: left元素来实现.


反斜杠后跟十六进制数字被解释为字符引用.`A`是Unicode中的第十个字符,它是换行符.
@AlexisWilke添加到Jim解释的内容:A = 10十六进制(如0xA)和Unicode 10的Unicode是换行符.他们没有选择明确地选择`\ a`而非`\n`.

3> Jon Galloway..:

看起来你有一堆你希望在列表中显示的表单项,对吧?嗯...如果只有那些HTML规范的人想过要包含标记来处理项目列表......

我建议你这样设置:

然后CSS变得更容易了.


不要忘记你的标签"for"属性,如果省略它们,那么首先使用标签是没有意义的,因为它与输入元素没有任何关系.
要进行跟进,您还可以将输入(或选择等)元素嵌套在标签内,并安全地省略"for"属性.
推荐阅读
农大军乐团_697
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有