【HTML+CSS】导航栏切换，底部和右侧有边框样式设置

1，神奇的CSS世界，倒腾倒腾，就整出来了，哈哈！

 HTML和CSS：

	
		
			
				{{ item }}
				

			
		
	

    .order-msg {
		width: 100%;

		.nav {
			width: 100%;
			position: relative;
			margin-left: -2px;
			border-bottom: 1px solid #E4E4E4;
			margin-bottom: -2px;

			.nav-list {
				width: 20%;
				padding: 4px 10px 0px;
				text-align: center;
				-webkit-box-sizing: border-box;
				box-sizing: border-box;
				display: inline-block;
				font-size: 15px;
				border-left: 1px solid #E4E4E4;
				margin-top: 10px;
				height: 30px;

				hr {
					margin-top: 8px;
					margin-bottom: -4px;
					background-color:red;
					height:2px;
					border:none;
					visibility: hidden;
				}
			}

			.active {
				visibility: inherit !important;
			}
		}
	}

我还是很厉害的吧，哈哈哈哈哈哈~~~