您现在的位置是:网站首页> 编程资料编程资料

单行图片文字垂直居中问题——实战_CSS教程_CSS_网页制作_

2023-11-03 108人已围观

简介 使用表格的方法来表现设计效果 <style type="text/css"> <!-- body{ font-size:12px; font-family:"宋体"; } table{ border:1px solid #E6EFF8; margin-bo




使用表格的方法来表现设计效果
  1. <styletype="text/css">style><tablewidth="380"cellspacing="0"><tr><tdwidth="80"class="name">遨游旅行网td><tdwidth="157"class="renovate">最后更新:1小时以前 <imgsrc="images/ico/ico_time_bak.gif"alt="time"width="12"height="12"/>td><tdwidth="56"class="money">368<strong>strong>td><tdwidth="77"><imgsrc="images/btn/btn_speak_for.gif"alt="订票"width="61"height="17"/>td>tr>table>

ie,ff显示效果

在表格中垂直显示是很容易实现的,但接下来用DIV的方法确不那么容易,因为在垂直居中问题DIV总是另人头疼的一个大问题
以下用DIV的方法模拟出上面表格的效果
  1. <styletype="text/css">style><divclass="simulate_table"><divclass="row"><divclass="col1"><spanclass="name">遨游旅行网span>div><divclass="col2"><spanclass="renovate">最后更新:1小时以前 <imgsrc="images/ico/ico_time_bak.gif"alt="
-六神源码网