如何修改ant design mobile或者其他UI组件的全局样式

问题描述：

有时候你可能会遇到一些前端CSS实现上的问题，因为美工的画图与你的项目使用的UI框架的样式大有出入，所以在写页面样式的时候多多少少会让你有些头疼，那么该类问题应该如何解决呢？

---

原因分析：

提示：这里填写问题的分析：
这种情况跟你的美工没太接触过前端UI框架也有一定关系，因为大部分美工他们只管好看，统一化标准即可，但是前端就难受了，在紧张的开发时间里面，如果没有现成可复用的轮子，那么你就要从头开始去画轮子，等你画完这个轮子还得测这个轮子的兼容性等等，问题多到你无法想象。所以，如果修改现有轮子的样式成了快速解决前端UI界面的一大手段。

---

解决方案：

方法非常简单，比如我使用的是蚂蚁金服的ant design mobile的样式，我现在使用一个简单Search组件，打开网页，按下F12，选中搜索框组件查看它的CSS样式，如下图

比如你要改变搜索框的高度之类的，你可以现在网页上调试样式，一层层样式往下找，看哪个样式属性是控制你想要的内容的，找到之后回到页面对应的CSS代码里，然后添加全局覆盖样式，如下：

只要把对应的属性名丢到局部CSS里面，就可以实现覆盖原有的框架样式，如果你想整个APP都覆盖这种样式，那你就应该去项目入口处的CSS文件写这些代码，否则，就在覆盖样式位于的页面模块便携这些内容。