Question

我有一个设计，我需要将一个日期选择器放在页面最左边的位置，然后将一个宽度为datepicker的表格放到网页末尾和500px的高度。 datepicker和，左边的表格空间我需要放置Hyperlinks.But我无法做到..无论是表格下降还是超链接..

这里我附上一张粗糙的照片，表示我的需要...... Div design

这是我在html中的代码..

//Datepicker 

<div id="datepicker" style="float:left;margin-left:5px;margin-top:20px;width:166px"></div>

//Hyperlink

<div style="float:left;margin-left:5px; margin-top:5px; width:166px">

    <label name="roomOperation" id="roomOperation" style="font-style:normal;margin-left:20px; 
                       font-size:14px;font-weight:bold;">Room Operation</label>

    </br>
    </br>

    <a href="#" onclick="addTab('google','http://www.google.com')">Check in List</a> 

    </br>
    </br>

    <a href="#" onclick="addTab('google','http://www.google.com')">Check out List</a> 


</div>

//dynamic tab table

<div id="tt" class="easyui-tabs" style="margin-left:200px; margin-top:5px;width:1024px;height:768px;">
    <div title="Home" style="padding:20px">
        <p>Click the above button to add a new tab panel.</p>
    </div>
</div>

请帮帮我..

提前致谢..

Answer 1

我在这里创建了示例代码，看看Demo

您可以使用Datepicker代替选择框。

<div style="width:20%;height:300px;float:left;border:1px solid">
    <select style="width:100%">
        <option>1</option>
        <option>1</option>
        <option>1</option>
    </select>
    <a href="#" style="display:block">link</a>
    <a href="#" style="display:block">link</a>
    <a href="#" style="display:block">link</a>
    <a href="#" style="display:block">link</a> 
    <a href="#" style="display:block">link</a>
    <a href="#" style="display:block">link</a> 
    <a href="#" style="display:block">link</a>
    <a href="#" style="display:block">link</a> 
</div>
<div style="width:79%;height:300px;float:left;border:1px solid">
    <table width="100%" border="1">
        <tr>
            <td>1</td>
            <td>1</td>
            <td>1</td>
        </tr>
        <tr>
            <td>1</td>
            <td>1</td>
            <td>1</td>
        </tr>
        <tr>
            <td>1</td>
            <td>1</td>
            <td>1</td>
        </tr>
        <tr>
            <td>1</td>
            <td>1</td>
            <td>1</td>
        </tr>
        <tr>
            <td>1</td>
            <td>1</td>
            <td>1</td>
        </tr>
        <tr>
            <td>1</td>
            <td>1</td>
            <td>1</td>
        </tr>
        <tr>
            <td>1</td>
            <td>1</td>
            <td>1</td>
        </tr>
        <tr>
            <td>1</td>
            <td>1</td>
            <td>1</td>
        </tr>
    </table>
</div>

在div中放置Datepicker，Table和HyperLinks

1 个答案: