设置图像透明度

时间:2011-05-22 11:32:36

标签: asp.net html image

我有源代码

<%@ Page Language="C#" MasterPageFile="~/MasterPage.master" AutoEventWireup="true" CodeFile="condition.aspx.cs" Inherits="condition" Title="Untitled Page" %>

<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">

<p>
    <br />
    <asp:ImageButton ID="ImageButton1" runat="server" Height="234px" 
        ImageUrl="~/images/condition.jpeg" Width="289px" />

</p>

<p style="font-size: small">
    Very often there are health issues that cannot be clearly classified under a 
    specific medical specialty. The topics under this section include health issues 
    of this kind. This section also explains symptoms related to different kinds of 
    illnesses and diseases. The different medical specialties are also covered in 
    this section.</p>
<p style="font-size: small">
    &nbsp;</p>
                                    <p style="font-size: small">
                                        &nbsp;</p>
                                    <div class="clearfix" style="padding-left: 5px;">
                                        <div style="float: left; width: 50%;">
                                            <span style="font-size: small">&nbsp;<a 
                                                href="http://www.aarogya.com/conditions-and-diseases/acute-diarrheal-disease.html"><span 
                                                id="act31">Acute Diarrheal Disease</span></a><br />
                                            &#8226;&nbsp;<a href="http://www.aarogya.com/conditions-and-diseases/allergy.html"><span 
                                                id="act16">Allergy</span></a><br />
                                            &#8226;&nbsp;<a href="http://www.aarogya.com/conditions-and-diseases/amebiasis.html"><span 
                                                id="act32">Amebiasis</span></a><br />
                                            &#8226;&nbsp;<a href="http://www.aarogya.com/conditions-and-diseases/appendicitis.html"><span 
                                                id="act17">Appendicitis</span></a><br />
                                            &#8226;&nbsp;<a href="http://www.aarogya.com/conditions-and-diseases/arthritis.html"><span 
                                                id="act18">Arthritis</span></a><br />
                                            &#8226;&nbsp;<a href="http://www.aarogya.com/conditions-and-diseases/asthma.html"><span 
                                                id="act19">Asthma</span></a><br />
                                            &#8226;&nbsp;<a href="http://www.aarogya.com/conditions-and-diseases/blindness.html"><span 
                                                id="act20">Blindness</span></a><br />
                                            &#8226;&nbsp;<a href="http://www.aarogya.com/conditions-and-diseases/blood-pressure.html"><span 
                                                id="act21">Blood Pressure</span></a><br />
                                            &#8226;&nbsp;<a href="http://www.aarogya.com/conditions-and-diseases/bronchitis.html"><span 
                                                id="act22">Bronchitis</span></a><br />
                                            &#8226;&nbsp;<a href="http://www.aarogya.com/conditions-and-diseases/brucellosis.html"><span 
                                                id="act33">Brucellosis</span></a><br />
                                            &#8226;&nbsp;<a href="http://www.aarogya.com/conditions-and-diseases/chicken-pox.html"><span 
                                                id="act34">Chicken Pox</span></a><br />
                                            &#8226;&nbsp;</span><a 
                                                href="http://www.aarogya.com/conditions-and-diseases/chikungunya-fever.html"><span 
                                                id="act35"><span style="font-size: small">Chikungunya Fever</span></span></a><span 
                                                style="font-size: small"><br />
                                            &#8226;&nbsp;<a href="http://www.aarogya.com/conditions-and-diseases/cholera.html"><span 
            id="act36">Cholera</span></a><br />
                                            &#8226;&nbsp;<a href="http://www.aarogya.com/conditions-and-diseases/conjunctivitis.html"><span 
            id="act25">Conjunctivitis</span></a><br />
                                            &#8226;&nbsp;<a 
            href="http://www.aarogya.com/conditions-and-diseases/computer-health-hazards.html"><span 
            id="act148">Computer Health Hazards</span></a><br />
                                            &#8226;&nbsp;<a href="http://www.aarogya.com/conditions-and-diseases/dengue.html"><span 
            id="act37">Dengue</span></a><br />
                                            &#8226;&nbsp;<a href="http://www.aarogya.com/conditions-and-diseases/diphtheria.html"><span 
            id="act38">Diphtheria</span></a><br />
                                            &#8226;&nbsp;<a 
            href="http://www.aarogya.com/conditions-and-diseases/diagnostic-tests.html"><span 
            id="act149">Diagnostic Tests</span></a><br />
                                            &#8226;&nbsp;<a href="http://www.aarogya.com/conditions-and-diseases/dysentery.html"><span 
            id="act26">Dysentery</span></a><br />
                                            &#8226;&nbsp;<a href="http://www.aarogya.com/conditions-and-diseases/guinea-worm.html"><span 
            id="act27">Guinea Worm</span></a><br />
                                            &#8226;&nbsp;<a href="http://www.aarogya.com/conditions-and-diseases/hepatitis.html"><span 
            id="act39">Hepatitis</span></a><br />
                                            &#8226;&nbsp;<a href="http://www.aarogya.com/conditions-and-diseases/hookworm.html"><span 
            id="act40">Hookworm</span></a>
    </div>
    <div style="float: left;">
        &#8226;&nbsp;<a href="http://www.aarogya.com/conditions-and-diseases/influenza.html"><span 
            id="act41">Influenza</span></a><br />
        &#8226;&nbsp;<a 
            href="http://www.aarogya.com/conditions-and-diseases/irritable-bowel-syndrome.html"><span 
            id="act28">Irritable Bowel Syndrome</span></a><br />
        &#8226;&nbsp;<a 
            href="http://www.aarogya.com/conditions-and-diseases/japanese-encephalitis.html"><span 
            id="act29">Japanese Encephalitis</span></a><br />
        &#8226;&nbsp;<a href="http://www.aarogya.com/conditions-and-diseases/leprosy.html"><span 
            id="act42">Leprosy</span></a><br />
        &#8226;&nbsp;<a href="http://www.aarogya.com/conditions-and-diseases/leptospirosis.html"><span 
            id="act43">Leptospirosis</span></a><br />
        &#8226;&nbsp;<a 
            href="http://www.aarogya.com/conditions-and-diseases/lymphatic-filariasis.html"><span 
            id="act44">Lymphatic Filariasis</span></a><br />
        &#8226;&nbsp;<a href="http://www.aarogya.com/conditions-and-diseases/malaria.html"><span 
            id="act45">Malaria</span></a><br />
        &#8226;&nbsp;<a href="http://www.aarogya.com/conditions-and-diseases/measles.html"><span 
            id="act46">Measles</span></a><br />
        &#8226;&nbsp;<a href="http://www.aarogya.com/conditions-and-diseases/plague.html"><span 
            id="act30">Plague</span></a><br />
        &#8226;&nbsp;<a href="http://www.aarogya.com/conditions-and-diseases/poliomyelitis.html"><span 
            id="act47">Poliomyelitis</span></a><br />
        &#8226;&nbsp;<a href="http://www.aarogya.com/conditions-and-diseases/rabies.html"><span 
            id="act48">Rabies</span></a><br />
        &#8226;&nbsp;<a href="http://www.aarogya.com/conditions-and-diseases/rubella.html"><span 
            id="act49">Rubella</span></a><br />
        &#8226;&nbsp;<a href="http://www.aarogya.com/conditions-and-diseases/tetanus.html"><span 
            id="act50">Tetanus</span></a><br />
        &#8226;&nbsp;<a href="http://www.aarogya.com/conditions-and-diseases/tuberculosis.html"><span 
            id="act51">Tuberculosis</span></a><br />
        &#8226;&nbsp;<a href="http://www.aarogya.com/conditions-and-diseases/typhoid-fever.html"><span 
            id="act52">Typhoid Fever</span></a><br />
        &#8226;&nbsp;<a href="http://www.aarogya.com/conditions-and-diseases/viral-hepatitis.html"><span 
            id="act178">Viral Hepatitis</span></a><br />
        &#8226;&nbsp;<a href="http://www.aarogya.com/conditions-and-diseases/whooping-cough.html"><span 
            id="act53">Whooping Cough</span></a><br />
        &#8226;&nbsp;<a href="http://www.aarogya.com/conditions-and-diseases/yaws.html"><span 
            id="act54">Yaws</span></a><br />
        &#8226;&nbsp;</span><a 
            href="http://www.aarogya.com/conditions-and-diseases/yellow-fever.html"><span 
            id="act55"><span style="font-size: small">Yellow Fever</span></span></a>
    </div>
