低版本浏览器flex布局无法继承容器宽高问题,包含chrome

发表于 css3 分类,标签:
img{max-width:100%;} 问题:当一个容器设置高,并采取flex布局,如下1效图,白色框设置了flex-basic:38px; 蓝色框设置的flex-basic:auto;并且自动扩充,但是蓝色框子元素直接height:100%,在低版本浏览器,是获取不到父元素高度的。说直白点,就是父元素flex-basic:auto;子元素 height:100%,是无法获取到高度的!如:chrome升级chrome版本到以下版本,能正常获取,本文主要说低版本如何正常获取容器高度。 &nbs...

css工具

发表于 css3 分类,标签:
css clip-path工具https://www.html.cn/tool/css-clip-path/  ...

css 动效网址

发表于 css3 分类,标签:
1.CSS实现抛物线运动效果 https://www.zhangxinxu.com/wordpress/2018/08/css-css3-%E6%8A%9B%E7%89%A9%E7%BA%BF%E5%8A%A8%E7%94%BB/ ...

css3翻书效果

发表于 css3 分类,标签:
强力推荐https://www.html5tricks.com/demo/css3-page-flip/index.html 推荐 https://www.html5tricks.com/demo/html5-css3-book/index.html https://www.html5tricks.com/demo/jiaoben2304/index.html#book7/page4-5 简易效果https://www.html5tricks.com/demo/html5-book-page/index.html https://www.html5tricks.com/demo/css3-3d-book/index.html ...

clip-path 的使用

发表于 css3 分类,标签:
ClippingShape:the clip-path propertyName:clip-pathValue:<clip-source> | [ <basic-shape> || <geometry-box> ] | noneInitial:noneAppliesto:Allelements.InSVG,itappliesto containerelements excludingthe <defs> elementandall graphicselementsInherited:noMedia:visualComputedvalue:asspecified,...

css 多行.. 技术方案

发表于 css3 分类,标签:
<class=>    <>        </></><>    .{        width: ;        height: ;        overflow: ;        bac...

关于css的比值关系

发表于 css3 分类,标签:
<class=>    <class=>            </></>.fd-contain {    margin: 0 auto;    width: 1000px;    height: 400px;    font-size: 100px;    line-heig...

获取css的方法 getComputeStyle 和 currentStyle

发表于 css3 分类,标签:
获取元素CSS值之getComputedStyle方法熟悉这篇文章发布于2012年05月8日,星期二,23:31,归类于 js实例。阅读97098次,今日92次by zhangxinxu from http://www.zhangxinxu.com本文地址:http://www.zhangxinxu.com/wordpress/?p=2378一、碎碎念~前言我们都用过jQuery的CSS()方法,其底层运作就应用了getComputedStyle以及getPropertyValue方法。对于那些只想混口饭吃的人来讲,晓得CSS()如何使用就足够了。对于希望在JS道路上越走越远的来人说,简单了解一些JS库底层实现对自己的学习很有帮助。可能谈不上信手拈来的使用,至少对创造一些创意新颖的新技术拓宽了思路。jQuery为何受欢迎,其中原因之一就...

前端规范

发表于 css3 分类,标签:
浏览器特效支持规范为了页面性能考虑,如果浏览器不支持CSS3相关属性的,则该浏览器的某些特效将不再支持,属性的支持情况如下表所示:圆角阴影动画文字阴影透明背景渐变空间变换Chrome5+YYYYYYYFirefox4+YYYYYYYSafari5+YYYYYYYOperaYYYYYNYIE9+YYNNYNYChrome5-NNYYYYYFirefox4-NNNYYNNSafari5-NYYYYNYIE8NNNNNNNIE7NNNNNNNIE6NNNNNNN[说明]Y为支持,N为不支持。 文件相关规范1、文件名必须由小写字母、数字、中划线-组成2、文件必须用utf-8编码3、文件引入可通过外联或内联方式引入:3.1外联方式:<linkrel=”stylesheet”href=”…”/>(类型声明type=”text/css”可以忽略)3.2内联方式:&...

前端组件收集

发表于 css3 分类,标签:
https://connoratherton.com/loaders   css3loading动画...