This article will show you how you can resize image on the
bases of browser size and this will display the responsive image development in
asp.net using css.
Some of my previous
articles are as follows: Add,
Remove, Validate CSS Class Applied To a HTML Control In Asp.Net Using jQuery., CalendarExtender
Example With Custom Style By Css Uaing Asp.net and Css, Dynamic
Vertical Css Menu Using jQuery, Css and C#.net In Asp.net MVC, Responsive Grid Design Example Using Css in
Asp.Net MVC,HTML, Stylish RadioButton, DropdownList, ListBox
and TextBox Control In Asp.Net Using Css, Dynamic
Css Menu Creation Up to Three Level in Asp.Net Using C#.Net.
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm3.aspx.cs" Inherits="WebApplication1.WebForm3"
%>
<!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>Resize
Image On The Bases Of Browser Size Using Css In Asp.Net</title>
<style>
.resize
{
display:
inline;
}
.resize
img
{
max-width:
90%;
max-height:
90%;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div class="resize">
<img src="Desert.jpg" alt="Img" />
</div>
</form>
</body>
</html>
|
Please check the above css code.
<style>
.resize
{
display:
inline;
}
.resize
img
{
max-width:
90%;
max-height:
90%;
}
</style>
|
In above code we have defined the the max height and width. So
in this case if we resize the the
browser the the image size will also get changed automatically.
Please check the output.
Now resize browser the image size will change as per your resize
About the Author
0 comments:
Please let me know your view