แก้ไข

แชร์ผ่าน

HtmlImage.Height Property

  • Reference

Definition

Namespace:
System.Web.UI.HtmlControls
Assembly:
System.Web.dll

Gets or sets the height of the image.

public:
 property int Height { int get(); void set(int value); };
public int Height { get; set; }
member this.Height : int with get, set
Public Property Height As Integer

Property Value

Int32

The height of the image.

Examples

The following code example demonstrates how to use the Height property to programmatically modify the height of the displayed image.

<%@ Page Language="C#" AutoEventWireup="True" %>

<!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>
    <title>HtmlImage Example</title>
<script language="C#" runat="server">
        
       void Button_Click1(object sender, EventArgs e) 
       {
          Image1.Height=500;
          Image1.Width=1000;
       }
    
       void Button_Click2(object sender, EventArgs e) 
       {
          Image1.Height=226;
          Image1.Width=500;
       }
 
    </script>
 
 </head>
 
 <body>
 
    <form id="form1" runat="server">
 
       <h3>HtmlImage Example</h3>
     
       <img id ="Image1"
            src="Image1.jpg"
            alt="Image 1"
            runat="server"
            style="width:500; height:226; border:5; text-align:center" />
       <br /><br />
       <button id="Button1"
               onserverclick="Button_Click1"
               runat="server">
       Zoom Image
       </button>
       <button id="Button2"
               onserverclick="Button_Click2"
               runat="server">
       Normal Size
       </button>
    
    </form>
 
 </body>
 </html>

<%@ Page Language="VB" AutoEventWireup="True" %>

<!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>
    <title>HtmlImage Example</title>
<script language="VB" runat="server">
        
    Sub Button_Click1(sender As Object, e As EventArgs)
        Image1.Height = 500
        Image1.Width = 1000
    End Sub 'Button_Click1


    Sub Button_Click2(sender As Object, e As EventArgs)
        Image1.Height = 226
        Image1.Width = 500
    End Sub 'Button_Click2
 
  </script>
 
 </head>
 
 <body>
 
    <form id="form1" runat="server">
 
       <h3>HtmlImage Example</h3>
     
       <img id ="Image1"
            src="Image1.jpg"
            alt="Image 1"
            runat="server"
            style="width:500; height:226; border:5; text-align:center" />
       <br /><br />
       <button id="Button1"
               onserverclick="Button_Click1"
               runat="server">
       Zoom Image
       </button>
       <button id="Button2"
               onserverclick="Button_Click2"
               runat="server">
       Normal Size
       </button>
    
    </form>
 
 </body>
 </html>

Remarks

The Height and Width properties can be used two ways. You can use the Height and Width properties to send image size specifications to the browser. This displays the Web page faster because the browser does not need to recalculate the positions of elements on the page when the image loads.

You can also use the Height and Width properties to scale the image. When using values different from the physical size of the image, the image is resized accordingly. However, this method for scaling the image is not recommended because it takes longer for the page to display it. Instead, physically resize the image to the size you need.

By default, the Height property is expressed in pixels, but it can also be expressed as a percentage of the size of the window.

Applies to

See also