/*去掉默认样式*/ * { margin:0; padding:0; font-family:'微软雅黑'; } ul li { list-style:none; } a { text-decoration:none; } .box { width:100%; height:540px; background:#67CBD1; margin-top:300px; } /*最大的盒子*/ .box1 { width:70%; height:360px; margin:auto; position:relative; } /*中间的盒子*/ .hide-t { width:800px; height:540px; background:rgba(204,204,204,.3); position:absolute; top:60px; left:265px; } /* 隐藏部分的通用样式 */ /*隐藏开始*/ .hide1 { display:none; } .hide2 { display:none; } .hide3 { display:none; } .hide4 { display:none; } .hide5 { display:none; } .hide6 { display:none; } /*隐藏结束*/ .hide-1 span { width:150px; color:#fd5501; font-size:19px; display:inline-block; margin:45px 0 0 25px; } .box3-2 .hide-1 a { font-size:17px; color:#fff; display:inline-block; margin-left:20px; padding-bottom:5px; border-bottom:1px solid #eef3f2; } .box3-2 .hide2 a { color:#000; } .box3-2 .hide3 a { color:#ffff00; } .box3-2 .hide4 a { color:#666; } .box3-2 .hide5 a { color:#6600ff; } .box3-2 .hide6 a { color:#006600; } .box3-2 .hide-1 a:hover { transition:.1s; transform:scale(1.3,1.3); color:#660; border-bottom-color:#660; } /*鼠标放上去字体变颜色且变大过渡时间0.1秒*/ /*显示开始*/ .box2 .show1:hover .hide1 { display:block; } .box2 .show2:hover .hide2 { display:block; } .box2 .show3:hover .hide3 { display:block; } .box2 .show4:hover .hide4 { display:block; } .box2 .show5:hover .hide5 { display:block; } .box2 .show6:hover .hide6 { display:block; } /*显示结束*/ /*鼠标滑过加背景颜色*/ .show1:hover { background:rgba(255,255,255,.2); } .show2:hover { background:rgba(255,255,255,.2); } .show3:hover { background:rgba(255,255,255,.2); } .show4:hover { background:rgba(255,255,255,.2); } .show5:hover { background:rgba(255,255,255,.2); } .show6:hover { background:rgba(255,255,255,.2); } .box2 { width:265px; height:599px; background:rgba(24,142,238,.8); position:absolute; top:-60px; } /*全部课程大盒子*/ .box2-1 { height:60px; width:265px; color:#fff; font-size:20px; line-height:60px; padding-left:40px; } /*全部课程文字*/ .box3 { width:265px; height:89px; border-bottom:1px solid #1681C4; } /*中间的单独导航小块*/ /*全部课程下的导航文字样式开始*/ .box3-1 { color:#fff; font-size:20px; display:inline-block; padding:10px 0 0 15px; } .box3-1t { color:#e9e9e9; padding-left:120px; } /*设置" > "的样式 */ .box3-2 { margin-top:15px; } .box3-2 .nav { padding-left:15px; color:#d2d8d7; } /*全部课程下的导航文字样式结束*/