master

分支 (1)

管理

管理

master

weui
/
共用CSS样式.html

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>dodou-移动框架</title>
	<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport" />
    <meta content="yes" name="apple-mobile-web-app-capable">
    <meta content="black" name="apple-mobile-web-app-status-bar-style">
    <meta content="telephone=no" name="format-detection">
	<link rel="stylesheet" href="css/weui.css">
	<link rel="stylesheet" href="css/jquery-weui.css">
    <link rel="stylesheet" href="css/style.css">
    <style>
    	table{ border-collapse:collapse; border:1px solid #e7e7e7; width: 100%;}
		table tr td{ border:1px solid #e7e7e7; padding:10px;}
		table th{ padding:15px;}
    </style>
</head>
<body>

    <table>
    	<tr>
    		<th colspan="2">字体大小</th>
    	</tr>
    	<tr>
    		<td>.f12</td>
    		<td>font-size:12px;</td>
    	</tr>
    	<tr>
    		<td>.f13</td>
    		<td>font-size:13px</td>
    	</tr>
    	<tr>
    		<td>.f14</td>
    		<td>font-size:15px;</td>
    	</tr>
    	<tr>
    		<td>.f15</td>
    		<td>font-size:15px;</td>
    	</tr>
    	<tr>
    		<td>.f16</td>
    		<td>font-size:16px;</td>
    	</tr>
    	<tr>
    		<td>.f17</td>
    		<td>font-size:17px;</td>
    	</tr>
    	<tr>
    		<td>.f18</td>
    		<td>font-size:18px;</td>
    	</tr>
    	<tr>
    		<td>.f20</td>
    		<td>font-size:20px;</td>
    	</tr>
    	<tr>
    		<td>.f24</td>
    		<td>font-size:24px;</td>
    	</tr>
    	<tr>
    		<td>.f26</td>
    		<td>font-size:26px;</td>
    	</tr>
    	<tr>
    		<th colspan="2">清除浮动</th>
    	</tr>
    	<tr>
    		<td>.clear</td>
    		<td>清除左右浮动</td>
    	</tr>
    	<!-- padding -->
    	<tr>
    		<th colspan="2">padding</th>
    	</tr>
        <tr>
            <td>.p0</td>
            <td>padding:0;</td>
        </tr>
    	<tr>
    		<td>.p10</td>
    		<td>padding:10px;</td>
    	</tr>
    	<tr>
    		<td>.p15</td>
    		<td>padding:15px;</td>
    	</tr>
    	<tr>
    		<td>.ptb10</td>
    		<td>padding:10px 0;</td>
    	</tr>
    	<tr>
    		<td>.plr10</td>
    		<td>padding:0 10px;</td>
    	</tr>
    	<tr>
    		<td>.pl10</td>
    		<td>padding-left:10px;</td>
    	</tr>
    	<tr>
    		<td>.pr10</td>
    		<td>padding-right:10px;</td>
    	</tr>
    	<tr>
    		<td>.pt10</td>
    		<td>padding-top:10px;</td>
    	</tr>
    	<tr>
    		<td>.pb10</td>
    		<td>padding-bottom:10px;</td>
    	</tr>
    	<!-- margin -->
    	<tr>
    		<th colspan="2">margin</th>
    	</tr>
        <tr>
            <td>.m0</td>
            <td>margin:0;</td>
        </tr>
    	<tr>
    		<td>.m10</td>
    		<td>margin:10px;</td>
    	</tr>
    	<tr>
    		<td>.m15</td>
    		<td>margin:15px;</td>
    	</tr>
    	<tr>
    		<td>.mtb10</td>
    		<td>margin:10px 0;</td>
    	</tr>
    	<tr>
    		<td>.mlr10</td>
    		<td>margin:0 10px;</td>
    	</tr>
    	<tr>
    		<td>.ml10</td>
    		<td>margin-left:10px;</td>
    	</tr>
    	<tr>
    		<td>.mr10</td>
    		<td>margin-right:10px;</td>
    	</tr>
    	<tr>
    		<td>.mt10</td>
    		<td>margin-top:10px;</td>
    	</tr>
    	<tr>
    		<td>.mb10</td>
    		<td>margin-bottom:10px;</td>
    	</tr>
    	<tr>
    		<td>.mt-1</td>
    		<td>margin-top:-1px;</td>
    	</tr>
    	<!-- 左中右对齐 -->
    	<tr>
    		<th colspan="2">文字左中右对齐</th>
    	</tr>
    	<tr>
    		<td>.tal</td>
    		<td>text-align: left;</td>
    	</tr>
    	<tr>
    		<td>.tac</td>
    		<td>text-align: cetner;</td>
    	</tr>
    	<tr>
    		<td>.tar</td>
    		<td>text-align: right;</td>
    	</tr>
    	<!-- 移除伪类边框 -->
    	<tr>
    		<th colspan="2">移除伪类边框</th>
    	</tr>
    	<tr>
    		<td>.b-top</td>
    		<td>border-top: 0!important;</td>
    	</tr>
    	<tr>
    		<td>.b-btm</td>
    		<td>border-bottom: 0!important;</td>
    	</tr>
    	<tr>
    		<td>.b-tb</td>
    		<td>border: 0!important;</td>
    	</tr>
    	<!-- 左右浮动 -->
    	<tr>
    		<th colspan="2">左右浮动</th>
    	</tr>
    	<tr>
    		<td>.fl</td>
    		<td>float:left;</td>
    	</tr>
    	<tr>
    		<td>.fr</td>
    		<td>float:right;</td>
    	</tr>
    </table>


	<script src="js/jquery.min.js"></script>
	<script src="js/jquery-weui.min.js"></script>
</body>
</html>