随笔分类 -  html/css

30 分钟学会 Flex 布局
摘要：30 分钟学会 Flex 布局 有酒 有酒 有酒 有酒 有酒 有酒 617 人赞同了该文章 为什么我要写这一篇关于 Flex 布局的教程？ 因为它十分简单灵活，区区简单几行代码就可以实现各种页面的的布局，以前我在学习页面布局的时候我深受其 float、display、position 这些属性的困扰 阅读全文
posted @ 2019-03-27 21:53 年少的你如此美丽 阅读(455) 评论(0) 推荐(0)
CSS Grid布局指南
摘要：简介 CSS Grid布局 （又名"网格"），是一个基于二维网格布局的系统，主要目的是改变我们基于网格设计的用户接口方式。如我们所知，CSS 总是用于网页的样式设置，但它并没有起到很好的作用。刚开始的时候我们使用表格(table)，然后使用浮动(float)、 定位(position)和内联块(in 阅读全文
posted @ 2019-02-16 21:28 年少的你如此美丽 阅读(435) 评论(0) 推荐(0)
css 选择器
摘要：id选择器 > 类选择器 > 标签选择器 > 相邻选择器（h1 + p） > 子选择器 （ul > li） > 后代选择器 （ul li）> 通配符选择器 （*）> 属性选择器（a[rel = "external"]）> 伪类选择器 阅读全文
posted @ 2019-02-16 19:37 年少的你如此美丽 阅读(137) 评论(0) 推荐(0)
css - 盒子模型
摘要：W3C和IE盒子模型 1) W3C定义的盒子模型包括margin、border、padding、content ，元素的width=content的宽度 2) . IE盒子模型与W3C的盒子模型唯一区别就是元素的宽度，元素的width=content+padding+border 我个人认为W3C定 阅读全文
posted @ 2018-11-09 13:50 年少的你如此美丽 阅读(115) 评论(0) 推荐(0)
html移动端 -- meta-模板 + rem
摘要：// rem (function(doc, win) { var docEle = doc.documentElement, evt = "orientationchange" in window ? "orientationchange" : "resize", fn = function() { 阅读全文
posted @ 2018-07-09 13:58 年少的你如此美丽 阅读(384) 评论(0) 推荐(0)
HTML5 移动端头部标签
摘要：原文链接：http://caibaojian.com/mobile-meta.html 上面给出了常用的一些meta属性，下面给一个对meta使用的理解。 meta是html语言head区的一个辅助性标签。也许你认为这些代码可有可无。其实如果你能够用好meta标签，会给你带来意想不到的效果，meta 阅读全文
posted @ 2018-07-09 13:54 年少的你如此美丽
html --- rem
摘要：// rem (function(doc, win) { var docEle = doc.documentElement, evt = "onorientationchange" in window ? "orientationchange" : "resize", fn = function() 阅读全文
posted @ 2018-06-06 14:38 年少的你如此美丽
css-通过css让块显示或隐藏
摘要：Document 1213 阅读全文
posted @ 2018-05-10 11:02 年少的你如此美丽 阅读(305) 评论(0) 推荐(0)
pointer-events
摘要：pointer-events：none 阅读全文
posted @ 2017-12-11 11:54 年少的你如此美丽 阅读(115) 评论(0) 推荐(0)
伪劣清除浮动
摘要：.fix:after{ display:block; content:"clear"; height:0; clear:both; overflow:hidden; visibility:hidden; } 阅读全文
posted @ 2017-10-07 14:07 年少的你如此美丽 阅读(107) 评论(0) 推荐(0)
自定义table样式
摘要：.tableWrap { width: 100%; border-collapse:collapse; border-top:1px solid #e9e9e9; border-left:1px solid #e9e9e9; tr{ th { text-align: center; padding:5px 20px 5px 20px; border-bottom: 1px solid #e9... 阅读全文
posted @ 2017-06-16 11:46 年少的你如此美丽 阅读(189) 评论(0) 推荐(0)
HTML 中 SELECT 选项分组
摘要： 阅读全文
posted @ 2017-06-02 15:16 年少的你如此美丽 阅读(725) 评论(0) 推荐(0)
背景模糊，内容清晰
摘要：1 2 3 4 5 6 47 48 49 50 51 52 Hello,world 53 54 55 56 阅读全文
posted @ 2017-05-03 22:44 年少的你如此美丽 阅读(205) 评论(0) 推荐(0)
自定义滚动条
摘要：1 //自定义滚动条 2 ::-webkit-scrollbar-corner { 3 background-color: transparent; 4 } 5 6 ::-webkit-scrollbar-button { 7 width: 0; 8 height: 0; 9 display: none; 10 } 11 12 ::-webkit-scrol... 阅读全文
posted @ 2017-04-13 10:38 年少的你如此美丽 阅读(120) 评论(0) 推荐(0)