场景描述：首先我们默认插入一个无图片按钮。
插入代码如下：
<div class="btn ub ub-ac bc-text-head ub-pc bc-btn umar-t" id="btn">无图片按钮</div>
预览效果如下：
我们发现按钮文字默认是居中显示的。然后在按钮上将文字定义为居左显示时却发现文字仍然按照默认的居中显示。更改代码如下：
<div class="btn ub ub-ac bc-text-head ub-pc bc-btn umar-t tx-l" id="btn">无图片按钮</div>
原因何在？下面我们对这种莫名其妙的情况进行分析。
二、问题分析与解决方案：
1、问题分析：通过上述代码我们可以看到：tx-l文字居左的定义符合上述文字对齐方向的定义规则。效果没出来的关键原因在于ub-pc这个参数在作怪。这个参数属于Box架构元素水平方向的位置排列的定义，ub-pc定义为“水平居中”，而tx-l则又定义为文字居左，这样tx-l和ub-pc就发生了参数定义的冲突。
2、解决方案：这时只需要将默认的ub-pc参数删除即可解决上述问题。
3、问题解决后的代码及效果如下：
<div class="btn ub ub-ac bc-text-head bc-btn umar-t tx-l" id="btn">无图片按钮</div>
三、涉及知识点：
1、Box架构元素水平方向的位置排列
定义：ub-pc
说明：ub-pc：水平居中，只有跟ub搭配着使用ub-pc的作用才生效。
2、文字对齐方向
定义：tx-[类型]......
说明：前缀为tx- 类型为l代表LETT。用于定义文字的对齐方向，tx-l代表左对齐
最佳答案
