.selected-image { max-width: 100%; height: auto; } /* 主题颜色 */ :root { --primary-color: #28a745; /* 清新绿色 */ } /* 全局样式 */ body { font-family: Arial, sans-serif; background-color: #ffffff; /* 背景色 */ margin: 0; padding: 0; } .container { max-width: 800px; height: 900px; // margin: 20px auto; padding: 20px; background-color: #fbfdf8; border: 1px solid #ddd; border-radius: 5px; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); } .form-section { display: none; padding: 20px; border: 1px solid #ccc; border-radius: 5px; background-color: #f9f9f9; margin-bottom: 20px; min-height: 500px; /* 统一表单的最小高度 */ } p { color: var(--primary-color); // margin-bottom: 10px; // background-color: rgb(250, 252, 238); margin: 0; padding:0; height: 40px; padding-top: 10px; padding-left: 20px; font-size:18px; font-weight: bold; } .input-group { display: flex; align-items: center; width: 100%; } .price-label { margin-right: 5px; } .price-input { flex: 1; } .price-number { color: red; font-weight: bold; } form { display: grid; gap: 15px; } .card { // padding-top:-100px; border: 1px solid #ddd; border-radius: 5px; // padding: 15px; border-radius: 15px; background-color: #fff; height: 520px; // width: 60px; } .card { border: 1px solid #ccc; border-radius: 5px; margin: 10px; padding: 10px; } .card img { max-width: 100%; height: auto; } .price-label { color: red; } #imgcard{ width: 150px; } .custom-file-upload { display: block; margin-top: 10px; font-size: 16px; color: #333; width: 100px; /* 设置宽度为90px */ height: 100px; /* 设置高度为90px */ text-align: center; } .file-upload-wrapper { position: relative; overflow: hidden; display: inline-block; width: 100%; height: 100%; border: 2px dashed #ccc; /* 灰色边框 */ border-radius: 4px; background-color: #f2f2f2; /* 灰色背景 */ } .upload-text { display: inline-block; padding: 10px 0; width: 100%; height: 100%; box-sizing: border-box; cursor: pointer; } #publishCard{ height: 400px; } #activityCard{ height: 190px; } /* 隐藏原生的文件选择按钮 */ #file-upload { position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; } #last{ height: 100px; } #prise{ padding-top: 2px; } .card-header { background-color: var(--primary-color); color: #fff; padding: 10px 15px; border-top-left-radius: 5px; border-top-right-radius: 5px; } .card-content { padding: 15px; // height: 400px; } label { font-weight: bold; } input[type="text"], input[type="number"], select, textarea { width: 100%; padding: 8px; margin-top: 5px; margin-bottom: 15px; border: 1px solid #ddd; border-radius: 3px; box-sizing: border-box; } textarea { resize: vertical; /* 垂直方向可拉伸 */ } button[type="submit"] { background-color: var(--primary-color); color: #fff; border: none; padding: 10px 20px; border-radius: 3px; cursor: pointer; } button[type="submit"]:hover { background-color: #218838; /* 深一点的绿色 */ } .input-group { display: flex; align-items: center; } .input-group-addon { background-color: #ddd; padding: 8px 12px; border: 1px solid #ccc; border-right: none; border-top-left-radius: 3px; border-bottom-left-radius: 3px; } .input-group-addon:last-child { border-right: 1px solid #ccc; border-top-left-radius: 0; border-bottom-left-radius: 0; } .preview { margin-top: 10px; } .preview img { max-width: 100%; height: auto; border-radius: 5px; } .tags { margin-top: 10px; } .tag { display: inline-block; background-color: #17a2b8; /* 蓝色 */ color: #fff; padding: 5px 10px; border-radius: 3px; margin-right: 5px; } .tag.secondary { background-color: #ffc107; /* 橙色 */ }