我对代码的响应部分有问题。 在桌面上，我有一个部分，它从图像和平板电脑上的图像而不是文本。 我想在移动版的图像下制作图像而不是文字，我无法完成它。 我需要CSS帮助才能为移动设备做好准备。
这是代码：
<table class="table600" width="712" border="0" align="center" cellpadding="0" cellspacing="0">
<div id="slike">
<tr>
<td align="left">
<img src="img/img1.jpeg" class="img-responsive" width="330">
</td>
<td>
<p style="font-family: 'Open Sans', Myriad Pro, sans-serif; font-size:24px; color:#606060; line-height:28px;letter-spacing: 2px;">
Data security and erasure</p>
<p style="font-family: 'Open Sans', Lato, sans-serif; font-size:12px; color:#898989; line-height:18px;letter-spacing: 2px;">When a product comes into our possession our technicians start by wiping the hard drive(s) of any and all data. Thereafter, we install the latest operating system so that the product is ready to be used as soon as the new owner gets hold of it. As an extra service we offer to make a DOE 3-pass secure erase for a minor extra cost.</p>
</td>
</tr>
</div>
<div id="slike">
<tr>
<td>
<p style="font-family: 'Open Sans', Myriad Pro, sans-serif; font-size:24px; color:#606060; line-height:28px;letter-spacing: 2px;">
We do the logistic</p>
<p style="font-family: 'Open Sans', Lato, sans-serif; font-size:12px; color:#898989; line-height:18px;letter-spacing: 2px;">To make the sell process as smooth as possible for our customers we have decided to pay our customers postage fee. Once the devices is packed securely we book a collection using our standard logistic partner. The devices will be receiving an unique order number which you can follow during the whole process.</p>
</td>
<td align="right">
<img src="img/img2.jpeg" class="img-responsive" width="330">
</td>
</tr>
</div>
<div >
<tr id="slike">
<td align="left">
<img src="img/img3.jpeg" class="img-responsive" width="330">
</td>
<td>
<p style="font-family: 'Open Sans', Myriad Pro, sans-serif; font-size:24px; color:#606060; line-height:28px;letter-spacing: 2px;">
Eco-friendly and money saving</p>
<p style="font-family: 'Open Sans', Lato, sans-serif; font-size:12px; color:#898989; line-height:18px;letter-spacing: 2px;">Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet. Dolore magna aliquam erat volutpat. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet.
</p>
</td>
</tr>
</div>
</table>
答案 0 :(得分：0)
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<!--[if !mso]><!-->
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<!--<![endif]-->
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0;">
<title>Title</title>
<!--[if (gte mso 9)|(IE)]>
<style type="text/css">
table {border-collapse: collapse !important;}
</style>
<![endif]-->
</head>
<body style="Margin:0;padding-top:50px;padding-bottom:50px;padding-right:0;padding-left:0;min-width:100%;background-color:#ffffff;">
<center class="wrapper" style="width:100%;table-layout:fixed;">
<div class="webkit" style="max-width:640px;">
<table class="outer" align="center" style="border-spacing:0;font-family:sans-serif;color:#4A4A4A;margin:0 auto;width:100%;max-width:640px;">
<tr>
<td align="center" valign="top" style="border:1px solid #E5E5E5;">
<table border="0" cellpadding="0" cellspacing="0" width="100%" style="height:100%;">
<tr>
<td align="center" valign="top">
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td align="center" bgcolor="#FFFFFF" valign="top" width="100%" style="padding-left: 20px; padding-right: 20px;">
<!-- // 2 Collumns -->
<tr mc:hideable>
<td style="padding-top: 20px;padding-bottom: 60px;padding-right: 0px;padding-left: 0px;text-align:center;font-size:0;" class="two-column">
<!--[if (gte mso 9)|(IE)]>
<table width="100%" style="border-spacing:0;font-family:sans-serif;color:#4A4A4A;">
<tr>
<td width="50%" valign="top" style="padding-top:0;padding-bottom:0;padding-right:0;padding-left:0;">
<![endif]-->
<div style="width:100%;max-width: 200px;display:inline-block;vertical-align:top;" class="column">
<table width="100%" style="border-spacing:0;">
<tr>
<td style="padding-top:10px;padding-bottom:0;padding-right:10px;padding-left:10px;" class="inner">
<table style="border-spacing:0;width:100%;" class="contents">
<tr>
<td align="left" valign="top" style="padding-top: 10px;padding-bottom: 0;padding-right: 0;padding-left: 0;" width="200">
<img mc:edit="imagetip" width="160" align="absbottom" style="border-width:0;width:100%;max-width:180px;height:auto; display:block; float:right;Margin: 0 0 20px 0;font-size: 12px;" alt="Image tiltle" src="http://placehold.it/180x100">
</td>
</tr>
</table>
</td>
</tr>
</table>
</div>
<!--[if (gte mso 9)|(IE)]>
</td><td width="50%" valign="top" style="padding-top:0;padding-bottom:0;padding-right:0;padding-left:0;">
<![endif]-->
<div style="width:100%;max-width: 400px;display:inline-block;vertical-align:top;" class="column">
<table width="100%" style="border-spacing: 0;">
<tr>
<td style="padding-top:20px;padding-bottom:0;padding-right:10px;padding-left:10px;font-size:14px;text-align:left;" class="inner">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nisi dis neque nonummy semper. Rutrum ultricies libero natoque ornare habitasse leo: Libero ultrices faucibus tellus... Magnis placerat accumsan fermentum... Augue viverra montes dictumst luctus mi iaculis duis... Feugiat vivamus rhoncus fusce lobortis pede ultrices platea...
</td>
</tr>
</table>
</div>
<!--[if (gte mso 9)|(IE)]>
</td>
</tr>
</table>
<![endif]-->
</td>
</tr>
<!-- 2 Collumns \\ -->
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</div>
</center>
</body>
</html>