customize <input type="file"> - HTML CSS CSS Form

HTML CSS examples for CSS Form:input

Description

customize <input type="file">

Demo Code

ResultView the demo in separate window

<html>
 <head> 
  <meta name="viewport" content="width=device-width, initial-scale=1"> 
  <style id="compiled-css" type="text/css">
input[type=file] {
   -webkit-appearance:none;<!--from w w  w. java2s.  co  m-->
   -moz-appearance:none;
   appearance:none;
   background:Chartreuse;
   background:linear-gradient(to top, yellow, blue);
   border:thin solid pink;
   border-radius:.26em;
   box-shadow:inset .26em .26em .26em OrangeRed, inset -.2em -.2em .2em rgba(0,0,0, 0.2);
   cursor:text;
   padding:.26em;
}
</style> 
 </head> 
 <body> 
  <input type="file" accept="application/pdf">  
 </body>
</html>

Related Tutorials