WebPartZoneBase.LayoutOrientation 属性

定义

获取或设置指示区域中的控件是垂直排列还是水平排列的值。Gets or sets a value that indicates whether controls in a zone are arranged vertically or horizontally.

public:
 virtual property System::Web::UI::WebControls::Orientation LayoutOrientation { System::Web::UI::WebControls::Orientation get(); void set(System::Web::UI::WebControls::Orientation value); };
public virtual System.Web.UI.WebControls.Orientation LayoutOrientation { get; set; }
member this.LayoutOrientation : System.Web.UI.WebControls.Orientation with get, set
Public Overridable Property LayoutOrientation As Orientation

属性值

确定区域中控件的排列方式的 Orientation 值。An Orientation value that determines how controls in a zone are arranged. 默认方向为 VerticalThe default orientation is Vertical.

例外

该值不是枚举的 Orientation 值之一。The value is not one of the enumerated Orientation values.

示例

下面的代码示例演示了 WebPartZone 控件上 LayoutOrientation 属性的声明性和编程使用。The following code example demonstrates the declarative and programmatic use of the LayoutOrientation property on a WebPartZone control. 有关完整的代码示例,包括代码隐藏源文件和包含此代码中区域的 .aspx 页面,请参阅 WebPartZoneBase 类概述。For the full code example, including the code-behind source file and the .aspx page that contains the zone in this code, see the WebPartZoneBase class overview.

请注意,在声明性标记中,LayoutOrientation 属性有一个分配给它的值。Notice that the LayoutOrientation property has a value assigned to it in the declarative markup. 在将页面加载到浏览器中之后,此值会影响 WebPartZone1This value impacts WebPartZone1, after you load the page into a browser. 区域中的 Web 部件控件在水平方向上呈现。The Web Parts controls in the zone are rendered horizontally.

<asp:WebPartZone 
  ID="WebPartZone1" 
  Runat="server"
  LayoutOrientation="Vertical" >
  <EditVerb Text="Edit WebPart" />
  <SelectedPartChromeStyle BackColor="LightBlue" />
  <ZoneTemplate>
    <asp:BulletedList 
      ID="BulletedList1" 
      Runat="server"
      DisplayMode="HyperLink" 
      Title="Favorite Links" >
      <asp:ListItem Value="http://msdn.microsoft.com">
        MSDN
      </asp:ListItem>
      <asp:ListItem Value="http://www.asp.net">
        ASP.NET
      </asp:ListItem>
      <asp:ListItem Value="http://www.msn.com">
        MSN
      </asp:ListItem>
    </asp:BulletedList>
    <asp:Calendar ID="Calendar1" Runat="server" 
      Title="My Calendar" />
  </ZoneTemplate>
</asp:WebPartZone>
<asp:WebPartZone 
  ID="WebPartZone1" 
  Runat="server"
  LayoutOrientation="Vertical" >
  <EditVerb Text="Edit WebPart" />
  <SelectedPartChromeStyle BackColor="LightBlue" />
  <ZoneTemplate>
    <asp:BulletedList 
      ID="BulletedList1" 
      Runat="server"
      DisplayMode="HyperLink" 
      Title="Favorite Links" >
      <asp:ListItem Value="http://msdn.microsoft.com">
        MSDN
      </asp:ListItem>
      <asp:ListItem Value="http://www.asp.net">
        ASP.NET
      </asp:ListItem>
      <asp:ListItem Value="http://www.msn.com">
        MSN
      </asp:ListItem>
    </asp:BulletedList>
    <asp:Calendar ID="Calendar1" Runat="server" 
      Title="My Calendar" />
  </ZoneTemplate>
</asp:WebPartZone>

您可以单击 "切换布局方向" 按钮以更改区域的方向。You can click the Toggle Layout Orientation button to change the orientation of the zone. 用于切换方向的代码出现在分部类中的以下代码示例中。The code to toggle the orientation occurs in the following code example from the partial class.

protected void Button2_Click(object sender, EventArgs e)
{
  if (WebPartZone1.LayoutOrientation == Orientation.Vertical)
    WebPartZone1.LayoutOrientation = Orientation.Horizontal;
  else
    WebPartZone1.LayoutOrientation = Orientation.Vertical;
  Page_Load(sender, e);
}
Protected Sub Button2_Click(ByVal sender As Object, ByVal e As EventArgs) 
  If WebPartZone1.LayoutOrientation = Orientation.Vertical Then
      WebPartZone1.LayoutOrientation = Orientation.Horizontal
  Else
      WebPartZone1.LayoutOrientation = Orientation.Vertical
  End If
  Page_Load(sender, e)
End Sub 

注解

LayoutOrientation 属性涉及 Web 部件控件在区域中的布局方式。The LayoutOrientation property concerns how Web Parts controls are laid out in a zone. 在默认 Vertical 方向下,控件根据每个控件的 ZoneIndex 值以从上到下的方式呈现。With the default Vertical orientation, the controls are rendered in a top-to-bottom arrangement, according to the ZoneIndex value of each control. Horizontal 方向上,控件并排排列,受区域的宽度的限制。With a Horizontal orientation, the controls are arranged side by side, subject to the width of the zone.

Internet Explorer 可能会影响 WebPart 控件的高度以及包含它的区域的高度。Internet Explorer can affect the height of a WebPart control, and the height of the zone that contains it. Internet Explorer 以兼容模式(向后兼容之前的浏览器版本)或在标准模式(由页面中的 DOCTYPE 声明的存在)来呈现网页。Internet Explorer renders web pages either in compatibility mode (backward compatible with previous browser versions), or in standards mode (determined by the presence of a DOCTYPE declaration in the page). 有关这些模式的信息,请参阅 DHTML document.compatmode属性。For information about these modes, see the DHTML compatMode property. Internet Explorer 在标准模式下呈现页面时,在某些情况下,它不会在表中调整单元格的大小,即使 <td height="100%">单元格的 HTML 标记。When Internet Explorer renders a page in standards mode, in some scenarios it does not resize cells in tables, even when a cell's HTML markup is <td height="100%">. 因此,会呈现 WebPart 控件及其包含区域,以便控件不会延伸到区域的完整高度。As a result, WebPart controls and their containing zone are rendered so that the controls do not stretch to the full height of the zone.

这种类型的呈现在两种情况下发生。This type of rendering occurs in two cases.

  • 当区域的 LayoutOrientation 属性设置为 Vertical时,将在区域上显式设置高度。When a zone's LayoutOrientation property is set to Vertical, and you explicitly set the height on the zone. 若要使控件能够填充区域的全部高度,请不要指定水平区域的高度。To enable controls to fill the full height of the zone, do not specify the height of a horizontal zone.

  • 当区域的 LayoutOrientation 属性设置为 Horizontal时,您不显式设置区域(或包含控件的)的高度。When a zone's LayoutOrientation property is set to Horizontal, and you do not explicitly set the height of the zone (or of the contained controls). 若要使控件能够填充区域的全部高度,请设置区域或垂直区域中控件的高度。To enable controls to fill the full height of the zone, set the height of the zone or of the controls in a vertical zone.

本主题中的代码示例演示了 LayoutOrientation 属性的正常使用。The code example in this topic demonstrates normal usage of the LayoutOrientation property. 有关演示与高度相关的呈现问题及其解决方法的代码示例,请参见 Height 属性。For a code example that demonstrates the height-related rendering issue and how to work around it, see the Height property.

适用于

另请参阅