请教一个前端 css,如何去掉段落最前面的 margin。

2020-01-11 13:14:01 +08:00
 zhiqiang

我为<code/>添加了 margin:

code {
	margin-left:4px;
    margin-right:4px;
}

但它会在段落<p><code>xxx</code>yyy最前面也增加空白。然后我又尝试了first-child去掉:

code:first-child {
	margin-left: 0;
}

然后我发现它把<p>init<code>xxx</code>yyy的左边距也去掉了。

请问怎么写能实现我的目的?就是<code/>发生在一段的最开始,没有左边距。如果不是,就需要有左边距。

2678 次点击
所在节点    CSS
8 条回复
wolfan
2020-01-11 13:45:26 +08:00
emmm
<code>如果在第一行就没有 margin-left,如果不在就没有?
为什么不给<p>加个 padding ?

或者你是要:p>code{margin-left:4px}
zhiqiang
2020-01-11 14:19:55 +08:00
@wolfan `<code/>`不会换行。如果不好理解,可以改成`<span/>`。
geelaw
2020-01-11 14:29:39 +08:00
一个简单的做法是牺牲语义,手动在 code 左右加合适的空格。而且拉丁文本里 code 两侧本来就有空格。
wolfan
2020-01-11 15:53:08 +08:00
@zhiqiang 我觉得吧,你这个需求是 js 的事,不是 css 的事。

and 不是换 span 啥的事,是我语文成绩不好。总之我觉得你这个需求 css 是办不了的,因为 css 不能判断 code 前面有没有字符串什么的,css 只能知道<code>前面有没有其它 tag。所以这活 css 能干就是上天了。
yixiang
2020-01-11 16:37:17 +08:00
zhiqiang
2020-01-11 18:41:18 +08:00
@yixiang 非常感谢。这个好,除了不能完全控制宽度,基本就是我想要的效果。
loading
2020-01-11 18:45:13 +08:00
@zhiqiang 你要控制宽度只要 code:before, code:after 里面设置就行了。
wolfan
2020-01-11 19:59:36 +08:00
用 before,after,和用 margin: auto 4px; 不是一样的么?

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/637061

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX