css实现报价套餐型号对比表格效果代码
代码语言：html
所属分类：表格
代码描述：css实现报价套餐型号对比表格效果代码
下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum=1.0,minimum=1.0,user-scalable=0" />
</head>
<body>
<table units="hasPercent" _innercreatetable="true" cellpadding="10" width="1200px" height="2122px" align="CENTER" border="1" bordercolor="rgb(226, 226, 226)" style="float:none;border-collapse:collapse;border:1px solid #E2E2E2;">
<tbody>
<tr>
<td valign="top" bordercolor="rgb(226, 226, 226)" style="padding:10px;border:1px solid #E2E2E2;" align="left" rowspan="1" colspan="2" height="59.5">
<img src='//repo.bfw.wiki/bfwrepo/icon/60ecf359eb0c5.png' />
</td>
<td valign="middle" bordercolor="rgb(226, 226, 226)" style="padding:10px;border-top:1px solid #E2E2E2;border-right:none;border-bottom:1px solid #E2E2E2;border-left:1px solid #E2E2E2;background-color:transparent;" align="center" bgcolor="transparent" bselect="top,right,bottom,left"
height="59.5"><strong><span style="color:#000000;font-size:16px;">开源版</span></strong></td>
<td valign="middle" bordercolor="rgb(226, 226, 226)" style="padding:10px;border-top:1px solid #E2E2E2;border-right:none;border-bottom:1px solid #E2E2E2;border-left:1px solid #E2E2E2;background-color:transparent;" bgcolor="transparent" bselect="top,right,bottom,left"
align="center" height="59.5"><strong><span style="color:#000000;font-size:16px;">银河版</span></strong></td>
<td valign="middle" bordercolor="rgb(226, 226, 226)" style="padding:10px;border-top:1px solid #E2E2E2;border-right:none;border-bottom:1px solid #E2E2E2;border-left:1px solid #E2E2E2;background-color:transparent;" bgcolor="transparent" bselect="top,right,bottom,left"
align="center" height="59.5"><strong><span style="color:#000000;font-size:16px;">宇宙版 <img src="//repo.bfw.wiki/bfwrepo/icon/5dfc70a2007c2.gif" width="22" height="11" alt="2000041" style=""></span></strong></td>
<td valign="middle" bordercolor="rgb(226, 226, 226)" style="padding:10px;border:1px solid #E2E2E2;background-color:transparent;" bgcolor="transparent" bselect="top,right,bottom,left" align="center" height="59.5"><strong><span style="color:#000000;font-size:16px;">白洞版 <img src="//repo.bfw.wiki/bfwrepo/icon/5dfc70a2007c2.gif" width="22" height="11" alt="2000041" style=""></span></strong></td>
</tr>
<tr>
<td bordercolor="rgb(226, 226, 226)" valign="top" style="font-size:12px;border:1px solid #E2E2E2;word-break:normal;text-align:justify;padding:10px;" align="left" rowspan="1" colspan="2">
<p style="text-indent:28px;"><strong><span style="font-size:14px;"><span style="font-size:14px;color:#000000;">业务模式</span><br></span></strong></p>
</td>
<td width="16.7%" bordercolor="rgb(226, 226, 226)" valign="middle" style="font-size:12px;border:1px solid #E2E2E2;word-break:normal;padding:10px;background-color:transparent;" align="center" bgcolor="transparent" bselect="top,right,bottom,left"><span style="font-size:14px;color:#000000;">B2C</span></td>
<td width="16.7%" bordercolor="rgb(226, 226, 226)" valign="middle" style="font-size:12px;border-top:none;border-right:1px solid #E2E2E2;border-bottom:1px solid #E2E2E2;border-left:1px solid #E2E2E2;word-break:normal;padding:10px;background-color:transparent;"
bgcolor="transparent" bselect="top,right,bottom,left" align="center"><span style="color:#000000;font-size:14px;">B2C</span></td>
<td width="16.7%" bordercolor="rgb(226, 226, 226)" valign="middle" style="font-size:12px;border-top:none;border-right:1px solid #E2E2E2;border-bottom:1px solid #E2E2E2;border-left:1px solid #E2E2E2;word-break:normal;padding:10px;background-color:transparent;"
bgcolor="transparent" bselect="top,right,bottom,left" align="center"><span style="color:#000000;font-size:14px;">B2B2C</span></td>
<td width="16.7%" bordercolor="rgb(226, 226, 226)" valign="middle" style="font-size:12px;border-top:none;border-right:1px solid #E2E2E2;border-bottom:1px solid #E2E2E2;border-left:1px solid #E2E2E2;word-break:normal;padding:10px;background-color:transparent;"
bgcolor="transparent" bselect="top,right,bottom,left" align="center"><span style="color:#000000;font-size:14px;">B2B2C</span></td>
</tr>
<tr>
<td bordercolor="rgb(226, 226, 226)" valign="top" style="font-size:12px;border:1px solid #E2E2E2;word-break:normal;text-align:justify;padding:10px;" rowspan="1" colspan="2">
<p style="text-indent:28px;"><strong><span style="color:#000000;font-size:14px;">适用群体</span></strong></p>
</td>
<td width="16.7%" bordercolor="rgb(226, 226, 226)" valign="middle" style="font-size:12px;border:1px solid #E2E2E2;word-break:normal;padding:10px;background-color:transparent;" bgcolor="transparent" bselect="top,right,bottom,left" align="center"><span style="color:#000000;font-size:14px;">个人、初学者</span></td>
<td width="16.7%" bordercolor="rgb(226, 226, 226)" valign="middle" style="font-size:12px;border:1px solid #E2E2E2;word-break:normal;padding:10px;background-color:transparent;" bgcolor="transparent" bselect="top,right,bottom,left" align="center"><span style="color:#000000;font-size:14px;">自营店、小规模企业<br></span></td>
<td width="16.7%" bordercolor="rgb(226, 226, 226)" valign="middle" style="font-size:12px;border:1px solid #E2E2E2;word-break:normal;padding:10px;background-color:transparent;" bgcolor="transparent" bselect="top,right,bottom,left" align="center"><span style="color:#000000;font-size:14px;">自营+入驻、中小型企业</span></td>
<td width="16.7%" bordercolor="rgb(226, 226, 226)" valign="middle" style="font-size:12px;border:1px solid #E2E2E2;word-break:normal;padding:10px;background-color:transparent;" bgcolor="transparent" bselect="top,right,bottom,left" align="center"><span style="color:#000000;font-size:14px;">自营+入驻、大中型企业</span></td>
</tr>
<tr>
<td bordercolor="rgb(226, 226, 226)" valign="top" style="font-size:12px;border:1px solid #E2E2E2;word-break:normal;text-align:justify;padding:10px;" rowspan="1" colspan="2">
<p style="text-indent:28px;"><strong><span style="color:#000000;font-size:14px;">加密程度<br></span></strong></p>
</td>
<td width="16.7%" bordercolor="rgb(226, 226, 226)" valign="middle" style="font-size:12px;border:1px solid #E2E2E2;word-break:normal;padding:10px;background-color:transparent;" bgcolor="transparent" bselect="top,right,bottom,left" align="center"><span style="color:#000000;font-size:14px;">全开源，无加密</span></td>
<td width="16.7%" bordercolor="rgb(226, 226, 226)" valign="middle" style="font-size:12px;border:1px solid #E2E2E2;word-break:normal;padding:10px;background-color:transparent;" bgcolor="transparent" bselect="top,right,bottom,left" align="center"><span style="color:#000000;font-size:14px;">提供全部源码，无加密</span></td>
<td width="16.7%" bordercolor="rgb(226, 226, 226)" valign="middle" style="font-size:12px;border:1px solid #E2E2E2;word-break:normal;padding:10px;background-color:transparent;" bgcolor="transparent" bselect="top,right,bottom,left" align="center"><span style="color:#000000;font-size:14px;">提供全部源码，无加密</span></td>
<td width="16.7%" bordercolor="rgb(226, 226, 226)" valign="middle" style="font-size:12px;border:1px solid #E2E2E2;word-break:normal;padding:10px;background-color:transparent;" bgcolor="transparent" bselect="top,right,bottom,left" align="center"><span style="color:#000000;font-size:14px;">提供全部源码，无加密</span></td>
</tr>
<tr>
<td width="9.3%" bordercolor="rgb(226, 226, 226)" valign="top" style="font-size:12px;border-top:1px solid #E2E2E2;border-right:1px solid #E2E2E2;border-bottom:none;border-left:1px solid #E2E2E2;word-break:normal;text-align:justify;padding:10px;" rowspan="7"
colspan="1">
<p style="text-indent:28px;"><strong><span style="color:#000000;font-size:14px;">服务内容</span></strong><br></p>
</td>
<td width="17.4%" bordercolor="rgb(226, 226, 226)" valign="top" style="font-size:12px;border:1px solid #E2E2E2;word-break:normal;text-align:justify;padding:10px;" align="left">
<p style="text-indent:28px;"><span style="font-size:14px;color:#000000;">商业授权</span></p>
</td>
<td width="16.7%" bordercolor="rgb(226, 226, 226)" valign="middle" style="font-size:12px;border:1px solid #E2E2E2;word-break:normal;padding:10px;background-color:transparent;" bgcolor="transparent" bselect="top,right,bottom,left" align="center"><span style="color:#000000;font-size:14px;">AGPL3.0协议</span></td>
<td width="16.7%" bordercolor="rgb(226, 226, 226)" valign="middle" style="font-size:12px;border:1px solid #E2E2E2;word-break:normal;padding:10px;background-color:transparent;" bgcolor="transparent" bselect="top,right,bottom,left" align="center"><span style="color:#000000;font-size:14px;">永久授权</span></td>
<td width="16.7%" bordercolor="rgb(226, 226, 226)" valign="middle" style="font-size:12px;border:1px solid #E2E2E2;word-break:normal;padding:10px;background-color:transparent;" bgcolor="transparent" bselect="top,right,bottom,left" align="center"><span style="color:#000000;font-size:14px;">永久授权</span></td>
<td width="16.7%" bordercolor="rgb(226, 226, 226)" valign="middle" style="font-size:12px;border:1px solid #E2E2E2;word-break:normal;padding:10px;background-color:transparent;" bgcolor="transparent" bselect="top,right,bottom,left" align="center"><span style="color:#000000;font-size:14px;">永久授权</span></td>
</tr>
<tr>
<td width="17.4%" bordercolor="rgb(226, 226, 226)" valign="middle" style="font-size:12px;border-top:1px solid #E2E2E2;border-right:1px solid #E2E2E2;border-bottom:none;border-left:1px solid #E2E2E2;word-break:normal;padding:10px;background-color:transparent;"
align="left" bgcolor="transparent" bselect="top,right,bottom,left">
<p style="text-indent:28px;"><span style="font-size:14px;color:#000000;">代码更新</span></p>
</td>
<td width="16.7%" bordercolor="rgb(226, 226, 226)" valign="middle" style="font-size:12px;border-top:1px solid #E2E2E2;border-right:1px solid #E2E2E2;border-bottom:1px solid #E2E2E2;border-left:none;word-break:normal;padding:10px;background-color:transparent;"
align="center" bgcolor="transparent" bselect="top,right,bottom,left">
<p style="text-indent:0em;line-height:1.7em;"><span style="color:#FB8C00;text-align:center;font-size:20px;"><span style="color:#000000;text-align:-webkit-center;font-size:14px;">Gitee、Github更新</span></span>
</p>
</td>
<td width="16.7%" bordercolor="rgb(226, 226, 226)" valign="middle" style="font-size:12px;border:1px solid #E2E2E2;word-break:normal;padding:10px;background-color:transparent;" bgcolor="transparent" bselect="top,right,bottom,left" align="center"><span style="font-size:14px;color:#000000;">Git私服更新</span></td>
<td width="16.7%" bordercolor="rgb(226, 226, 226)" valign="middle" style="font-size:12px;border:1px solid #E2E2E2;word-break:normal;padding:10px;background-color:transparent;" bgcolor="transparent" bselect="top,right,bottom,left" align="center"><span style="text-align:-webkit-center;font-size:14px;color:#000000;">Git私服更新</span></td>
<td width="16.7%" bordercolor="rgb(226, 226, 226)" valign="middle" style="font-size:12px;border:1px solid #E2E2E2;word-break:normal;padding:10px;background-color:transparent;" bgcolor="transparent" bselect="top,right,bottom,left" align="center"><span style="color:#000000;text-align:-webkit-center;font-size:14px;">Git私服更新</span></td>
</tr>
<tr>
<td width="17.4%" bordercolor="rgb(226, 226, 226)" valign="middle" style="font-size:12px;border:1px solid #E2E2E2;word-break:normal;padding:10px;background-color:transparent;" align="left" bgcolor="transparent" bselect="top,right,bottom,left">
<p style="text-indent:28px;"><span style="font-size:14px;color:#000000;">企业售后群</span></p>
</td>
<td width="16.7%" bordercolor="rgb(226, 226, 226)" valign="middle" style="font-size:12px;border-top:1px solid #E2E2E2;border-right:1px solid #E2E2E2;border-bottom:1px solid #E2E2E2;border-left:none;word-break:normal;padding:10px;background-color:transparent;"
bgcolor="transparent" bselect="top,right,bottom,left" align="center">
<p style="text-indent:0em;"><span style="color:#FB8C00;text-align:center;font-size:20px;">×</span></p>
</td>
<td width="16.7%" bordercolor="rgb(226, 226, 226)" valign="middle" style="font-size:12px;border:1px solid #E2E2E2;word-break:normal;padding:10px;background-color:transparent;" bgcolor="transparent" bselect="top,right,bottom,left" align="center"><span style="color:#8B0EEA;text-align:center;font-size:20px;">√</span></td>
<td width="16.7%" bordercolor="rgb(226, 226, 226)" valign="middle" style="font-size:12px;border:1px solid #E2E2E2;word-break:normal;padding:10px;background-color:transparent;" bgcolor="transparent" bselect="top,right,bottom,left" align="center"><span style="color:#8B0EEA;text-align:center;font-size:20px;">√</span></td>
<td width="16.7%" bordercolor="rgb(226, 226, 226)" valign="middle" style="font-size:12px;border:1px solid #E2E2E2;word-break:normal;padding:10px;background-color:transparent;" bgcolor="transparent" bselect="top,right,bottom,left" align="center"><span style="color:#8B0EEA;text-align:center;font-size:20px;">√</span></td>
</tr>
<tr>
<td style="padding:10px;font-size:12px;word-break:normal;text-align:justify;border-top:none;b.........完整代码请登录后点击上方下载按钮下载查看
热门代码搜索
其他语言代码库
Html代码库
Python代码库
Java代码库
Php代码库
Phpcli代码库
Golang代码库
C#代码库
Nodejs代码库
C代码库
C++代码库
Sql代码库
R代码库
Rust代码库
Ruby代码库
Dart代码库
Vb代码库
D代码库
F#代码库
Typescript代码库
Coffeescript代码库
Julia代码库
Kotlin代码库
Perl代码库
Groovy代码库
Lua代码库
Vala代码库
Ocaml代码库
Assembly代码库
Objectc代码库
Scala代码库
Erlang代码库
Pascal代码库
Swift代码库
Fortran代码库
Bash代码库
Clojure代码库
Ada代码库
Elixir代码库
Cobol代码库
Haskell代码库
Nim代码库
Racket代码库
Lisp代码库
网友评论0