HTML頁面布局-創(chuàng)新互聯(lián)

1.table布局：通過table元素將頁面空間劃分成若干個(gè)單元格，將文字或圖片等元素放入單元格中，隱藏表格邊框，實(shí)現(xiàn)布局。也叫傳統(tǒng)布局，主要用于廣告郵件的頁面，不是主流。

成都創(chuàng)新互聯(lián)公司主營涼城網(wǎng)站建設(shè)的網(wǎng)絡(luò)公司,主營網(wǎng)站建設(shè)方案,重慶APP開發(fā),涼城h5小程序定制開發(fā)搭建,涼城網(wǎng)站營銷推廣歡迎涼城等地區(qū)企業(yè)咨詢

（1）按照設(shè)計(jì)圖的尺寸設(shè)置表格的寬高以及單元格的寬高

（2）將表格border，cellpadding，cellspacing全設(shè)置為0，表格的邊框和間距就不占頁面空間，它只起到劃分空間的作用。

（3）針對(duì)局部復(fù)雜的布局，可以在單元格里面嵌套表格，嵌套表格劃分局部的空間。

（4）單元格中的元素或者嵌套的表格用align和valign設(shè)置對(duì)齊方式

（5）通過屬性或者CSS樣式設(shè)置單元格中元素的樣式

<body topmargin="0">

<table width="800" height="800" border="1" cellpadding="0" cellspacing="0" align="center">
    <tr>
        <td width="260" valign="top" bgcolor="#F2F2F2">

            <table width="200" border="0" align="center">

                <tr><td height="100"></td></tr>
                <tr>
                    <td align="center"><img src="image/路飛1.jpg" alt="證件照"></td>
                </tr>
                <tr>
                    <td align="right">小小雄</td>
                </tr>
                <tr>
                    <td align="right">13621553248</td>
                </tr>
                <tr>
                    <td align="right">126421@qq.com</td>
                </tr>
            </table>
        </td>
        <td width="30"></td>
        <td width="480" valign="top">

            <table width="480" border="0" cellpadding="0" cellspacing="0" >
                <tr>
                    <td height="80"></td>
                </tr>
                <tr>
                    <td align="right"><img src="image/簡(jiǎn)歷圖標(biāo).jpg" alt="標(biāo)題"></td>
                </tr>

            </table >
            <br />
                <hr />
            <table width="480" height="200" border="0" cellpadding="0" cellspacing="0">
                <tr>
                    <td colspan="2"><b>個(gè)人基本情況</b></td>

                </tr>
                <tr>
                    <td><b>姓名：</b>小熊熊</td>
                    <td><b>性別：</b>男</td>
                </tr>
                <tr>
                    <td><b>籍貫：</b>撒哈拉</td>
                    <td><b>民族：</b>亞特蘭蒂斯</td>
                </tr>
                <tr>
                    <td><b>電話：</b>13597894221</td>
                    <td><b>地址：</b>大荒漠</td>
                </tr>
                <tr>
                    <td><b>身高：</b>200cm</td>
                    <td><b>體重：</b>100kg</td>
                </tr>
                <tr>
                    <td><b>愛好：</b>打獵</td>
                    <td><b>個(gè)性：</b>調(diào)皮</td>
                </tr>
            </table>

            <br />

            <table width="480" height="100" border="0" cellpadding="0" cellspacing="0">
                <tr>
                    <td><b>教育基本情況</b></td>
                </tr>
                <tr>
                    <td>2000-2010：騎射劍</td>
                </tr>
                <tr>
                    <td>2011-2018：琴書畫</td>
                </tr>
            </table>

            <br />

            <table width="480" height="100" border="0" cellpadding="0" cellspacing="0">
                <tr>
                    <td><b>所獲證書</b></td>
                </tr>
                <tr>
                    <td>2005年黃金騎士</td>
                </tr>
                <tr>
                    <td>2016詩仙</td>
                </tr>
            </table>
        </td>
        <td width="30"></td>
    </tr>
</table>

</body>

HTML頁面布局

2.HTML+CSS布局（DIV+CSS）:主要通過CSS樣式設(shè)置來布局文字或圖片等元素，需要用到CSS盒子模型，盒子類型，CSS浮動(dòng)，CSS定位，CSS背景圖定位等知識(shí)來布局，主流布局。

另外有需要云服務(wù)器可以了解下創(chuàng)新互聯(lián)scvps.cn，海內(nèi)外云服務(wù)器15元起步，三天無理由+7*72小時(shí)售后在線，公司持有idc許可證，提供“云服務(wù)器、裸金屬服務(wù)器、高防服務(wù)器、香港服務(wù)器、美國服務(wù)器、虛擬主機(jī)、免備案服務(wù)器”等云主機(jī)租用服務(wù)以及企業(yè)上云的綜合解決方案，具有“安全穩(wěn)定、簡(jiǎn)單易用、服務(wù)可用性高、性價(jià)比高”等特點(diǎn)與優(yōu)勢(shì)，專為企業(yè)上云打造定制，能夠滿足用戶豐富、多元化的應(yīng)用場(chǎng)景需求。

當(dāng)前文章：HTML頁面布局-創(chuàng)新互聯(lián)
瀏覽地址：http://muchs.cn/article48/cdopep.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供品牌網(wǎng)站設(shè)計(jì)、營銷型網(wǎng)站建設(shè)、網(wǎng)站設(shè)計(jì)、標(biāo)簽優(yōu)化、網(wǎng)站導(dǎo)航、搜索引擎優(yōu)化

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來源： 創(chuàng)新互聯(lián)

成都網(wǎng)站建設(shè)