2021年6月27日
vw开发
摘要： <style> /* vw等于屏幕视口宽度的1% */ div { background-color: aqua; /* 表示20%的视口宽度 */ width: 20vw; height: 20vw; } </style> </head> <body> <div class="test"></di 阅读全文
posted @ 2021-06-27 17:19 贾正直 阅读(45) 评论(0) 推荐(0)
栅格系统
摘要： <body> <div class="container"> <div class="row"> <div class="col-lg-3 col-xs-6">1</div> <div class="col-lg-3 col-xs-6">2</div> <div class="col-lg-3 co 阅读全文
posted @ 2021-06-27 16:46 贾正直 阅读(159) 评论(0) 推荐(0)
bootstrap入门
摘要： 下载文件 起步 · Bootstrap v3 中文文档 | Bootstrap 中文网 (bootcss.com) 引入css <link rel="stylesheet" href="bootstrap/bootstrap-3.4.1-dist/css/bootstrap.min.css"> 引用 阅读全文
posted @ 2021-06-27 12:51 贾正直 阅读(38) 评论(0) 推荐(0)
less入门
摘要： @green:green; @size100:100px; // 安装easy less插件保存less会生成同名css文件 // 计算时有多个单位以第一个单位为主 // 计算空格 // 写为元素加& div{ background-color: @green; font-size: @size10 阅读全文
posted @ 2021-06-27 12:00 贾正直 阅读(34) 评论(0) 推荐(0)
css条件引入
摘要： 屏幕上页面宽度小于500px时将jd.css引入页面中 <link rel="stylesheet" href="jd.css" media="screen and (max-width:500px)"> 阅读全文
posted @ 2021-06-27 11:01 贾正直 阅读(131) 评论(0) 推荐(0)
rem布局方式
摘要： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="wi 阅读全文
posted @ 2021-06-27 10:53 贾正直 阅读(40) 评论(0) 推荐(0)
flex子元素属性
摘要： <style> div { display: flex; width: 100%; height: 500px; } span { width: 200px; height: 200px; background-color: aquamarine; } span:nth-child(2) { /* 阅读全文
posted @ 2021-06-27 09:33 贾正直 阅读(141) 评论(0) 推荐(0)
flex布局入门
摘要： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="wi 阅读全文
posted @ 2021-06-27 09:07 贾正直 阅读(38) 评论(0) 推荐(0)