本文主要是介绍antDesign 文本域弹窗样式,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
antDesign 文本域弹窗样式
<a-modalv-model:visible="reportVisible"title="操作确认":footer="null":destroyOnClose="true":maskClosable="false"width="40%":afterClose="afterClose"class="rejectModal"><a-formref="ruleForms":model="submitForm":rules="rules":label="{ span: 24, offset: 24 }"layout="horizontal"class="textareaDialog"><a-row :gutter="24"><a-col :span="24"><a-form-item ref="content" label="意见:" name="content"><a-textareav-model:value="submitForm.content"placeholder="请输入意见"allowClear:maxlength="255":rows="4"showCount:autosize="{ minRows: 4, maxRows: 6 }"/></a-form-item></a-col></a-row><div class="footButton"><a-button type="primary" @click="onSubmit">确定</a-button><a-buttontype="primary"@click="afterClose"style="margin-left: 20px">取消</a-button></div></a-form></a-modal>
CSS:
<style>
/* 文本域的样式 */
.textareaDialog .ant-form-item-label {width: 20%!important;
}
.textareaDialog .ant-form-item-control-wrapper {width: 60%!important;
}
/* 右下角的字调整位置 */
.textareaDialog .ant-input-textarea-show-count {position: relative;
}
.textareaDialog .ant-input-textarea-show-count::after {position: absolute;right: 30px;bottom: -10px;
}
.textareaDialog .ant-input-affix-wrapper{padding:16px
}
</style>
这篇关于antDesign 文本域弹窗样式的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!