uniapper
uniapper
  • 发布:2015-07-11 23:09
  • 更新:2016-10-19 17:01
  • 阅读:7451

@Dcloud mui.css中mui-input-row 后代元素label和input/select等的顺序!

分类:MUI
mui

一、需求:
表单中的input、textarea等获得焦点(:focus)时,操作其所属的label的css。
(input:focus~label{color:red})
这样,在点击表单时label的颜色自动变为红色(也可以改变其他样式)。而当field失去焦点时自动恢复为原来的颜色。 可以不必使用js来操作dom 个人觉得这个方案既方便又能提高效率(个人感觉,js操作dom样式应该没有底层渲染css的效率高)。

二、问题
1、mui的css规定死了label要放在表单字段的前面

.mui-input-row label ~ input, .mui-input-row label ~ select, .mui-input-row label ~ textarea  
{  
    float: right;  

    width: 65%;  
    margin-bottom: 0;  
    padding-left: 0;  

    border: 0;  
}

2、没找到css中“选择父元素”或“前一个兄弟元素”的选择器。

三、我自己的解决方案
1、自定义一遍 mui.css 里面相应的规则。感觉多此一举。
2、官方统一修改mui.css中的规则。(当然,可能是我做梦)

请问,各位大侠:是我没找到更好的解决方案??
能建议官方考虑修改一下mui.css吗?

2015-07-11 23:09 负责人:无 分享
已邀请:
3***@qq.com

3***@qq.com

这个问题也不知道怎么解决,想换label和input的顺序,很麻烦

该问题目前已经被锁定, 无法添加新回复