介绍 & lt; ! DOCTYPE html>
& lt; html>
& lt; head>
,,,& lt; meta http-equiv=癈ontent-Type",内容=皌ext/html;, charset=GB2312",/比;
,,,& lt; title> 163邮箱tab
,,,& lt; style 类型=拔谋?css"比;
,,,,,,* {
,,,,,,,,,,,保证金:,0 px;
,,,,,,,,,,,填充:,0 px;
,,,,,,,}
,,,,,,.dvTab
,,,,,,,{
,,,,,,,,,,,字体类型:,& # 39;Microsoft Yahei& # 39; verdana;
,,,,,,,,,,,字体大小:14 px;
,,,,,,,,,,,身高:,36 px;
,,,,,,,,,,,位置:,绝对;
,,,,,,,,,,,左:,0 px;
,,,,,,,,,,,宽度:,100%;
,,,,,,,,,,,:,52 px;
,,,,,,,}
,,,,,,.menu
,,,,,,,{
,,,,,,,,,,,margin-left: 12 px;
,,,,,,,,,,,颜色:,rgb (106,, 106,, 106);
,,,,,,,}
,,,,,,.tab
,,,,,,,{
,,,,,,,,,,,list-style-type:没有;
,,,,,,,,,,,浮动:左;
,,,,,,,,,,,margin-right:, 1 px;
,,,,,,,,,,,边界:solid 1 px # B9C4CF;
,,,,,,,,,,,宽度:91 px;
,,,,,,,,,,,背景:,-moz-linear-gradient (center top ,, rgb (254,, 255,, 255),, rgb (218,, 232,, 246)), repeat scroll 0%, 0%,透明;
,,,,,,,,,,,background - color: # EBF3FA;
,,,,,,,,,,,身高:23 px;
,,,,,,,,,,,行高:23 px;
,,,,,,,,,,,text-align:,中心;
,,,,,,,,,,,填充:,5 px 20 px 4 px 8 px;,,,,,,,,,,,
,,,,,,,,,,,border-top-left-radius:, 3 px;
,,,,,,,,,,,border-top-right-radius:, 3 px;,,,,,,,,,,,,
,,,,,,,,,,,文本溢出:,省略;
,,,,,,,}
,,,,,,.dv
,,,,,,,{
,,,,,,,,,,,宽度:,100%;
,,,,,,,,,,,身高:4 px;,,,,,
,,,,,,,,,,,行高:4 px;,,,,,,,
,,,,,,,,,,,background - color: # 135 aa4;
,,,,,,,,,,,位置:绝对;
,,,,,,,,,,,左:0;
,,,,,,,,,,,:33 px;
,,,,,,,}
,,,,,,.activeTab
,,,,,,,{,,
,,,,,,,,,,,颜色:# fff;
,,,,,,,,,,,边框颜色:# 135 aa4;
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
这篇文章将为大家详细讲解有关css实现选项卡效果仿163邮箱样式的方法,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。
代码如下:
