Asp.net 在aspx页面中显示css样式

我有一个apsx页面，在该页面中我有两个按钮叫做save和cancel，我需要用一些css样式来显示它，我的脚本是

<table>
<tr>
    <td align="right" class="bar">
        <table>
            <tr>
                <td>
                    <asp:Button ID="btnSave" runat="server" Text="Save"/>
                </td>
                <td>
                    <asp:Button ID="btnCancel" runat="server" Text="Cancel" />
                </td>
            </tr>
        </table>
    </td>
</tr>   

.bar
{
background-position: center;
border-width: 1px;
border-color: #CCCCCC;
vertical-align: middle;
height: 30px;
border-top-style: solid;
}

我得到的样式是

在这些“保存”和“取消”按钮上方，我没有更多的控件……问题是，这种带有条形样式的“保存”和“取消”按钮正好位于它们上方的控件之后

现在这些按钮显示在页面的中心，我需要在页面底部以条形样式显示这些“保存”和“取消”按钮……我该怎么做

---

注意：我将位置设置为：绝对，它会干扰其他表单中的对齐，因为我在所有表单中使用相同的条形图样式……在其他表单中，我有填充页面的控件，自动保存取消按钮位于底部，但这里我只有4个控件……因此保存和取消按钮位于中间，这就是我试图在按钮上显示的内容m

您的问题不清楚，我得到了什么您想移动页面底部的按钮：

<div class="bottomBar">
<table>
<tr>
    <td align="right" class="bar">
        <table>
            <tr>
                <td>
                    <asp:Button ID="btnSave" runat="server" Text="Save"/>
                </td>
                <td>
                    <asp:Button ID="btnCancel" runat="server" Text="Cancel" />
                </td>
            </tr>
        </table>
    </td>
</tr>
</div>

---

您的问题不清楚，我得到了什么您想移动页面底部的按钮：

<div class="bottomBar">
<table>
<tr>
    <td align="right" class="bar">
        <table>
            <tr>
                <td>
                    <asp:Button ID="btnSave" runat="server" Text="Save"/>
                </td>
                <td>
                    <asp:Button ID="btnCancel" runat="server" Text="Cancel" />
                </td>
            </tr>
        </table>
    </td>
</tr>
</div>

---

将这两行添加到.bar：

.bar
{
position:absolute;
bottom:0;
/* the rest of your code */
}

---

将这两行添加到.bar：

.bar
{
position:absolute;
bottom:0;
/* the rest of your code */
}

---

您好，现在您可以在css中定义table align right和two class create，如下所示 Css

HTML

---

现场演示

您好，现在您可以在css中定义table align right和two class create，如下所示 Css

HTML

---

现场演示

以下是JSFIDLE中的解决方案：

首先，丢掉桌子

<div id="content">
    Hello World!
</div>

<div class="clear">&#160;</div>

<div class="bar">
    <div class="buttons">    
          <button type="button" id="submit">Submit</button>
          <button type="button" id="cancel">Cancel</button>
    </div>    
</div>    

.content
{
    min-height:800px;
    width: 100%;
}

.bar
{
    padding-top: 4px;
    border-width: 1px;
    border-color: #000;
    background-color: #ccc;
    height: 30px;
    border-style: solid;
}

.buttons
{
    float: right;        
}

.clear
{
    clear: both;
}

---

以下是JSFIDLE中的解决方案：

首先，丢掉桌子

<div id="content">
    Hello World!
</div>

<div class="clear">&#160;</div>

<div class="bar">
    <div class="buttons">    
          <button type="button" id="submit">Submit</button>
          <button type="button" id="cancel">Cancel</button>
    </div>    
</div>    

.content
{
    min-height:800px;
    width: 100%;
}

.bar
{
    padding-top: 4px;
    border-width: 1px;
    border-color: #000;
    background-color: #ccc;
    height: 30px;
    border-style: solid;
}

.buttons
{
    float: right;        
}

.clear
{
    clear: both;
}

---

---

不，如果我放置位置：绝对，它会干扰其他表单中的对齐，因为我在所有表单中使用相同的条形样式……在其他表单中，我有填充页面的控件，自动保存取消按钮位于底部，但这里我只有4个控件……因此保存和取消按钮位于中间，这就是我试图在按钮上显示的内容。你可以使用两个不同的css类，例如。bar，它是你的原始代码，而.footer_，它位于页面底部。No，如果我将位置设置为：absolute，它将干扰其他形式的对齐，因为我在所有表单中都使用相同的条形图样式……在其他表单中，我有填充页面的控件，自动保存取消按钮位于底部，但这里我只有4个控件……所以保存和取消按钮位于中间，这就是我试图在按钮处显示的内容。你可以使用两个不同的css类，例如.bar是您的原始代码，而.footer\u栏则是您的原始代码底部的条page@Shanish我认为上面的代码可以解决你的问题，你可以通过设置{margin bottom:100px}来进一步调整位置实际上我在这个保存取消按钮之前有div标签…可以设置div的高度吗，这样，当我运行应用程序时，它将填充空间并显示保存取消按钮？您可以将div height设置为98%，将bar height设置为2%@Shanish我认为上述代码将解决您的问题。您可以通过设置{margin bottom:100px}进一步调整位置实际上，我在这个保存取消按钮之前有一个div标签……是否可以设置div的高度，以便在我运行应用程序时填充空间并显示保存取消按钮？您可以将div高度设置为98%，将条高度设置为2%，现在条也位于相同的中心位置，而不是底部设置最小高度：800px；在横栏上方的内容div中，放置一个带有clear的div：两者；在content和bar div之间实际上，我在这个save cancel按钮之前有一个div标签…是否可以设置div的高度，以便在我运行应用程序时填充空间并显示save cancel按钮？非常感谢，您的代码工作正常，我对此有疑问，如果使用div标签的最小长度为…这一点就满足了我的要求…这里我将高度设置为210px，如果我在不同的系统中运行相同的应用程序，对齐是否会根据其监视器大小而变化？这是一种折衷；您可以使用%值对各种显示器尺寸进行修正：现在该条也位于相同的中心位置，而不是底部设置最小高度：800px；在横栏上方的内容div中，放置一个带有clear的div：两者；在content和bar div之间实际上，我在这个save cancel按钮之前有一个div标签…是否可以设置div的高度，以便在我运行应用程序时填充空间并显示save cancel按钮？非常感谢，您的代码工作正常，我对此有疑问，如果使用div标签的最小长度为…这一点就满足了我的要求…这里我将高度设置为210px，如果我在不同的系统中运行相同的应用程序，对齐是否会根据其监视器大小而变化？这是一种折衷；您可以使用%值来修复各种显示器尺寸：