方法有很多种，是我就采用以下几种方式之一：
方式一：table布局
这种左右分别对齐的排版，第一反应用table。我知道肯定有人开始鄙视我，说什么年代了还在用table。但是，我想说的是table也是标准标签之一，把标签用在合适的地方，就是对标签最优的利用，不是吗?
*{margin: 0
padding: 0
}
.personName{
text-transform: uppercase
} <table>
<tr>
<td valign="top">
<span class="personName">Georage：</span>
</td>
<td valign="top">
<p>This is a good day.</p>
<p>This is a good day.</p>
</td>
</tr>
<tr>
<td valign="top">
<span class="personName">Ken：</span>
</td>
<td valign="top">
<p>This is a good day.</p>
<p>This is a good day.</p>
</td>
</tr>
</table>
方式二：利用dl标签
*{margin: 0
padding: 0
}
.personName{
text-transform: uppercase
float: left
width: 80px
clear: left /* 清除左浮动 */
}
.words{
float: left
}
.dailog{
overflow: hidden /* 可以清除浮动 */
margin-bottom: 20px
line-height: 24px
font-size: 14px
}
<dl class="dailog">
<dt class="personName">
Georage:
</dt>
<dd class="words">
<p>This is a good day.</p>
<p>This is a good day.</p>
</dd>
<dt class="personName">
Ken:
</dt>
<dd class="words">
<p>This is a good day.</p>
<p>This is a good day.</p>
</dd>
</dl>
方式三：可以利用 ul 或者 ol 标签，方法类似 方式二。
方式四：可以全用div，具体也类似方式二，这里就不罗列了。
一些详细的样式就不写了，这里只写了主要的样式，仅供参考。
1、定义不同
（1）HTML（结构）：全称Hyper Text Markup Language（超文本标记语言），该语言是用于定义文档内容结构。
（2）CSS（布局）：全称Cascading Style Sheets （层叠样式表）。
2、性质不同
HTML是网页的结构，CSS是网页的样式。例如如果把整个网页比喻成一个人，那么HTML就是骨头，CSS就是衣服。
2、功能不同
HTML功能：
（1）该语言写的代码通常会被浏览器解析执行.
（2）超文本：不止包括文本，还有图片、链接、音乐。
（3）一个页面就是一篇文档，而一篇文档最核心的就是内容，不同含义。
CSS功能：
（1）用于定义HTML文档的样式（外观）。
（2）页面表现的基础，可以控制布局，控制元素的渲染。
4、格式不同
（1）HTML注释格式：<!--注释内容-->
（2）CSS注释格式：/*注释内容*/
参考资料来源：百度百科—HTML
参考资料来源：百度百科—CSS
