在查询一些关于CSS的属性问题时,见到了下面这篇关于CSS的译文。
CSS的未来:一些试验性CSS属性
(http://www.qianduan.net/the-future-of-css-experimental-css-properties.html)
下面的内容摘自此文开头部分。
尽管现代浏览器已经支持了众多的CSS3属性,但是大部分设计师和开发人员貌似依然在关注于一些很“主流”的属性,如border-radius、
box-shadow或者transform等。它们有良好的文档、很好的测试并且最常用到,所以如果你最近在设计网站,你很难能脱离它们。
但是,隐藏在浏览器的大宝库中是一些高级的、被严重低估的属性,但是它们并没有得到太多的关注。或许它们中的一些应该这样(被无视),但是其它的属
性应该得到更多的认可。最伟大的财富隐藏在Webkit的下面,而且在iPhone、iPad和Android
apps的时代,开始了解它们会灰常有用。就连Firefox等使用的Gecko引擎,也提供了一些独特的属性。在本文中,我们将看一下鲜为人知的CSS
2.1和CSS3属性以及它们在现代浏览器中的支持情况。
分享到:
相关推荐
PostCSS自定义属性 使您可以按照规范在CSS中使用自。 :root { --color : red; } h1 { color : var ( --color ); } /* becomes */ :root { --color : red; } h1 { color : red; color : var ( --color ); } ...
安装: 使用npm: $ npm install --save-dev optimize-css-assets-webpack-plugin :warning: 对于webpack v3或更低版本,请使用optimize-css-assets-webpack-plugin@3.2.0 。 optimize-css-assets-webpack-plugin@...
}安装npm install postcss-custom-css-units用法将postcss-custom-css-units插件添加到postcss.config.js module . exports = { plugins : [ require ( 'postcss-custom-css-units' ) ( { baseUnit
美工之路系列视频是为那些想从事网页前台设计的设计师们和网页设计爱好者量身定制的,本教程包含4个部分:HTML篇,CSS篇,Javascript篇和XML篇.不仅适用于网页设计的初学者,对中级以上水平的人员也有一定参考价值,使...
美工之路系列视频是为那些想从事网页前台设计的设计师们和网页设计爱好者量身定制的,本教程包含4个部分:HTML篇,CSS篇,Javascript篇和XML篇.不仅适用于网页设计的初学者,对中级以上水平的人员也有一定参考价值,使...
PostCSS间隙属性 使您可以按照规范在CSS中使用gap , column-gap和row-gap速记属性。 .standard-grid { gap : 20 px ; } .spaced-grid { ...npm install postcss-gap-properties --save-dev 使用来处理CSS:
一个支持属性的PostCSS插件。 安装 npm i -D postcss-aspect-ratio-polyfill 用法 const postcss = require ( 'postcss' ) const output = postcss ( ) . use ( require ( 'postcss-aspect-ratio-polyfill' ) ) ....
-互操作性-与postcss-custom-properties差异 注意事项 选项 快速参考/注释 测验 变更日志 代码游乐场 在操场上尝试一下,看看您的想法! 只需添加一些CSS,然后查看最终的转换/编译CSS。 您也可以在操场上尝试任何...
postcss-选择器命名空间 安装 $ npm install postcss-selector-namespace 用法 var postcss = require ( 'postcss' ) var selectorNamespace = require ( 'postcss-selector-namespace' ) var output = postcss ( ) ...
npm i -D postcss-load-config 用法 npm i -S | -D postcss-plugin 安装所有必需的postcss插件并将其保存到package.json dependencies / devDependencies 然后通过选择以下格式之一创建一个postcss配置文件 ...
postcss-变量-前缀 PostCSS 插件为所有 css 自定义属性添加前缀。 用法 使用 : 在您的项目目录中安装postcss 、 postcss-cli和postcss-variables-prefixer : npm install postcss postcss-cli postcss-...
瑞典CSS属性整体CSS属性翻译成瑞典语如果任何字眼看起来很怪异,请随时提交拉取请求用法$ npm install --save swedish-css-properties /** * Getting Swedish CSS Properties * * @return { object } */var SECSS = ...
css-flat-loader CSS Flat CSS Flat(CSS 扁平化)是一种模块化解决方案,基于Post CSS生态开发。 主要解决问题: 达到模块化CSS的能力 解决由于业务的持续迭代,导致CSS样式文件的线性增长问题(CSS Modules尤其...
npm install postcss-color-scale 用 在命令行中: post-css --use postcss-color-scale styles.css -o styles.out.css 可以在它与一起使用。 标准用例 输入 : root { --cs-color : blue; --cs-variance : 20 ; ...
PostCSS Flexbugs修复 插件该项目试图解决所有问题。... } 这仅修复设置了flex属性的css类。 要修复flexbox容器中包含的元素,请使用以下全局规则: * { flex-shrink : 1 ;}错误输入. foo { flex : 1 0 calc
混淆Mangle自定义属性名称以阻止逆向工程 :rocket: 安装npm i -D postcss postcss-custom-properties-transformer :vertical_traffic_light: 快速设置将postcss-custom-properties-transformer添加到您的PostCSS...
我已经开始使用诸如样式组件和情感之类的css-in-js库。 因此,不从事该项目。 eslint-plugin-css-modules 该插件旨在帮助您使用css-modules时追查问题。 它告诉您是在js中使用不存在的css / scss / less类,还是...
CSS Pro布局 CSS库,用于构建响应式和可自定义的...import 'css-pro-layout/dist/css/css-pro-layout.css' ; CDN 您也可以使用的CDN链接 < link href =" https://unpkg.com/css-pro-layout/dist/css/css-pro-layout
rollup-plugin-postcss-inject-to-css rollup-plugin-postcss的 inject 模式下,把导出后组件引用的xxx.scss.js转换为xxx.css进行引入 本插件依赖 ,主要是针对组件按需加载的场景下进行的优化适配 Install npm: npm...