更新5：CSS（属性）修复插件等的fancybox使用
.css('margin-right')抓取元件的右边距与.css('margin-right','12px')设置元素的右边缘。这被破坏了，因为没有检查是否props是字符串以及是否提供了多个参数。通过检查是否
props为字符串来修复它。如果是这样并且有多个参数，则将参数重写为对象，否则
parseProps($.extend( {}, props ) )不使用。更新4：
用于响应式布局的插（在工作中）
我尝试了一下。首先，这里是CSS示例：（调整输出面板的大小）。请注意，
font-size至少在最新版本的Chrome上，不适用于视口单元。
这是我使用jQuery进行的尝试。也可以使用该字体的jQuery演示位于。尚未对其进行广泛的测试，但它似乎可用于大多数属性，因为它只是将值转换为像素，然后通过调用其插件
window.resize来保持更新。
更新：
更新了代码以与许多浏览器一起使用。如果您使用的不是Chrome，请在本地进行测试，因为jsBin的行为有点怪异
window.resize。
更新2： 扩展本机
css方法。
更新3： 处理插件内部的window.resize事件，以便现在无缝集成。
;(function( $, window ){ var $win = $(window) , _css = $.fn.css; function viewportToPixel( val ) { var percent = val.match(/[d.]+/)[0] / 100 , unit = val.match(/[vwh]+/)[0]; return (unit == 'vh' ? $win.height() : $win.width()) * percent +'px'; } function parseProps( props ) { var p, prop; for ( p in props ) { prop = props[ p ]; if ( /[vwh]$/.test( prop ) ) { props[ p ] = viewportToPixel( prop ); } } return props; } $.fn.css = function( props ) { var self = this , originalArguments = arguments , update = function() { if ( typeof props === 'string' || props instanceof String ) { if (originalArguments.length > 1) { var argumentsObject = {}; argumentsObject[originalArguments[0]] = originalArguments[1]; return _css.call(self, parseProps($.extend({}, argumentsObject))); } else { return _css.call( self, props ); } } else { return _css.call( self, parseProps( $.extend( {}, props ) ) ); } }; $win.resize( update ).resize(); return update(); };}( jQuery, window ));// Usage:$('div').css({ height: '50vh', width: '50vw', marginTop: '25vh', marginLeft: '25vw', fontSize: '10vw'});
