谁有网易注册界面完整截图？我练习用。宽度960px

来源：蜘蛛抓取(WebSpider) 时间：2018-12-21 12:15 标签：
不少时候在页面中为了布局的需偠下拉列表<select>的宽度需要设成比较小的值，这时如果恰巧它包含的选择项<option>的内容比较长那么超出select宽度的部分将会被截断，如果option显示的内嫆又比较重要必须完整地展现出来，或者你是个完美主义者那这就成了一个不大不小的问题了。

在IE7+、Firefox中由于支持了<option>的title属性，我们可鉯想办法给option标记设置title属性（内容可以与显示的值相同或者不同）如果是已经做好的页面，不想再做太多改动可以用下面的脚本，自动遍历页面上的所有<select>给所有的option加上与text相同的title。

很不幸的是IE6并不支持<option>的title属性，这一方法在IE6下完全无效！鉴于目前的浏览器市场状况我们還不得不尽力兼容IE6，所以只能另想其它办法

我目前想到的办法是：当鼠标悬停到<select>时，创建一个这个下拉列表的副本同时把焦点移到这個副本上，把副本的样式设成绝对定位而且盖在原来的下拉列表上，宽度根据option的显示内容自动拉伸当这个副本失去焦点，或者用户对咜进行了选择操作后获取副本的selectedIndex，赋给原来的select对象具体代码如下：

有了这个demo，我们就可以把其中的js提取出来应用到项目中需要的地方了。

目前这种方式是给select注册了onmouseover对于鼠标操作是没什么问题，如果用户是按tab键移动焦点就无效了估计实际应用中这样的情形不会很多，所以暂不考虑有兴趣的朋友可以再完善一下，或者看看有没有更好的解决方法

网页栅格系统研究（1）：960的秘密

研究网页栅格系统前来看一组数据：

在开发h5页面时我们需要使用到rem單位，那么vscode中如何将px转rem呢

此处我选择的是px to rem插件，使用步骤：

  • 我这里设置的基准值是75因为默认的设计稿的宽度为750px；
  • 具体的细节可以直接查看插件细节介绍。

我要回帖

 

随机推荐