Html 經典例子 縮進 表格縮進


<html><head>
        <title>Quick Start Guide: WLAN Guest Connection</title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

        <style type="text/css">
            p {
                font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
                font-size: x-small;
                font-style: normal;
                text-indent: 2em;
            }
            w {
                font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
                font-size: x-small;
                font-style: normal;
}
            li {
                font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
                font-size: x-small;
                font-style: normal;
                line-height: normal;
                padding: 8px;
            }
            td {
                font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
                font-size: x-small;
                font-style: normal;
                vertical-align: top;
                text-align: left;
            }
            th {
                font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
                font-size: x-small;
                font-style: bold;
                color: #000000;
                vertical-align: top;
                text-align: left;
            }
            .bg_black-white {
                font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
                font-size: x-small;
                font-style: normal;
                font-weight: bold;
                color: #FFFFFF;
                background-color: #000000;
                vertical-align: top;
                text-align: left;
                font-weight: bold;
            }
            .bg_gray-white {
                font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
                font-size: x-small;
                font-style: normal;
                font-weight: bold;
                color: #FFFFFF;
                background-color: #CCCCCC;
                vertical-align: top;
                text-align: left;
                font-weight: bold;
            }
            .bg_light-gray {
                font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
                font-size: x-small;
                font-style: normal;
                font-weight: bold;
                color: #000000;
                background-color: #CCCCCC;
                vertical-align: top;
                text-align: left;
                font-weight: bold;
            }
            .bg_darkgray-white {
                font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
                font-size: x-small;
                font-style: normal;
                font-weight: bold;
                color: #FFFFFF;
                background-color: #888888;
                vertical-align: top;
                text-align: left;
                font-weight: bold;
            }
            .bg_alternate01 {
                font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
                font-size: x-small;
                font-style: normal;
                font-weight: bold;
                color: #000000;
                background-color: #FFCC77;
                vertical-align: top;
                text-align: left;
                font-weight: bold;
            }
            h1 {
                font-family: Georgia, "Times New Roman", Times, serif;
                font-size: large;
                font-style: normal;
                font-weight: bold;
                color: #666666;
            }
            h2 {
                font-family: Verdana, Arial, Helvetica, sans-serif;
                font-size: small;
                font-style: normal;
                font-weight: bolder;
                color: #990066;
                border-top: thin dotted #990033;
                border-right: thin none #990033;
                border-bottom: thin none #990033;
                border-left: thin none #990033;
                padding-top: 12px;
                padding-right: 0px;
                padding-bottom: 6px;
                padding-left: 0px;
            }
            .boilerplate {
                font-family: Verdana, Arial, Helvetica, sans-serif;
                font-size: xx-small;
                font-style: normal;
                font-weight: normal;
                color: #999999;
                text-align: center;
                border: none;
            }
            h3 {
                font-family: Georgia, "Times New Roman", Times, serif;
                font-size: small;
                font-style: italic;
                font-weight: bold;
                color: #336633;
            }
            .text {
                font-family: Arial, Helvetica, sans-serif;
                font-size: x-small;
                font-style: normal;
                font-weight: bold;
                color: #FFFFFF;
                background-color: #CC0000;
                vertical-align: top;
                text-align: left;
                font-weight: bold;
           }
            </style>
    <style type="text/css">
    table.gridtable {
        font-family: verdana,arial,sans-serif;
        font-size:11px;
        color:#333333;
        border-width: 1px;
        border-color: #666666;
        border-collapse: collapse;
    }
    table.gridtable th {
        border-width: 1px;
        padding: 6px;
        border-style: solid;
        border-color: #666666;
        background-color: #dedede;
    }
    table.gridtable td {
        border-width: 1px;
        padding: 10px;
        border-style: solid;
        border-color: #666666;
        background-color: #ffffff;
    }
    </style>
    </head>
    <body>


    <w>Dear <strong>%s</strong>, </w>
    <p>Your application of ASM-Guest has been granted as below details, thanks.</p>
    <!-- Table goes in the document BODY -->
    <table class="gridtable" style="margin-left:2em">
    <tr>
        <th>User</th><th>Workplace</th><th>Key</th><th>Max devices</th><th>Begin date</th><th>End date</th><th>Reason</th>
    </tr>
    <tr>
        <td>%s</td><td>ALG</td><td>%s</td><td>%s</td><td>%s</td><td>%s</td><td>%s</td>
    </tr>
    </table>

    <h2>How to connect</h2>
    <w>Using your guest pass to connect requires a series of two procedures:
     (1) connecting your device to the "ASMPT-Guest" network, then (2) logging
     in as a qualified guest.</w>
    <h3>Finding the Wireless "ASMPT-Guest" Network</h3>
    <table border="0" cellpadding="6" cellspacing="1">
        <tbody><tr>
            <td class="bg_alternate01">&nbsp;1&nbsp;</td>
            <td>On your PC/Windows desktop, check the system tray for a Wireless Connection icon.</td>
        </tr>
        <tr>
            <td class="bg_alternate01">&nbsp;2&nbsp;</td>
            <td>Click on this icon to display the wireless connection list</td>
        </tr>
        <tr>
            <td class="bg_light-gray">&nbsp;</td>
            <td>"ASMPT-Guest" signal will be listed in the wireless connection list</td>
        </tr>
        <tr>
            <td class="bg_alternate01">&nbsp;3&nbsp;</td>
            <td>Select "ASMPT-Guest" and click <b>Connect</b>.</td>
        </tr>
        <tr>
            <td class="bg_alternate01">&nbsp;4&nbsp;</td>
            <td>If a Wireless Network Connection confirmation dialog box asks you to confirm "connecting to an unsecured network", click <b>Connect Anyway</b>.</td>
        </tr>
        <tr>
            <td class="bg_light-gray">&nbsp;</td>
            <td>A connection status dialog may appear, while a network address is obtained and initial connection established.</td>
        </tr>
        <tr>
            <td class="bg_alternate01">&nbsp;5&nbsp;</td>
            <td>If the Wireless Network Connection window displays <b>"Connected"</b>, you can close this window and proceed to the next procedure.</td>
        </tr>
    </tbody></table>
    <h3>Logging into the Network as a Guest</h3>
    <table border="0" cellpadding="6" cellspacing="1">
        <tbody><tr>
            <td class="bg_alternate01">&nbsp;1&nbsp;</td>
            <td>Start a web browser and try to connect to any valid Internet site.</td>
        </tr>
        <tr>
            <td class="bg_alternate01">&nbsp;2&nbsp;</td>
            <td>If a security warning for the Subscriber Portal page appears, trust the Subscriber Portal site and do all the actions that are required to continue browsing</td>
        </tr>
        <tr>
            <td class="bg_light-gray">&nbsp;</td>
            <td>The Subscriber Portal "Sign In" page appears.</td>
        </tr>
        <tr>
            <td class="bg_alternate01">&nbsp;3&nbsp;</td>
            <td>At the <b>Guest Pass</b> text box, enter the text of your guest pass key (by typing or pasting), read the <b>Terms of Use</b> section, check <b>Accept Terms of Use</b> and click <b>Sign In</b>.</td>
        </tr>
        <tr>
            <td class="bg_light-gray">&nbsp;</td>
            <td>The guest wireless network "Sign Out" page appears and indicates that you are now signed in to the Subscriber Portal.</td>
        </tr>
        <tr>
            <td class="bg_alternate01">&nbsp;4&nbsp;</td>
            <td>If the page you tried to open is not displayed, use the browser's popup blocker to display it.</td>
        </tr>
        <tr>
            <td class="bg_alternate01">&nbsp;5&nbsp;</td>
            <td>You can now check your personal email and browse the Web.</td>
        </tr>
        <tr>
            <td class="bg_alternate01">&nbsp;6&nbsp;</td>
            <td>When you finish browsing, click on <b>Sign Out</b> at the Sign Out page.</td>
        </tr>
    </tbody></table>
    <h2>Important</h2>
    <w>With a guest pass, you have access to the internet and World Wide
    web, but you cannot use any services such as file sharing, intranets,
    corporate email or printers.  If these services are needed, you can turn to SOG team for help to set you up with
    full user access to the secure network.</w>
    <hr>

    </body></html>

html語法:

空白行:</br>

文本縮進: text-indent:2em;  ##其中2em為兩個字符

  1、<style type="text/css"> p { font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; font-size: x-small; font-style: normal; text-indent: 2em; }

  2、<h2 style="margin-left:2em">

表格縮進:margin-left:2em

  1、<table class="gridtable" style="margin-left:2em">


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM