“Tambahkan Panah di CSS Pilih” Kode Jawaban

Tambahkan Panah di CSS Pilih

.select_box{
  width: 200px;
  overflow: hidden;
  border: 1px solid #000;
  position: relative;
  padding: 10px 0;
}
.select_box:after{
  width: 0; 
  height: 0; 
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 6px solid #f00;
  position: absolute;
  top: 40%;
  right: 5px;
  content: "";
  z-index: 98;
 }
.select_box select{
  width: 220px;
  border: 0;
  position: relative;
  z-index: 99;
  background: none;
}
Fierce Flamingo

cara mengubah panah pilih di CSS

.styled-select {
  width: 100px;
  height: 17px;
  overflow: hidden;
  overflow: -moz-hidden-unscrollable;
  background: url(images/downarrow_blue.png) no-repeat right white;
  border: 2px double red;
  display: inline-block;
  position: relative;
}

.styled-select select {
  background: transparent;
  -webkit-appearance: none;
  width: 100px;
  font-size: 11px;
  border: 0;
  height: 17px;
  position: absolute;
  left: 0;
  top: 0;
}

body {
  background-color: #333333;
  color: #FFFFFF;
}

.block label {
  color: white;
}
Black Bat

Gaya CSS Pilih Warna Panah

body {
  background: #f2f2f2;
}

.selectdiv {
  position: relative;
  /*Don't really need this just for demo styling*/
  
  float: left;
  min-width: 200px;
  margin: 50px 33%;
}

/*To remove button from IE11, thank you Matt */
select::-ms-expand {
     display: none;
}

.selectdiv:after {
  content: '<>';
  font: 17px "Consolas", monospace;
  color: #333;
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  transform: rotate(90deg);
  right: 11px;
  /*Adjust for position however you want*/
  
  top: 18px;
  padding: 0 0 2px;
  border-bottom: 1px solid #999;
  /*left line */
  
  position: absolute;
  pointer-events: none;
}

.selectdiv select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  /* Add some styling */
  
  display: block;
  width: 100%;
  max-width: 320px;
  height: 50px;
  float: right;
  margin: 5px 0px;
  padding: 0px 24px;
  font-size: 16px;
  line-height: 1.75;
  color: #333;
  background-color: #ffffff;
  background-image: none;
  border: 1px solid #cccccc;
  -ms-word-break: normal;
  word-break: normal;
}
Rich Raccoon

Jawaban yang mirip dengan “Tambahkan Panah di CSS Pilih”

Pertanyaan yang mirip dengan “Tambahkan Panah di CSS Pilih”

Lebih banyak jawaban terkait untuk “Tambahkan Panah di CSS Pilih” di CSS

Jelajahi jawaban kode populer menurut bahasa

Jelajahi bahasa kode lainnya

Shell/Bash
C#
C++
C
CSS
HTML
Java
JavaScript
Objective-C
PHP
Python
Sql
Swift
Ruby
TypeScript
Go
Kotlin
Assembly
R
VBA
Scala
Rust
Dart
Elixir
Clojure
Haskell
Matlab
Erlang
Cobol
Fortran
Scheme
Perl
Groovy
Lua
Julia
Delphi
Abap
Lisp
Prolog
Pascal
ActionScript
Basic
Solidity
PowerShell
GDScript
Excel