ASP.NET中用户控件加载显示问题
我是用VS.NET2003开发的,在我设计的用户控件中显示的界面为什么跟他运行时加载到页面中显示的界面不一样,同时他在内网和外网中显示的界面结果也不一样(主要是排列的方式不一样,在控件中设置的是很美观的,但在运行时加载到页面中后,结果就变的乱序),能告诉我为什么吗?又该怎样解决?是不是非的用CSS才能解决?如果是的话,麻烦各位前辈能给出一些相关的CSS代码让我参考一下,谢谢。
[解决办法]
你是不是用的流输出,而且是自然流。这样浏览器大小改变,位置也改变。
用css是一种方式,table定位也是常用的。我一般手工写table,如果你会DreamWaver,就更好了。
[解决办法]
如果只是界面变乱了,就是你的布局问题了.
一种方法,你可以在VS里,通过Style属性,设置控件的外观.
一种是定义CSS来控制,也不难,楼主可以去搜一下,网上有很多的.
当然,也还有其他方法.
[解决办法]
是否调用了CSS?
在DW里面调页面布局吧。
具体哪里乱了?
[解决办法]
table+css
[解决办法]
代码写的不规范,按标准写
[解决办法]
漂亮的表格
<style>
table {
width:95%;
border: 1px #E6D1B0 solid;
background-color: #efe3ce;
font-size:11px;
font-family:Tahoma;
color:#FF6600;
text-align:center;
}
</style>
<table>
<tr>
<td>
Hello world!
</td>
</tr>
</table>
漂亮的按钮
<!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>
<meta http-equiv= "Content-Type " content= "text/html; charset=gb2312 " />
<title> 收藏的几个css按钮样式 </title>
</head>
<style>
.btn {
BORDER-RIGHT: #7b9ebd 1px solid; PADDING-RIGHT: 2px; BORDER-TOP:
#7b9ebd 1px solid; PADDING-LEFT: 2px; FONT-SIZE: 12px; FILTER:
progid:DXImageTransform.Microsoft.Gradient(GradientType=0,
StartColorStr=#ffffff, EndColorStr=#cecfde); BORDER-LEFT: #7b9ebd
1px solid; CURSOR: hand; COLOR: black; PADDING-TOP: 2px;
BORDER-BOTTOM: #7b9ebd 1px solid
}
.btn1_mouseout {
BORDER-RIGHT: #7EBF4F 1px solid; PADDING-RIGHT: 2px; BORDER-TOP:
#7EBF4F 1px solid; PADDING-LEFT: 2px; FONT-SIZE: 12px; FILTER:
progid:DXImageTransform.Microsoft.Gradient(GradientType=0,
StartColorStr=#ffffff, EndColorStr=#B3D997); BORDER-LEFT: #7EBF4F
1px solid; CURSOR: hand; COLOR: black; PADDING-TOP: 2px;
BORDER-BOTTOM: #7EBF4F 1px solid
}
.btn1_mouseover {
BORDER-RIGHT: #7EBF4F 1px solid; PADDING-RIGHT: 2px; BORDER-TOP:
#7EBF4F 1px solid; PADDING-LEFT: 2px; FONT-SIZE: 12px; FILTER:
progid:DXImageTransform.Microsoft.Gradient(GradientType=0,
StartColorStr=#ffffff, EndColorStr=#CAE4B6); BORDER-LEFT: #7EBF4F
1px solid; CURSOR: hand; COLOR: black; PADDING-TOP: 2px;
BORDER-BOTTOM: #7EBF4F 1px solid
}
.btn2 {padding: 2 4 0
4;font-size:12px;height:23;background-color:#ece9d8;border-width:1;}
.btn3_mouseout {
BORDER-RIGHT: #2C59AA 1px solid; PADDING-RIGHT: 2px; BORDER-TOP:
#2C59AA 1px solid; PADDING-LEFT: 2px; FONT-SIZE: 12px; FILTER:
progid:DXImageTransform.Microsoft.Gradient(GradientType=0,
StartColorStr=#ffffff, EndColorStr=#C3DAF5); BORDER-LEFT: #2C59AA
1px solid; CURSOR: hand; COLOR: black; PADDING-TOP: 2px;
BORDER-BOTTOM: #2C59AA 1px solid
}
.btn3_mouseover {
BORDER-RIGHT: #2C59AA 1px solid; PADDING-RIGHT: 2px; BORDER-TOP:
#2C59AA 1px solid; PADDING-LEFT: 2px; FONT-SIZE: 12px; FILTER:
progid:DXImageTransform.Microsoft.Gradient(GradientType=0,
StartColorStr=#ffffff, EndColorStr=#D7E7FA); BORDER-LEFT: #2C59AA
1px solid; CURSOR: hand; COLOR: black; PADDING-TOP: 2px;
BORDER-BOTTOM: #2C59AA 1px solid
}
.btn3_mousedown
{
BORDER-RIGHT: #FFE400 1px solid; PADDING-RIGHT: 2px; BORDER-TOP:
#FFE400 1px solid; PADDING-LEFT: 2px; FONT-SIZE: 12px; FILTER:
progid:DXImageTransform.Microsoft.Gradient(GradientType=0,
StartColorStr=#ffffff, EndColorStr=#C3DAF5); BORDER-LEFT: #FFE400
1px solid; CURSOR: hand; COLOR: black; PADDING-TOP: 2px;
BORDER-BOTTOM: #FFE400 1px solid
}
.btn3_mouseup {
BORDER-RIGHT: #2C59AA 1px solid; PADDING-RIGHT: 2px; BORDER-TOP:
#2C59AA 1px solid; PADDING-LEFT: 2px; FONT-SIZE: 12px; FILTER:
progid:DXImageTransform.Microsoft.Gradient(GradientType=0,
StartColorStr=#ffffff, EndColorStr=#C3DAF5); BORDER-LEFT: #2C59AA
1px solid; CURSOR: hand; COLOR: black; PADDING-TOP: 2px;
BORDER-BOTTOM: #2C59AA 1px solid
}
.btn_2k3 {
BORDER-RIGHT: #002D96 1px solid; PADDING-RIGHT: 2px; BORDER-TOP:
#002D96 1px solid; PADDING-LEFT: 2px; FONT-SIZE: 12px; FILTER:
progid:DXImageTransform.Microsoft.Gradient(GradientType=0,
StartColorStr=#FFFFFF, EndColorStr=#9DBCEA); BORDER-LEFT: #002D96
1px solid; CURSOR: hand; COLOR: black; PADDING-TOP: 2px;
BORDER-BOTTOM: #002D96 1px solid
}
</style>
<body>
<button class=btn> 按钮样式1 </button>
<br />
<br />
<button
class=btn1_mouseout onmouseover= "this.className= 'btn1_mouseover ' "
onmouseout= "this.className= 'btn1_mouseout ' "
> 按钮样式2 </button>
<br />
<br />
<button
class=btn1_mouseout onmouseover= "this.className= 'btn1_mouseover ' "
onmouseout= "this.className= 'btn1_mouseout ' " DISABLED
> 按钮样式3 </button>
<P>
<button class=btn2> 按钮样式4 </button>
<P>
<button class=btn3_mouseout
onmouseover= "this.className= 'btn3_mouseover ' "
onmouseout= "this.className= 'btn3_mouseout ' "
onmousedown= "this.className= 'btn3_mousedown ' "
onmouseup= "this.className= 'btn3_mouseup ' "
> 按钮样式5 </button>
<P>
<button class=btn_2k3> 按钮样式6 </button>
</body>
</html>
漂亮的链接
<style>
<!--
body { font-family: Tahoma; font-size: 8pt }
.leftmenu {
width:150px;
}
.leftmenu li {
display: inline;
white-space: nowrap;
}
.leftmenu span,
.leftmenu a:active,
.leftmenu a:visited,
.leftmenu a:link {
display: block;
text-decoration: none;
margin: 6px 10px 6px 0px;
padding: 2px 6px 2px 6px;
color: #00527f;
background-color: #d9e8f3;
border: 1px solid #004266;
}
.leftmenu a:hover {
color: red;
background-color: #8cbbda;
}
.leftmenu span {
color: #a13100;
}
-->
</style>
</head>
<ul class= "leftmenu ">
<li> <a target= "_blank " href= "http://www.microsoft.com/china "> www.Microsoft.com </a>
<li> <a target= "_blank " href= "http://www.google.com "> www.Google.com </a>
<li> <a target= "_blank " href= "http://www.csdn.net/ "> www.CSDN.Net </a>
</ul>
[解决办法]
[解决办法]
CSS是布局不可少的
[解决办法]
要漂亮就要CSS控制
[解决办法]
要漂亮就要CSS控制
-----------------
up