</div>
<p style="font-size: small">
    &nbsp;</p>


</asp:Content>

我想添加以下代码

<html>
<head>
<style type="text/css">
img
{
opacity:0.4;
filter:alpha(opacity=40);
}
</style>
</head>
<body>

<h1>Image Transparency</h1>
<img src="klematis.jpg" width="150" height="113" alt="klematis"
onmouseover="this.style.opacity=1;this.filters.alpha.opacity=100"
onmouseout="this.style.opacity=0.4;this.filters.alpha.opacity=40" />

<img src="klematis2.jpg" width="150" height="113" alt="klematis"
onmouseover="this.style.opacity=1;this.filters.alpha.opacity=100"
onmouseout="this.style.opacity=0.4;this.filters.alpha.opacity=40" />
</body>
</html>

我不想影响母版页,只是图片应该生效,在哪里添加这段代码?

1 个答案:

答案 0 :(得分:0)

也许我错过了什么,但并不像

那么简单
<asp:ImageButton Style="opacity:0.4; filter:alpha(opacity=40);" ID="ImageButton1" ... />

当您准备好变得更加漂亮时,请将规则添加到CSS文件并将其称为

<asp:ImageButton CssClass="yourclassname" ID="ImageButton1" ... />

无论哪种方式,都意识到效果不会出现在所有浏览器中。

相关问题