CSS - 文章分类 - linyongqin

float元素浮动后高度不一致导致错位的解决办方法

摘要：参考资料： float元素浮动后高度不一致导致错位的解决办方法阅读全文

posted @ 2018-04-11 14:44 linyongqin 阅读(247) 评论(0) 推荐(0)

子元素高度与父元素一致

摘要：参考资料：http://blog.csdn.net/ann295258232/article/details/52680438 阅读全文

posted @ 2018-03-21 15:18 linyongqin 阅读(613) 评论(0) 推荐(0)

容器高度随宽度等比例变化

摘要：参考资料：https://segmentfault.com/a/1190000006631310 阅读全文

posted @ 2018-03-21 15:10 linyongqin 阅读(132) 评论(0) 推荐(0)

元素居中的解决方案

摘要：居中 1.水平居中 1.1 文本、图片等行内元素的水平居中 text-align: center; 1.2 确定宽度的块级元素的水平居中方法一：块级元素设置宽度，margin-left: auto; margin-right: auto; 方法二：块级元素设置 position: relati 阅读全文

posted @ 2017-11-19 16:18 linyongqin 阅读(252) 评论(0) 推荐(0)

使用 CSS 3 实现简单二级菜单

摘要：IE 9+ 运用 CSS 3 属性：效果图：阅读全文

posted @ 2017-11-18 17:23 linyongqin 阅读(262) 评论(0) 推荐(0)

calc 函数实现自适应布局

摘要：calc 函数在渲染时动态计算属性值 IE 9+ 效果图：阅读全文

posted @ 2017-11-16 22:12 linyongqin 阅读(130) 评论(0) 推荐(0)

用rem开发响应式设计

摘要：IE 9+ 效果图：思路参考：《移动Web前端高效开发实战》 P115 将设计稿的任意 px 值转成 rem 值：页面的基准 font-size 值设置为页面根元素的 1/10 宽度假设设计稿宽度是 640 像素，1rem = (640/10)px = 64px ，那么 px 值转成 rem 阅读全文

posted @ 2017-11-16 00:34 linyongqin 阅读(155) 评论(0) 推荐(0)

CSS 小三角

摘要：场景应用：下拉菜单小三角 IE 8+ 效果图：注意：content 属性一定不能少阅读全文

posted @ 2017-11-15 23:21 linyongqin 阅读(126) 评论(0) 推荐(0)

CSS 背景

摘要：css height 100% CSS成功设置DIV高度百分之百 box-sizing: border-box; 内容宽度（高度）= 设定宽度（高度） - 边框宽度（高度） - 内边距宽度（高度） background-size 设定背景图大小 => IE 9+ background-origin 阅读全文

posted @ 2017-11-14 22:28 linyongqin 阅读(101) 评论(0) 推荐(0)

判断浏览器版本是否是ie9以下浏览器，提示升级

摘要：参考资料：判断浏览器版本是否是ie8以下浏览器，如果是调到提示换更高级版本浏览器页面阅读全文

posted @ 2017-06-03 09:50 linyongqin 阅读(8319) 评论(0) 推荐(0)

响应式布局模板

摘要：效果图： HTML 代码： CSS 代码：涉及知识点： 1.媒体查询参考资料：利用@media screen实现网页布局的自适应 2.respond.js 解决 IE9 以下浏览器不支持媒体查询 3.clearfix 4.Reset CSS 兼容浏览器： IE7-10 、 Chrome 、火狐阅读全文

posted @ 2017-06-01 21:57 linyongqin 阅读(274) 评论(0) 推荐(0)

视频区域自适应

摘要：/*视频区域自适应*/ .video { position: relative; padding-bottom: 66.66666667%; /* 高度 / 宽度 */ height: 0; overflow: hidden; } .video iframe, .video object, .video embed { position: abs... 阅读全文

posted @ 2017-04-28 17:38 linyongqin 阅读(160) 评论(0) 推荐(0)

HTML 头部

摘要：viewport：我们称之为视图，其实是移动端览器上的虚拟窗口，viewport的边缘代替了浏览器的边缘，成为了窗口的边缘。默认情况下这个虚拟窗口要比实际窗口大。移动端最初这么做的目的是为了不让页面缩在一个很小的屏幕上影响阅读，而是让用户通过缩放和拖动的手势浏览网页的不同部分。这么做可以让那些没有针阅读全文

posted @ 2017-04-09 10:45 linyongqin 阅读(172) 评论(0) 推荐(0)

如何兼容 IE 浏览器

摘要：参考资料： 9个最常见的IE bug 以及如何修复它们浏览器 hack 方式史上最全的CSS hack方式一览阅读全文

posted @ 2017-04-08 17:21 linyongqin 阅读(133) 评论(0) 推荐(0)

flex 跨浏览器的三列布局

摘要：兼容浏览器： IE10+，Chrome，火狐，Safari，Opear 《图解CSS3：核心技术与案例实战》源码\code\chapter-8\8-57.html 参考资料： Flex 布局教程：语法篇阅读全文

posted @ 2017-04-08 16:14 linyongqin 阅读(257) 评论(0) 推荐(0)

HTML5实践 -- 使用CSS3 Media Queries实现响应式设计

摘要：参考：HTML5实践 -- 使用CSS3 Media Queries实现响应式设计阅读全文

posted @ 2017-04-08 15:59 linyongqin 阅读(99) 评论(0) 推荐(0)

渐变效果（渐变生成器）

摘要：参考：Ultimate CSS Gradient Generator（渐变生成器）阅读全文

posted @ 2017-04-08 15:22 linyongqin 阅读(390) 评论(0) 推荐(0)

文本背景透明

摘要：效果图：阅读全文

posted @ 2017-04-08 15:18 linyongqin 阅读(172) 评论(0) 推荐(0)

新闻内容

摘要：相关资料：CSS 外边距(margin)重叠及防止方法阅读全文

posted @ 2017-04-03 10:30 linyongqin 阅读(124) 评论(0) 推荐(0)

清除浮动

摘要：写法1：写法2：阅读全文

posted @ 2017-04-03 09:47 linyongqin 阅读(80) 评论(0) 推荐(0)

linyongqin

文章分类 - CSS

公告