支持tab键盘选择的折叠框效果

代码语言:html

所属分类:选项卡

代码描述:支持tab键盘选择的折叠框效果

代码标签: 选择 折叠 效果

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

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">

<style>
/* CSS Reset */

html, body {
	font-size: 100%;
}

html, body, header, footer, main, section, div, 
h1, h2, p, button {
	margin: 0;
	padding: 0;
	border: 0;
	vertical-align: baseline;
}

header, footer, main, section {
	display: block;
}

button, svg {
	box-sizing: border-box;
}

@-ms-viewport	{ width: device-width; }
@-o-viewport		{ width: device-width; }
@viewport		{ width: device-width; }

/* Common Settings */

body {
	font-family: "Roboto", "Arial", "Helvetica", sans-serif;
	line-height: 1.8;
	color: #000000;
	background-color: #FFFFFF;
}

header, footer, main {
	margin: 2rem auto;
	width: 90%;
}

@media all and (min-width: 37rem) {
header, footer, main {
	width: 80%;
}
}

@media all and (min-width: 50rem) {
header, footer, main {
	width: 40rem;
}
}

header {
	border-bottom: 2px solid .........完整代码请登录后点击上方下载按钮下载查看

网友评论0