1. 程式人生 > >網頁端&小程式的前端note:form的button去掉圓角

網頁端&小程式的前端note:form的button去掉圓角

form裡面的button按鈕是預設帶圓角,相信很多人都會在釋出版本後被上級或測試要求去掉圓角,出於form自帶的提交按鈕使用效果非常滿意,很多人仍會保留該提交button,樣式的修改下圖有
至於form的提交事件,官網非常詳細
注意:form是不會攜帶view控制元件的值,而且 value和name缺一不可。

<form bindsubmit="formSubmit">
    <view class="l-ct">
        <view class="edit-field">
        <text>聯絡人:</text>
<input type="text" name="addressName" id="addressName" maxlength="25" value="
{{addressName}}" bindinput="bindNameInput" placeholder="請填寫收貨人姓名"/> </view> <view class="addr-v"> <button formType="submit" class="addr-button">儲存地址</button> </view
>
<view wx:if="
{{addressId}}" class="addr-v"> <view class="addr-button-del" bindtap="deleteAddress" id="{{addressId}}">刪除地址</view> </view> </view> </form>
wxss檔案中新增即可,我是直接加在app.wxss,避免後人被坑
/*button按鈕沒有圓角  */
button::after {
    border-radius
: 0
; }
button{ border-radius: 0; }

網頁端,待補充