dirg实现自适应响应式网格grid布局示例代码

代码语言:html

所属分类:布局界面

代码描述:dirg实现自适应响应式网格grid布局示例代码

代码标签: dirg 自适应 响应式 网格 grid 布局

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

<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/dirg.min.css">
    <style>
        body {
	margin:2rem;
	font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif
}
.DIRG>div {
	padding:1rem;
	color:#fff
}
.DIRG>div:nth-of-type(1) {
	background:orange
}
.DIRG>div:nth-of-type(2) {
	background:hotpink
}
.DIRG>div:nth-of-type(3) {
	background:olivedrab
}
.DIRG>div:nth-of-type(4) {
	background:dodgerblue
}
.DIRG>div:nth-of-type(5) {
	background:slategray
}
.DI.........完整代码请登录后点击上方下载按钮下载查看

网友评论0