HTML


Check SSL

www.sslshopper.com/ssl-checker.html#hostname=www.example.com
Lg 32lb563B

Default Select Drop-Down List with just CSS

 Html

  1. <form class="demo">
  2. <select>
  3. <option>CSS</option>
  4. <option>HTML </option>
  5. <option>HTML 5</option>
  6. </select>
  7. <select class="balck">
  8. <option>CSS</option>
  9. <option>HTML </option>
  10. <option>HTML 5</option>
  11. </select>
  12. <select class="option3">
  13. <option>CSS</option>
  14. <option>HTML </option>
  15. <option>HTML 5</option>
  16. </select>
  17. </form>

CSS

  1. <style>
  2. .demo select {
  3. border: 0 !important; /*Removes border*/
  4. -webkit-appearance: none; /*Removes default chrome and safari style*/
  5. -moz-appearance: none; /* Removes Default Firefox style*/
  6. background: #0088cc url(img/select-arrow.png) no-repeat 90% center;
  7. width: 100px; /*Width of select dropdown to give space for arrow image*/
  8. text-indent: 0.01px; /* Removes default arrow from firefox*/
  9. text-overflow: ""; /*Removes default arrow from firefox*/ /*My custom style for fonts*/
  10. color: #FFF;
  11. border-radius: 15px;
  12. padding: 5px;
  13. box-shadow: inset 0 0 5px rgba(000,000,000, 0.5);
  14. }
  15. .demo select.balck {
  16. background-color: #000;
  17. }
  18. .demo select.option3 {
  19. border-radius: 10px 0;
  20. }
  21. </style>

 

No comments:

Post a Comment