微信小程序：如何讓button中的文字居中

一、修改前
二、修改后

一、修改前

效果

<button bindtap="saveInfo">保存</button>

button {
    text-align: center;
    margin-top: 30px;
    color: #FFF;
    background-color: #2e79fc !important;
    border-radius: 10px;
    height: 60px;
    line-height: 40px;
    width: 70%;
}

二、修改后

效果

button {
    display:flex;
    align-items: center;
    justify-content: center;
    
    text-align: center;
    margin-top: 30px;
    color: #FFF;
    background-color: #2e79fc !important;
    border-radius: 10px;
    height: 60px;
    line-height: 40px;
    width: 70%;
}

本文鏈接：https://blog.csdn.net/qq_36025814/article/details/126121584

智能推薦

微信小程序開發——button組件

WeChat小程序交流（QQ群：769977169）效果圖 xxx.wxml結構代碼示例 xxx.wxss樣式代碼示例 xxx.js業務邏輯代碼示例...

微信小程序——分享組件——button

微信小程序——分享組件——button 目的：利用button的分享屬性來實現點擊圖片分享效果圖：點擊圖片和按鈕都能拉起分享實現原理：就是簡單的利用來擴大button的范圍 open-type 的合法值值說明最低版本 contact 打開客服會話，如果用戶在會話中點擊消息卡片后返回小程序，可以從 bindcontact 回調中獲得具體信息...

微信小程序----組件之button

效果圖項目結構： index.wxml index.wxss index.js 源碼下載：http://download.csdn.net/download/zhaihaohao1/9968483...

微信小程序：button按鈕實現、bindtap綁定觸發事件、button中放入圖片和文字

以下是關于在微信小程序中button按鈕實現的相關代碼。（1）wxml文件： class是用于wxss文件中的樣式名稱，bindtap是用于js文件中的點擊該按鈕跳轉的實現函數。（2）wxss文件：函數名來源于wxml文件中class等號后的名稱，width是按鈕寬度，margin-top是距離上面的長度，background-color是按鈕背景色，color是按鈕的文字顏色，border...