今天遇到一个帖子,老外问我如何给FILEUPLOAD 控件上色,就连老外的MVP也说不是容易的事情,呵呵。
其实有些时候我们只要变通下就可以解决这样的小问题,看看我的代码。
<%@ Page Language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<style type="text/css">
#divFileUpload input
{
border-color: Olive;
border-style: solid;
border-width: 1px;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div id="divFileUpload">
<asp:FileUpload ID="FileUploadCSSDemo" runat="server" />
</div>
<asp:Button ID="btnSubmit" runat="server" Text="Submit" />
</form>
</body>
</html>
<head runat="server">
<title></title>
<style type="text/css">
#divFileUpload input
{
border-color: Olive;
border-style: solid;
border-width: 1px;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div id="divFileUpload">
<asp:FileUpload ID="FileUploadCSSDemo" runat="server" />
</div>
<asp:Button ID="btnSubmit" runat="server" Text="Submit" />
</form>
</body>
</html>
注意代码里面的CSS部分,其实道理很简单,我们知道FILEUPLOAD 会被浏览器解释成为以INPUT为标记的HTML元素,所以我就把样式应用给这个特定的DIV【divFileUpload】里面的HTML元素,所以如果你运行我的代码,你会看到样式只会应用到FILEUPLOAD控件上,而不会应用到其它可以解释为INPUT的HTML元素上。
#divFileUpload input
{
border-color: Olive;
border-style: solid;
border-width: 1px;
}
{
border-color: Olive;
border-style: solid;
border-width: 1px;
}
这个是我给老外回答问题的源地址: