簡體   English   中英

如何使用html根據表內容增加圖像大小?

[英]How to increase image size based on table contents using html?

我已經創建了一個表,再次創建了一個表,但是該表是在第一個表的內部創建的。

第一張桌子:我添加了一張圖片。 第二張表:我寫了一些內容。

內容很大,因此第二張桌子增加了,但第一張桌子和圖像沒有增加。因此如何增加圖像尺寸。

我使用以下代碼:

<html>
   <head>
    <style type="text/css">
        body {
            font-family: Calibri;
        }


        table tr {
            border: none;
        }

        a, a:link, a:visited, a:active {
            text-decoration: none;
            color: #09B0CE;
        }

         img {
            border: none;
            width: 100%;
            height: auto;
        }
      </style>
   </head>

     <body>
                    <table cellspacing="1"  cellpadding="0" align="center" id="main-panel"     style="width: 100%; background-color:#f2f2f2; color: rgb(75, 75, 75); border-collapse: collapse; border: 1px solid #f2f2f2;">
        <tbody>
            <tr>

                <td >
                    <table  align="center" width="640px" style="width: 640px; padding: 2px 0px 2px 0px; background-color: #17B8DD">
                        <tbody>
                            <tr>
                                <td style="width:100%;">
                                    <table>
                                        <tr>
                                            <td width="85%" style="padding-top:10px">
                                                <a href="http://www.s.com">
                                                <img src="http://KB/logo.png" alt="S.INC style="height:auto; width:auto" sizes="80vw"/>
                                                </a>
                                            </td>
                                        </tr>
                                    </table>
                                </td>
                            </tr>
                        </tbody>
                    </table>
                </td>
            </tr>
 <tr>
                <td style="padding: 0px 0px 0px 0px;">

                    <table style="color: #4D4D4D; font-size: 14px; font-weight: normal; width: 100%; border:1px solid #cccccc; padding: 10px 0px 10px 20px;" border="1px" cellspacing="2" cellpadding="3">
                        <tbody>
                            <tr style="padding: 10px 10px 5px 10px;">
                                <th style="width: 32%">Control</th>
                                <th style="width: 36%">Test Case Name</th>
                                <th style="width: 32%">Status</th>
                            </tr>

                           <tr style="padding: 10px 10px 5px 10px;">
                                <th style="width: 32%">EnterpriseServer</th>
                                <th style="width: 36%">AddPasswordForDataSource_ValidDataSourceIdAndPassword_PasswordAddedInDataSourceDetail</th>
                            <th style="width: 32%">Failed</th>
                            </tr>
                        </tbody>
                    </table>
                </td>
            </tr>

         </tbody>
         </table>

嘗試這個

<table cellspacing="1" cellpadding="0" align="center" id="main-panel" style="width: 100%; background-color:#f2f2f2; color: rgb(75, 75, 75); border-collapse: collapse; border: 1px solid #f2f2f2;">
    <tbody>
        <tr>

            <td>
                <table align="center" width="" style="width:100% ; padding: 2px 0px 2px 0px; background-color: #17B8DD">
                    <tbody>
                        <tr>
                            <td style="width:100%;">
                                <table>
                                    <tbody><tr>
                                        <td width="" style="padding-top:10px">
                                            <a href="http://www.s.com">
                                            <img src="http://dakhal.net/Archieves/2/image/news_image_98.jpeg" alt="S.INC style=" width="100%">
                                            </a>
                                        </td>
                                    </tr>
                                </tbody></table>
                            </td>
                        </tr>
                    </tbody>
                </table>
            </td>
        </tr> <tr> <td style="padding: 0px 0px 0px 0px;">

                <table style="color: #4D4D4D; font-size: 14px; font-weight: normal; width: 100%; border:1px solid #cccccc; padding: 10px 0px 10px 20px;" border="1px" cellspacing="2" cellpadding="3">
                    <tbody>
                        <tr style="padding: 10px 10px 5px 10px;">
                            <th style="width: 32%">Control</th>
                            <th style="width: 36%">Test Case Name</th>
                            <th style="width: 32%">Status</th>
                        </tr>                      <tr style="padding: 10px 10px 5px 10px;">
                            <th style="width: 32%">EnterpriseServer</th>
                            <th style="width: 36%">AddPasswordForDataSource_ValidDataSourceIdAndPassword_PasswordAddedInDataSourceDetail</th>
                        <th style="width: 32%">Failed</th>
                        </tr>
                    </tbody>
                </table>
            </td>
        </tr>

     </tbody>
     </table>

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM