![CSS 点击按钮以后修改DIV的高度，代码怎么写？[有代码]](/aiimages/CSS+%E7%82%B9%E5%87%BB%E6%8C%89%E9%92%AE%E4%BB%A5%E5%90%8E%E4%BF%AE%E6%94%B9DIV%E7%9A%84%E9%AB%98%E5%BA%A6%EF%BC%8C%E4%BB%A3%E7%A0%81%E6%80%8E%E4%B9%88%E5%86%99%EF%BC%9F%5B%E6%9C%89%E4%BB%A3%E7%A0%81%5D.png)
和UI设计最能扯得上关系的编程，就是Web前端编程了。
在一款App产品的开发流程中，Web前端编程，就处在U设计的下游，所以UI设计师与前端工程师会有密切沟通。因为U设计师做好的视觉稿,通常是静态的.PNG图片或者动态的Demo,无法实现真正的击滑动、长按的功能交互，所以接下来就需要前端工程师来完成。
具体协作就是，UI设计师用PS、Sketch或其他设计软件， 做好视觉稿，然后切图、标注、抱好以后，移交给前端工程师。前端工程师，收到这些图片资源，以及标注规范后，就借助HTML、CSS、JS等前端编程语言,来还原UI设计师的视觉稿，这个过程就称之为[重构]。重构后的文档能够在浏览器，或者其它宿主环境中被访问，拥有完整的交互功能。
前端重构UI界面，主要目的在于对APP、网页功能的实现。同时还需要调用后端数据接口，以实现软件App界面中的图片、文本等信息，能够实时的更新，实现真正的可用。这个环节往往需要后端工程师提供支持来共通完成，这个过程就称之为[研发]。
所以，整个流程下来，和Ul扯得上关系的主要是前端编程。因此他们还会时常沟通一些设计 方案的可行性，以节约开发时间成本，更快推动项目的进程。
解决方法有很多，如果可以对html改动的话，就给你需要细化的页面元素加多一个class或者ID就行了，当然这种方法应该不是你想要的。那么接下来是不改变HTML的情况下，直接用css的方法来实现你想要的效果——方法一 细化选择符
假如全局是这样来定义一个元素的样式的：.abc {background:#000}，同时这个class为abc的元素是隶属于某个元素的，比如下面这样的html代码结构
<div class="container">
<div class="abc"></div>
</div>
那么在细化css里面，只需要在.abc前面加多一个父元素的选择符就行了：
.container .abc {background:#fff}
这样.container .abc的优先级就大于了.abc，自然细化css里面的background设置也就不会被全局CSS覆盖了~~
方法二 提升样式的优先级
这种方法个人不太推荐，相对而言会简单粗暴一些。同样是上面的例子，在细化CSS里面，只要在样式后面加一个!important，例如这样：
.abc {background:#fff !improtant}
这个样式的优先级就会默认提升到顶级，全局样式就无法影响到它了。
方法三 改变两个样式的加载顺序
这种方法比较简单，就是只要把细化css加载在全局css之后就行了，这样后面的样式就会自动覆盖前面的样式。不过如果你的html里面这两个样式表的加载顺序是先细化后全局的话，就要稍微调整一下代码才行。
其实没什么关系，css是web中的一种控制内容的表现形式，就是控制的html标签的位置，大小，颜色等，ui就是用户界面，就是画图，在web中ui的图画好后，经过切割，然后写css，就可以制作一个html的页面了，有的公司这个工作是一个人做的，叫美工，有的公司就分开，美工负责css，UI只负责画图
