How to wrap the form item label and form item content in el-form-item

The form item label and form item content of elemnet ui's el-form-item are originally displayed on the same line by default. How to wrap the form item label and form item content in el-form-item?
The effect is as follows:
insert image description here
Method 1:
elemnetUI official method label-position="top"
insert image description here

Method 2:
Idea: Remove or set the label-width attribute in el-form or el-form-item to 0. If the label length exceeds one line, you need to set the following style attributes: add the following style code
:

<style scoped>
/deep/ .el-form-item__label{
    
    
  text-align:left;
  float: none;
  word-break: break-word;
}
</style>

Guess you like

Origin blog.csdn.net/Hyanl/article/details/128343983
Recommended