Question

这是我的完整代码。我还没有修改我的默认css代码。有谁知道如何将导航栏对准徽标旁边的右侧？请注意我目前正在学习视觉基础Web应用程序构建，我对该领域的知识非常有限。

感谢

<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="default.aspx.vb" Inherits="Wiltshire_mobile._default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <style type="text/css">
        .style1
        {
            font-size: large;
        }
        .style2
        {
            text-align: right;
        }
        .style3
        {
            width: 162px;
            height: 83px;
            border-width: 0px;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div class="style2">
        <asp:Button ID="mysiteloginbutton1" runat="server" Text="My Site Login" BackColor="#FF9900"
            ForeColor="White" Style="text-align: right" /> &nbsp;<span class="style1"><strong 
            style="text-align: left"><a 
            href="#">Sign up</a> | <a href="#">Help</a> |<asp:DropDownList 
            ID="DropDownList1" runat="server" AutoPostBack="True">
            <asp:ListItem>English</asp:ListItem>
            <asp:ListItem>Bangla</asp:ListItem>
        </asp:DropDownList>

        </div>
        <div>
            <a href="http://www.wiltshire-mobile.com">
            <img alt="Wiltshire mobile website logo" class="style3" src="Images/logo.PNG" /></a> <span class="style1"><strong 
            style="text-align: left">
            <asp:Menu ID="Menu1" runat="server" StaticSubMenuIndent="16px">
                <Items>
                    <asp:MenuItem Text="Home" Value="Home"></asp:MenuItem>
                    <asp:MenuItem Text="Features" Value="Features"></asp:MenuItem>
                    <asp:MenuItem Text="Tour" Value="Tour"></asp:MenuItem>
                    <asp:MenuItem Text="Plans" Value="Plans"></asp:MenuItem>
                    <asp:MenuItem Text="Blog" Value="Blog"></asp:MenuItem>
                </Items>
            </asp:Menu>
            </strong></span>
            <br />
            <br />
            Mobile image
            <br />
    </div>
    </form>
</body>
</html>

Answer 1

我相信这是你想要完成的事情：

<body>
    <table style="width: 100%">
        <tr valign="middle">
            <td colspan="2">
                <span style="font-size: 16pt; font-family: Verdana">
                    <a href="http://www.wiltshire-mobile.com">
                        <img alt="Wiltshire mobile website logo" class="style3" src="Images/logo.PNG" /></a> <span class="style1"><strong style="text-align: left">
                </span>
            </td>
            <td style="width: 80%">

            </td>
       </tr>
       <tr valign="top">
            <td style="width: 20%">
                <asp:Button ID="mysiteloginbutton1" runat="server" Text="My Site Login" BackColor="#FF9900" ForeColor="White" Style="text-align: right" /> &nbsp;<span class="style1"><strong style="text-align: left"><a href="#">Sign up</a> | <a href="#">Help</a> |<asp:DropDownList ID="DropDownList1" runat="server" AutoPostBack="True">
                <asp:ListItem>English</asp:ListItem>
                <asp:ListItem>Bangla</asp:ListItem>
                </asp:DropDownList>
           </td>
           <td style="width: 80%">
                <asp:Menu ID="Menu1" runat="server" StaticSubMenuIndent="16px">
                    <Items>
                        <asp:MenuItem Text="Home" Value="Home"></asp:MenuItem>
                        <asp:MenuItem Text="Features" Value="Features"></asp:MenuItem>
                        <asp:MenuItem Text="Tour" Value="Tour"></asp:MenuItem>
                        <asp:MenuItem Text="Plans" Value="Plans"></asp:MenuItem>
                        <asp:MenuItem Text="Blog" Value="Blog"></asp:MenuItem>
                    </Items>
               </asp:Menu>
          <br />
          <br />
          @RenderBody
          <br />
          </td>
        </tr>
    </table>
</body>

现在，我添加了'@RenderBody'，因为它应该用作你的“_LayoutPage”，然后每个页面调用它来显示它应该如何设计。

基本概念是将网站设计为表格，然后将每个元素分成该表格的列和行，就像我在这里所做的那样。 <td>和<tr>用于分隔这些项目。

如果您想了解更多内容，请将此页面指向您的site.css文件。 css文件应该包含所有内容，因为它被认为是文本，颜色，特定项目（例如表格）的布局等的定位。希望这会有所帮助。

在visual basic中对齐导航菜单

1 个答案: