css实现套餐价格对比表格效果代码

代码语言:html

所属分类:表格

代码描述:css实现套餐价格对比表格效果代码

代码标签: css 套餐 价格 对比 表格

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <style>
        @charset "UTF-8";
    	* {
    	padding:0 0;
    	margin:0 0;
    }
    body {
    	font-size:18px;
    	font-family:"微软雅黑";
    	color:#303030;
    }
    img {
    	border:none;
    }
    p,ul {
    	padding:0;
    	margin:0 0;
    }
    ul li {
    	list-style:none;
    }
    a {
    	color:#4d4d4d;
    	text-decoration:none;
    }
    h1,h2,h3,h4 {
    	font-weight:normal;
    }
    .mainbox {
    	width:1200px;
    	margin:100px auto 0 auto;
    }
    .mainbox h2 {
    	margin:0px auto;
    	font-size:36px;
    	line-height:2em;
    	text-align:center;
    	position:relative;
    }
    .responsive {
    	margin:25px 0 0 0;
    }
    .mainbox table {
    	border-collapse:collapse;
    	border-top:0!important;
    	width:100%;
    }
    .mainbox table th {
    	color:#fff;
    	height:75px;
    	min-width:80px;
    	max-width:60px;
    	white-space:nowrap;
    	border:none;
    	border-radius:10px 10px 0px 0px;
    }
    .mainbox table th,.mainbox table td {
    	text-align:center;
    	font-size:16px;
    	line-height:30px;
    	background:#fff;
    }
    .mainbox .red {
    	color:#e40202;
    }
    .mainbox tr:nth.........完整代码请登录后点击上方下载按钮下载查看

网友评论0