HTML中CSS表上h1和p标记的对齐方式

Question

我正在尝试调整我的＆＃34; h1＆＃34;标签和＆＃34; p＆＃34;两个都在标签周围的标签。我试图只将那些与我居中的图像对齐。我试图只在CSS表上执行此操作，而不是在HTML文件本身上执行此操作。任何帮助将不胜感激！

＆＃13;

＆＃13;

img {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

h1 {
  text-align: left;
  color: gray;
}

h1 i {
  color: black;
  text-align: center;
}

p i {
  text-align: center;
}

body {
  background-color: white;
}

p {
  text-align: left;
  padding-right: 80%;
}

p::first-letter {
  font-size: 150%;
  font-style: bold;
}

＆＃13;

<h1><i>The Charge of the Light Brigade</i></h1>
<img src="http://i.imgur.com/FSXhJNy.jpg" title="source: imgur.com" />
<p><i>By Tennyson</i></p>
<h1>I.</h1>
<p>Half a league, half a league, Half a league onward, All in the valley of Death Rode the six hundred. 'Forward, the Light Brigade!' 'Charge for the guns!' he said: Into the valley of Death Rode the six hundred.</p>
<h1>II.</h1>
<p>'Forward, the Light Brigade!' Was there a man dismay'd? Not tho' the soldier knew Some one had blunder'd: Their's not to make reply, Their's not to reason why, Their's but to do and die: Into the valley of Death Rode the six hundred.</p>
<h1>III.</h1>

＆＃13;

＆＃13;

＆＃13;

Answer 1

您可以尝试此代码

＆＃13;

＆＃13;

img {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

h1 {
  text-align: left;
  color: gray;
}

p i {
  position: absolute;
  left: 50%;
}

body {
  background-color: white;
}

p {
  text-align: left;
  padding-right: 80%;
}

p::first-letter {
  font-size: 150%;
  font-style: bold;
}

.center{
	color: black;
    margin-left: 25%;
    font-size: 39px;
}

＆＃13;

<div class="center">
		The Charge of the Light Brigade
	</div>

	
	<img src="http://i.imgur.com/FSXhJNy.jpg" title="source: imgur.com" />
	<p>
		<i>By Tennyson</i>
	</p>
	
	<h1>I.</h1>
	
	<p>Half a league, half a league, Half a league onward, All in the valley of Death Rode the six hundred. 'Forward, the Light Brigade!' 'Charge for the guns!' he said: Into the valley of Death Rode the six hundred.</p>
	
	<h1>II.</h1>
	
	<p>'Forward, the Light Brigade!' Was there a man dismay'd? Not tho' the soldier knew Some one had blunder'd: Their's not to make reply, Their's not to reason why, Their's but to do and die: Into the valley of Death Rode the six hundred.</p>
	
	<h1>III.</h1>

＆＃13;

＆＃13;

＆＃13;