text-align
决定了整个容器里元素的排版方式
而
vertical-align
属性是设置元素的
垂直对齐
方式。
说明
该属性定义行内元素的基线相对于该元素所在行的基线的垂直对齐。允许指定负长度值和百分比值。这会使元素降低而不是升高。在表单元格中，这个属性会设置单元格框中的单元格内容的对齐方式。
也就是说这两个属性的目标是不一样的，<p></p>以及其他父类容器假如定义了text-align属性，那这些容器内的子元素都按照这个排版方式来进行排版，而vertical-align只是影响设置了这个属性的元素。
其实CSS你要去看具体的属性有什么特性才能了解具体的内容
建议去
http://www.w3school.com.cn/
看看
</style>
#content
{
width:422px
height:180px
border-bottom:1px dashed #96c5ef
}
img{
border:2px solid #ca0000
float:left
}
.left{
float:left
vertical-align:middle
}
.right{
float:right
width:230px
font:12px
}
</style>
</head>
<body>
<div id="content">
<div class="left">
<img src="images/1.jpg"
<!--这里是我改动的地方-->
align="absmiddle">
<!--这里是我改动的地方-->
最新资讯
</div>
<div class="right">
<ul>
<li><a href="#">A股恐慌式跳水重挫3.68% 大盘跌回 </a></li>
<li><a href="#">股指缓慢企稳 黄金板块逆市上涨 </a></li>
<li><a href="#">港股后市堪忧 韩国股市暂停交易 </a></li>
<li><a href="#">中国万亿美债或面临缩水</a></li>
<li><a href="#">日经指数收低</a></li>
<li><a href="#">七国集团发联合声明称将保证金融 </a></li>
<li><a href="#">标普或再降美信用评级 </a></li>
</ul>
</div>
</div>
</body>
</html>
最终的图片
img是内联元素，p标签是块级元素，所以p标签内的文字换行很正常。strong标签是内联元素，所以会跟img处于同一行，想要img跟strong中的文字垂直居中对齐，需要设置img的vertical-align为middle。
