【问题标题】:html or css to adjust and format the width of a blog posthtml 或 css 来调整和格式化博客文章的宽度
【发布时间】:2018-06-04 15:28:15
【问题描述】:

我的网站上的代码有些困难。现在,我的博客文章文本跨越了内容页面的整个宽度并居中。

我希望文本左对齐,每边有相等的边距,并使博客内容的宽度更窄,这样每行的字符更少..就像这样example blog post

我希望每篇博文都采用相同的格式,但我尝试的所有方法似乎都不起作用?我不确定我应该更改或添加什么 css/html。我已经尝试过调整框大小、调整边距以及调整边距,但它没有给我我正在寻找的结果,我不确定要采取什么步骤。任何帮助,将不胜感激。

谢谢!

【问题讨论】:

  • 请添加您尝试过的代码。

标签: html css


【解决方案1】:

您应该创建新的<div id="test"> 元素并将您的文本放入其中。为该 div 添加以下 CSS:

#test{
width: 680px; /* adding width of text field */
margin: 0 auto; /* centering it */
text-align: left; /* aligning text to left side */

font-size: 15px; /* size of your font */
line-height: 24px; /* space between two lines */
letter-spacing: -0.01em; /* space between two letters */
/* By playing with values of last 3 lines you can make text look exactly how you want, I tried to mimic site that you posted as much as I could (I c/p-ed their CSS for text) */
}

【讨论】:

  • 非常感谢您对我的帮助!它工作得很好。对此,我真的非常感激。我需要了解更多,这对我来说真的很清楚。
【解决方案2】:

您可以为此使用 Bootstrap 类。它真的会帮助你很多。 它的容器类会给你相等的边距 (您可以在此处查看示例https://getbootstrap.com/docs/4.0/layout/overview/

它的网格类将帮助您设置左右部分(参见链接https://getbootstrap.com/docs/4.0/layout/grid/)。

希望这会对你有所帮助。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2020-12-06
    • 2020-10-12
    • 2012-04-12
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2014-02-04
    • 1970-01-01
    相关资源
    最近更新 更多