使p：fileUpload高级模式显示为简单模式

Question

我正在尝试使用高级模式和ajax功能显示FileUpload，但我希望它看起来像简单模式，它只显示带有标签名称的按钮， 这是我的小脸

  <p:fileUpload fileUploadListener="#{scriptManagerForm.uploadSourceFile}" auto="true"
                                  skinSimple="true">
                        <f:attribute name="name" value="#{sourcefile.name}" />
     </p:fileUpload>

用这个css

.fileupload-content{
                display: none;
            }
            .ui-fileupload .fileinput-button {
                background-color: rgba(142, 103, 64, 0.98);
            }

谢谢，

Answer 1

不确定为什么要这样做，但从CSS的角度来看代码如下：

/*Hide the advanced buttons and progress*/
.ui-fileupload-upload, .ui-fileupload-cancel, .ui-fileupload-progress{
    display: none;
}

/*Move the file name and size of file onto same line*/
.ui-fileupload-buttonbar, .ui-fileupload-content{
    float: left;
}

/*Remove some of the margin from the file name to align correctly*/
.ui-fileupload-files{
    margin: 0;
}

原创

CSS之后