mui.toast樣式風格及位置修改教程

使用了mui.toast來實現可自動消失的信息提示效果。
但默認的顯示效果太差了，很不顯示，而且是在底部的。
如下圖：

想改到屏幕的中間位置，再改大一點。
但官方並沒有相關的文檔教程，論壇也沒找到相關的教程。
只好自己研究，最終發現。
消息框的DIV類為

<div class="mui-toast-container">  
<div class="mui-toast-message">  

</div>  
</div>  

 

所以，就可以通過修改CSS來改變了。
我改后的最終效果如下：

CSS代碼如下：

 

/*toast信息提示*/  
.mui-toast-container {bottom: 50% !important;}  
.mui-toast-message {background: url(/app/themes/default/images/toast.png) no-repeat center 10px #000; opacity: 0.6; color: #fff; width: 180px; padding: 70px 5px 10px 5px;}