美文网首页红红火火恍恍惚惚
修改vux组件的css样式

修改vux组件的css样式

作者: 小小的开发人员 | 来源:发表于2019-03-20 20:14 被阅读801次

我们经常用vux的组件快速开发移动端的项目,比如常用的datetime组件,会遇到这样的问题。



而我们的需求要求value值靠左而非靠右,但datetime没有提供移动value值位置的属性,那怎么办呢?

首先需要找到经过vue处理后的值,


一种方法我们可以在全局上修改,简单粗暴。

vue也给我们提供了局部修改的方法:

.dateTime /deep/ .weui-cell__ft {
    text-align: left;
  }

这最终会被vue编译成:

.dateTime[data-v-f4349ff6] .weui-cell__ft {
    text-align: left;
}

可以看到字体变成向左靠齐,当然,可以用这种方法,修改任一内置组件,其他ui框架的修改方法也类似。

相关文章

  • 修改vux组件的css样式

    我们经常用vux的组件快速开发移动端的项目,比如常用的datetime组件,会遇到这样的问题。 而我们的需求要求v...

  • 自定义vux组件样式

    给组件外层加个父 vux组件 然后写样式时 在vux组件的样式前加.tabZDY /deep/ .tabZD...

  • vux局部样式修改

    在使用vux组件的时候,我们经常需要修改其样式,但是又不想通过重写主题改变所有的组件样式,这个时候就需要局部修改了...

  • vue 修改ui框架样式 汇总 样式穿透

    说明 1、方法一:配置全局的样式,请查看 vux 怎么用 样式变量 修改主题配色(vux只是举个例子,其他的ui框...

  • jQuery学习:css操作/属性操作

    css操作 修改单个样式.css(name,value) 修改多个样式.css(obj) 获取样式.css(nam...

  • CSS优先级计算及应用

    梳理这部分是因为在使用组件模式开发h5应用会出现组件样式修改未生效的问题,在解决样式修改的问题前,需要理清楚CSS...

  • vue 注意事项

    1.修改webpack配置项以后,一定要重启服务器2.css样式想在 scroped模式下修改本组件外面的样式,需...

  • 使用 React 的 CSS 模块指南

    有许多不同的方法可以为 React 组件提供样式,例如导入纯 CSS、使用样式组件、JS-in-CSS 或 CSS...

  • AngularJS checkbox的总结

    checkbox组件的封装 组件的css样式的实现这种采用纯css伪类的方式实现,为input组件重写样式。这种方...

  • react+antd 怎么修改antd默认样式

    使用andt中的组件时,一般会是默认样式。假如不想默认样式,在相应页面的css中修改又是无效的。今天来修改一下an...

网友评论

    本文标题:修改vux组件的css样式

    本文链接:https://www.haomeiwen.com/subject/ajtxvqtx.html