您的位置:首页 > 文旅 > 旅游 > 设计图片用什么软件好_十大开源软件_推销产品怎么推广_今日头条网页版

设计图片用什么软件好_十大开源软件_推销产品怎么推广_今日头条网页版

2025/5/3 17:07:13 来源:https://blog.csdn.net/weixin_45849417/article/details/147578750  浏览:    关键词:设计图片用什么软件好_十大开源软件_推销产品怎么推广_今日头条网页版
设计图片用什么软件好_十大开源软件_推销产品怎么推广_今日头条网页版

一、需求:

目前来说,有些用户的浏览器可能是100%,有些用户的在系统设置了**125%**的官方推荐,所以导致有些样式不一样
在这里插入图片描述
我这里就是想要的效果是:
当我浏览器100%或者125% 的时候,label的内容不会被输入框覆盖,自适应是最好的。

<div class="table-page-search-wrapper" style="margin-top: 10px"><a-form layout="inline" @keyup.enter.native="searchQuery"><a-row :gutter="24"><a-col :span="4"><a-form-item label="省份"><a-select v-model="queryParam.provinceCode" @change="handleProvinceChange" placeholder="请选择省份"><a-select-option v-for="province in provinces" :key="province.value" :value="province.value">{{ province.label }}</a-select-option></a-select></a-form-item></a-col><a-col :span="7"><a-form-item label="项目名称"><a-input placeholder="请输入项目名称" v-model="queryParam.pojeName" :allowClear="true"></a-input></a-form-item></a-col><a-col :span="7"><a-form-item label="计划时间"><a-range-picker v-model="plan_date" format="YYYY-MM-DD" value-format="YYYY-MM-DD" @change="onchangeDateOfPlan" /></a-form-item></a-col><a-col :span="6"><a-form-item label="项目阶段"><a-select v-model="queryParam.tableType"><a-select-option v-for="item in tableTypeOptions" :key="item.value" :value="item.value">{{ item.label }}</a-select-option></a-select></a-form-item></a-col></a-row><a-row :gutter="24"><a-col :span="4"><a-form-item label="城市"><a-select v-model="queryParam.cityCode"  @focus="onFocusCitySelect" placeholder="请选择城市"><a-select-option v-for="(item,index) in cities" :key="index" :value="item.value">{{ item.label }}</a-select-option></a-select></a-form-item></a-col><a-col :span="7"><a-form-item label="风险等级"><a-select v-model="queryParam.riskLevel"><a-select-option v-for="item in riskLevelOptions" :key="item.value" :value="item.value">{{ item.text }}</a-select-option></a-select></a-form-item></a-col><a-col :span="7"><a-form-item label="经营单位"><a-input placeholder="请输入经营单位" v-model="queryParam.chargeBusinessUnit" :allowClear="true"></a-input></a-form-item></a-col><a-col :span="6"><a-form-item label="项目类型"><a-select v-model="queryParam.projectKind"><a-select-option v-for="item in projectAccurateTypeDict" :key="item.id" :value="item.id">{{ item.title }}</a-select-option></a-select></a-form-item></a-col></a-row><a-row :gutter="24"><a-col :span="24" style="text-align: center;margin-top: 10px;"><div class="table-page-search-submitButtons"><a-button type="primary" @click="searchQuery" icon="search">查询</a-button><a-button @click="searchReset" icon="reload" style="margin-left: 8px;background-color: #DFDFDF;">重置</a-button></div></a-col></a-row></a-form></div>

CSS样式代码:

.table-page-search-wrapper {.ant-form-inline {.ant-form-item {display: flex;margin-bottom: 24px;margin-right: 0;.ant-form-item-control-wrapper {flex: 1 1;display: inline-block;vertical-align: middle;}> .ant-form-item-label {line-height: 32px;padding-right: 8px;width: auto;}.ant-form-item-control {height: 32px;line-height: 32px;}}}.table-page-search-submitButtons {display: block;margin-bottom: 24px;white-space: nowrap;}}

版权声明:

本网仅为发布的内容提供存储空间,不对发表、转载的内容提供任何形式的保证。凡本网注明“来源:XXX网络”的作品,均转载自其它媒体,著作权归作者所有,商业转载请联系作者获得授权,非商业转载请注明出处。

我们尊重并感谢每一位作者,均已注明文章来源和作者。如因作品内容、版权或其它问题,请及时与我们联系,联系邮箱:809451989@qq.com,投稿邮箱:809451989@qq.com