我正在使用 Tumlbr，希望删除每个帖子两侧的缩进。我希望博客文章的宽度为 100%。提前致谢。我正在编辑的网站的网址是 http://jarroldtheme.tumblr.com .
<!DOCTYPE html>
<html>
<head>
<title>{title}</title>
<link rel="shortcut icon" href="{Favicon}">
<link rel="alternate" type="application/rss+xml" href="{RSS}">
{block:Description}
<meta name="description" content="{MetaDescription}" />
{/block:Description}
<style>
header h1 {
color: {TitleColor};
font-family: {TitleFont};
font-weight: {TitleFontWeight};
text-align: center;
font-size: 35px;
padding-top: 20px;
padding-bottom: 4px;
}
header p {
color: black;
font-family: helvetica;
text-align: center;
font-size: 18px;
}
header a {
color: {TitleColor};
text-decoration: none;
}
.page {
text-align: center;
padding-top: 25px;
}
.page a {
text-decoration: none;
border-bottom: 1px solid #000;
font-size: 16px;
margin-left: 5px;
margin-right: 5px;
padding-bottom: 3px;
}
body {
background: {BackgroundColor};
font-family: helvetica;
}
.post {
text-align: center;
padding-top: 45px;
padding-bottom: 45px;
list-style: none;
}
.link-post {
background: #000;
}
.like-reblog {
list-style: none;
}
.like-reblog li {
float: right;
padding: 6px;
}
.quote-source {
padding:20px;
font-style: italic;
}
form {
text-align: center;
}
.sfm input {background-color: #f5f5f5;
font-size: 9px;
border: 0px;
text-transform: lowercase;
margin-top: 0px;
color: #999;
letter-spacing: 1px;
padding: 4px 8px;
font-family: helvetica, arial;}
input[type="submit"] {
background: #900000;
color: white;
}
</style>
</head>
<body>
<header>
{block:haspages}
<div class="page">
{block:pages}
<a href="{URL}">{Label}</a>
{/block:pages}
</div>
{/block:haspages}
<h1><a href="{BlogURL}">{title}</a></h1>
{block:Description}
<p>{Description}</p>
{/block:Description}
<form action="/search" method="get" class="sfm">
<input type="text" name="q" value="{SearchQuery}" id="sf"/>
<input type="submit" value="Search" id="sb"/>
</form>
</header>
<ol>
{block:Posts}{block:Text}
<div class="post">
<li>
{block:Title}
<h3><a href="{Permalink}">{Title}</a></h3>
{/block:Title}{Body}
</li>
<ul class="like-reblog">
<li>{block:NoteCount}<a href="{Permalink}#notes">{NoteCountWithLabel}</a>{/block:NoteCount}</li><li>{likebutton}</li><li>{reblogbutton}</li>
</ul>
</div>
{/block:Text}{block:Photo}
<div class="post">
<li>
<img src="{PhotoURL-500}" alt="{PhotoAlt}"/>
{block:Caption}
{Caption}
{/block:Caption}
</li>
<ul class="like-reblog">
<li>{block:NoteCount}<a href="{Permalink}#notes">{NoteCountWithLabel}</a>{/block:NoteCount}</li><li>{likebutton}</li><li>{reblogbutton}</li>
</ul>
</div>
{/block:Photo}{block:Panorama}
<div class="post">
<li>
{LinkOpenTag}
<img src="{PhotoURL-Panorama}" alt="{PhotoAlt}"/>
{LinkCloseTag}{block:Caption}
{Caption}
{/block:Caption}
</li>
<ul class="like-reblog">
<li>{block:NoteCount}<a href="{Permalink}#notes">{NoteCountWithLabel}</a>{/block:NoteCount}</li><li>{likebutton}</li><li>{reblogbutton}</li>
</ul>
</div>
{/block:Panorama}{block:Photoset}
<div class="post">
<li>
{Photoset-500}{block:Caption}
{Caption}
{/block:Caption}
</li>
<ul class="like-reblog">
<li>{block:NoteCount}<a href="{Permalink}#notes">{NoteCountWithLabel}</a>{/block:NoteCount}</li><li>{likebutton}</li><li>{reblogbutton}</li>
</ul>
</div>
{/block:Photoset}{block:Quote}
<div class="post">
<li>
"{Quote}"
{block:Source}
<div class="quote-source">{Source}</div>
{/block:Source}
</li>
<ul class="like-reblog">
<li>{block:NoteCount}<a href="{Permalink}#notes">{NoteCountWithLabel}</a>{/block:NoteCount}</li><li>{likebutton}</li><li>{reblogbutton}</li>
</ul>
</div>
{/block:Quote}{block:Link}
<div class="post">
<div class="link-post">
<li>
<a href="{URL}" class="link" {Target}>{Name}</a>
{block:Description}
{Description}
{/block:Description}
</li>
</div>
<ul class="like-reblog">
<li>{block:NoteCount}<a href="{Permalink}#notes">{NoteCountWithLabel}</a>{/block:NoteCount}</li><li>{likebutton}</li><li>{reblogbutton}</li>
</ul>
</div>
{/block:Link}{block:Chat}
<div class="post">
<li>
{block:Title}
<h3><a href="{Permalink}">{Title}</a></h3>
{/block:Title}
<ul>
{block:Lines}
<li class="{Alt} user_{UserNumber}">
{block:Label}
<span>{Label}</span>
{/block:Label}{Line}
</li>
{/block:Lines}
</ul>
</li>
<ul class="like-reblog">
<li>{block:NoteCount}<a href="{Permalink}#notes">{NoteCountWithLabel}</a>{/block:NoteCount}</li><li>{likebutton}</li><li>{reblogbutton}</li>
</ul>
</div>
{/block:Chat}{block:Video}
<div class="post">
<li>
{Video-500}{block:Caption}
{Caption}
{/block:Caption}
</li>
<ul class="like-reblog">
<li>{block:NoteCount}<a href="{Permalink}#notes">{NoteCountWithLabel}</a>{/block:NoteCount}</li><li>{likebutton}</li><li>{reblogbutton}</li>
</ul>
</div>
{/block:Video}{block:Audio}
<div class="post">
<li>
{AudioEmbed}{block:Caption}
{Caption}
{/block:Caption}
</li>
<ul class="like-reblog">
<li>{block:NoteCount}<a href="{Permalink}#notes">{NoteCountWithLabel}</a>{/block:NoteCount}</li><li>{likebutton}</li><li>{reblogbutton}</li>
</ul>
</div>
{/block:Audio}
{/block:Posts}
</ol>
</body>
</html>
最佳答案
如果您的意思是您正在尝试让具有帖子 ID 的元素一直移动到每一侧，您可以尝试将有序列表的填充设置为 0。使用 Chrome 开发工具对其进行了检查。
`ol{padding: 0;}`
我还建议使用 css 重置来删除浏览器默认样式，如 normalize.css .他们真的帮了很多忙
编辑:要将黑框一直移动到上方，您可以将主体的边距在左右两侧都设置为 0:
body{margin:auto 0;}
CSS 重置可以帮助您避免做这一切 ^.^
关于html - 如何删除每篇博文两边的缩进？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/35116321/