Maison > interface Web > tutoriel HTML > Input File 表单上传按钮美化_html/css_WEB-ITnose

Input File 表单上传按钮美化_html/css_WEB-ITnose

WBOY
Libérer: 2016-06-24 12:33:50
original
1433 Les gens l'ont consulté

HTML

<div class="input-file-button">上传图片<input type="file" class="input-file" hidefocus /></div>
Copier après la connexion

CSS

.input-file-button {  display:block;  width: 200px;  height: 80px;  text-align: center;  line-height: 80px;  color: #fff;  font-size: 30px;  font-family: "MicroSoft YaHei";  text-shadow: 0px 0 5px #A74900;  border-radius: 5px;  overflow: hidden;  position: relative;  background: #EC6D0B;}.input-file {  height: 80px;  font-size: 200px;  overflow: hidden;  position: absolute;  top: 0;  right: 0;  opacity: 0;  filter: alpha(opacity=0);  cursor: pointer;}
Copier après la connexion

 
Copier après la connexion

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal