zoukankan      html  css  js  c++  java
  • css调节样式

    [root@yyjk templates]# cat displayOracleExport.html 
    
    
    <html>
    <head>
    	<title>运维平台</title>
    	<link rel="stylesheet" type="text/css" href="/static/Css/Monitor/displayOracleExport.css">
    	<link rel="stylesheet" type="text/css" href="/static/Css/Public/header.css">
    	<link rel="stylesheet" type="text/css" href="/static/Css/Public/menu.css">
    </head>
    <body>
    	<include file="Public:header"/>
    	<div class="content">
    		<include file="Public:menu"/>
    		<div class="con fl">
    			<div id="condition">
    				<label class="condition">数据库服务名</label><input type="text" name="dbservice" class="equipment_sz1">
    				<label class="condition">数据库IP</label><input type="text" name="dbip" class="equipment_sz2">
    				<label class="condition">数据库用户名</label><input type="text" name="dbuser" class="equipment_sz3">
    				<label class="condition">数据库密码</label><input type="text" name="dbpass" class="equipment_sz4">
                                     <br />
                                     <br />
    				<label class="condition">导出的表</label><input type="text" name="exportTable" class="equipment_sz5">
    				<label class="condition">where条件</label><input type="text" name="tiaojian" class="equipment_sz6">
                                     <br />
                                     <br />
    				<input type="submit" value="导出" class="equipment_search_btn es_1">
    				<!--<input type="submit" value="组查找" class="equipment_search_btn es_2">-->
    			</div>
    			<table class="gridtable">
    				<tr>
    					<th>"导出成功后,请通过下面的url下载文件"</th>
    				</tr>
    			</table>
    		</div>
    	</div>
    </body>
    <script type="text/javascript" src="/static/Js/jquery-2.2.2.min.js"></script>
    <script type="text/javascript" src="/static/Js/Monitor/displayOracleExport.js"></script>
    <script type="text/javascript" src="/static/Js/Public/ajax.js"></script>
    </html>
    
    
    [root@yyjk Monitor]# cat displayOracleExport.css 
    ?body,html{
    	margin: 0;
    	padding: 0;
    	 100%;
    	height: 100%;
    	/* overflow: hidden; */
    }
    .fl{
    	float: left;
    }
    .fr{
    	float: right;
    }
    .clearfix{
    	clear: both;
    }
    i{
    }
    i.icon-menu{
    	background: url("../../Images/icon.png");
    	display: inline-block;
    }
    i.i_0{
    	background-position: 0 0;
    	 23px;
    	height: 23px;
    	display: block;
    }
    i.i_1{
    	background: url("../../Images/1.png") no-repeat;
    	 25px;
    	height: 30px;
    }
    i.i_2{
    	background: url("../../Images/2.png") no-repeat;
    	 29px;
    	height: 29px;
    }
    i.i_3{
    	background: url("../../Images/3.png") no-repeat;	
    	 27px;
    	height: 23px;
    }
    i.i_4{
    	background: url("../../Images/4.png") no-repeat;	
    	 29px;
    	height: 30px;
    }
    i.i_5{
    	background: url("../../Images/5.png") no-repeat;	
    	 24px;
    	height: 28px;
    }
    i.i_6{
    	background-position: 0 -35px;
         14px;
        height: 10px;
        margin-right: 20px;
        margin-top: 10px;
    }
    i.i_6.hide{
    	background-position: -15px -35px;
    }
    
    
    
    .content{
    	height: 100%;
    }
    
    .con{
    	border: 1px solid #eeeeee;
    	display: inline-block;
    	86.8%;
    	height: 100%;
    }
    .condition{
    	font-size: 15px;
    	font-family: "黑体";
    	margin-left:10px;
    }
    .con #condition{
    	 100%;
    	margin-top: 10px;
    	text-align: center;
    	margin-bottom: 10px;
    	 1210px;
    }
    .con .equipment_sz{
    	 300px;
    	height: 25px;
    }
    
    .con .equipment_sz6{
             500px;
            height: 25px;
    }
    .con .equipment_sz5{
             300px;
            height: 25px;
    }
    
    
    .con .equipment_search_btn{
    	 100px;
    	height: 27px;
    }
    .con .es_1{
    	margin-left: 30px;
    }
    .con .es_2{
    	margin-left: 30px;
    }
    
    .con .es_6{
    	 200px;
            margin-left: 30px;
    }
    .con table.gridtable {
    	border:10px solid red;
    	font-family: verdana,arial,sans-serif;
    	font-size:20px;
    	color:#4384ba;
    	border- 2px;
    	border-color: #4384ba;
    	border-collapse: collapse;
    }
    .con table.gridtable th {
    	border- 1px;
    	padding: 10px auto;
    	text-align: center;
    	 3300px;
    	border-style: solid;
    	border-color: #eeeeee;
    	background-color: #dedede;
    }
    .con table.gridtable td {
    	border- 2px;
    	padding: 10px auto;
    	text-align: center;
    	 500px;
    	border-style: solid;
    	border-color: #eeeeee;
    	background-color: #f7f9f9;
    }    
    .con table.gridtable .gridth{
    	border- 10px;
    	padding: 10px auto;
    	text-align: center;
    	 500px;
    	border-style: solid;
    	border-color: #eeeeee;
    	background-color: #dedede;
    }      
    .con table.gridtable .gridtd{
    	border- 2px;
    	padding: 10px auto;
    	text-align: center;
    	 500px;
    	border-style: solid;
    	border-color: #eeeeee;
    	background-color: #f7f9f9;
    }       
    
    .con table.gridtable .btn {
    	display: block;
    	 300px;
    	height: 20px;
    	margin-left: 15px;
    	background-color: #e7e3e3;
    	cursor: pointer;
    }
    .con table.gridtable .btn:hover {
    	box-shadow: 2px 2px 2px gray;
    }
    .con table.gridtable .btn:active {
    	position: relative;
    	top: 1px;
    } 

  • 相关阅读:
    和为S的连续正数序列
    数组中只出现一次的数字
    平衡二叉树
    二叉树的深度
    水仙花数
    数列求和
    数值统计
    奇数乘积
    求绝对值
    求两点的距离
  • 原文地址:https://www.cnblogs.com/hzcya1995/p/13349326.html
Copyright © 2011-2022 走看看