css3
关注
分享
扫一扫
爱lv行
人与人的区别不是受过教育和没受过教育,而是喜欢阅读和不喜欢阅读
展开
-
三列布局
问题 : 假设高度已知，请写出三栏布局，其中左栏和右栏宽度都为270px,中间自适应 ？floatabsoluteflexboxtablegrid// 第一种方案 float <section class="layout float"> <div class="left">left</div> <...原创 2019-10-26 16:28:23 · 155 阅读 · 0 评论 -
css常用技巧
1：从 html 元素继承 box-sizing html { box-sizing: border-box; } *, *:after, *:before { box-sizing: inherit; }2：使用 :not() 选择器来决定表单是否显示边框//第一种方式ul li { float: left; width: 50px; bor原创 2017-06-08 17:23:35 · 532 阅读 · 0 评论 -
SVG转为字体图标
1：转化网址https://icomoon.io/2：点击右上角IconMoonApp3: 点击 import icon 上传你的本地svg文件4：上传成功选中，全部选中 然后点击右下角 generate font 5: 然后点击 download 下来下来 然后正常向项目中引入font-face 就好了。原创 2017-06-23 22:08:17 · 1082 阅读 · 0 评论 -
reset.css
body,h1,h2,h3,h4,h5,h6,hr,p,blockquote,dl,dt,dd,ul,ol,li,pre,form,fieldset,legend,button,input,textarea,th,td { margin: 0; padding: 0}html { color: #000; backgr原创 2017-04-13 10:47:58 · 387 阅读 · 0 评论 -
grid测试
<!DOCTYPE html><html><head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>grid</title></head><body> <div class="wrapper"> <div class="let原创 2017-10-29 22:32:44 · 373 阅读 · 0 评论 -
css grid
html <section class="section section_1"> <div class="grid"> <div class="columns">001</div> <div class="columns">002</div> <div class="columns">003</div>原创 2018-01-24 17:26:52 · 181 阅读 · 0 评论 -
奇舞-css概念与简单选择器-笔记
版本(Level)css Level1css Level2 css2.1(规范)css Level3Color Module Level 3Selectors Level 3Media QueresFonts Level 3CSS 规则 使用css <!-- 外链 --> <link rel="stylesheet" href="/path/to/style.css">原创 2018-04-02 10:37:49 · 149 阅读 · 0 评论 -
移动端隐藏scroll滚动条::-webkit-scrollbar
::-webkit-scrollbar {display: none;/*隐藏滚轮*/}原创 2017-06-03 23:48:11 · 12629 阅读 · 1 评论 -
-webkit-appearance:none;
去除checkbox radio 默认样式-webkit-appearance:none;原创 2017-06-07 23:34:49 · 547 阅读 · 0 评论 -
date 基本样式修改
.birth_date::-webkit-datetime-edit { /* padding: 1px; background: url(../images/dot_active_2.png);*/ } .birth_date::-webkit-datetime-edit-fields-wrapper { background-color: #eee;原创 2017-06-07 08:51:35 · 1244 阅读 · 0 评论 -
css 命名规范
网页公共命名1：wrapper 页面外围控制整体布局宽度2：container或content 容器用于最外层3：headhuo header 页面头部4 : foot或footer 页脚部分5：nav 主导航6：subnav 二级导航7：menu 菜单8：submenu 子菜单9：sideBar 侧栏10： sudebar_a sidebar_b 左边栏 和或右边栏11：main 页面主题12：t原创 2017-04-14 14:02:55 · 295 阅读 · 0 评论 -
代码规范
01 黄金定律：不管有多少人共同参与同一项目， 一定要确保每一行代码都像是同一个人编写的。 02: 语法；用两个空格来代替制表符（tab）， – 这是唯一能保证在所有环境下获得一致展现的方法。 03：嵌套元素应当缩进一次（即两个空格）04：对于属性的定义 确保全部使用双引号 绝对不要使用单引号05：不要在自闭和元素的尾部添加斜线06：不要省略结束标签07：语言属性： 根据HTMN5 规范08：强原创 2017-04-14 14:08:27 · 724 阅读 · 0 评论 -
CSS3D
1：透视2：3D变形函数3：3D加速4：开启3D只针对子元素：-webkit-transform-style:preserve-3d;-webkit-perspective:300;调节视角 ：-webkit-perspective-orifin:25% 75% ;translate transform5：3D加速-webkit-transform:translate3d(0,0,0);-原创 2017-04-14 14:30:59 · 558 阅读 · 0 评论 -
HTML5与CSS3实现动态网页（笔记）
欢迎使用Markdown编辑器写博客本Markdown编辑器使用StackEdit修改而来，用它写博客，将会带来全新的体验哦：Markdown和扩展Markdown简洁的语法代码块高亮图片链接和图片上传LaTex数学公式UML序列图和流程图离线写博客导入导出Markdown文件丰富的快捷键快捷键加粗 Ctrl + B 斜体 Ctrl + I 引用 Ctrl原创 2017-04-13 10:40:09 · 6369 阅读 · 0 评论 -
css3d-魔方
html<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title>3D魔方</title> <link href="3d.css" rel="stylesheet" type="text/css"></head><body> <h2 align="center"> 3d魔方</h2>原创 2017-05-09 14:48:51 · 453 阅读 · 0 评论 -
media.css
@media (min-width: 768px) { .container { width: 750px; margin: 0 auto; }}@media (min-width: 992px) { .container { width: 970px; }}@media (min-wid原创 2017-06-05 10:21:30 · 420 阅读 · 0 评论 -
background-attachment: fixed;
html<!DOCTYPE html><html><head> <meta charset="utf-8"> <title></title> <link rel="stylesheet" type="text/css" href="./css/style.css"></head><body> <section></section> <section></s原创 2017-06-02 15:47:56 · 707 阅读 · 0 评论 -
初试css3 calc 属性
<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>测试calc</title> <meta name="viewport" content="width=device-width, initial-scale=1"> <style type="text/css"> * { ma原创 2017-06-02 17:19:05 · 442 阅读 · 0 评论 -
css高级技巧整理
1：继承box-sizing html { box-sizing: border-box; } *,*:after,*:before { box-sizing: inherit; }2：使用 :not() 选择器：last-child 选择器 2.1: last-child 的使用ul { width: 800px;原创 2017-04-28 11:55:51 · 255 阅读 · 0 评论