ikon butang mudah alih jQuery

jQuery Mobile menyediakan satu set ikon yang menjadikan butang kelihatan lebih diingini.

Tambah ikon pada butang Mudah Alih jQuery

Kita boleh menggunakan kelas ui-icon untuk menambah ikon pada butang, dan boleh menggunakan kelas yang ditentukan untuk menetapkan kedudukan butang.

<a href="#anylink" class="ui-btn ui-icon-search ui-btn-icon-left">Search</a>

Nota: Pada butang dengan cara lain, seperti butang dalam senarai atau borang, anda perlu menggunakan atribut ikon data. Kami akan memperkenalkannya secara terperinci dalam bab-bab berikut.

Di bawah ini kami menyenaraikan beberapa ikon tersedia yang disediakan oleh jQuery Mobile:

Cubalahui-icon-deletePadam Cubalah ui-ikon-kembaliKembali >Penceramah ~~ui-icon-lock~~ ~~padlock~~ ~~-search~~ ~~Cubalah~~

~~Untuk manual rujukan lengkap semua ikon butang jQuery Mudah Alih, lawati Manual Rujukan Ikon Mudah Alih jQuery kami.~~

Ikon Kedudukan

~~Anda juga boleh menentukan di mana ikon diletakkan pada butang: atas, kanan, bawah, kiri .~~

~~Sila gunakan atribut ui-btn-icon untuk menentukan kedudukan:~~

Kedudukan ikon:

Instance

Jalankan Instance»
Klik butang "Run Instance" untuk melihat contoh dalam talian

Kelas Butang	Penerangan	Butang	Instance
ui-ikon-anak panah-l	Anak Panah Kiri		Cubalah
ui-icon-arrow-r	Anak panah ke kanan	🎜>

		ui-icon-audio
		carian
	ui-icon-alert	amaran
	ui-icon-home	homepage

	如果你未指定按钮图片的位置，图标将不显示。

Tunjukkan ikon sahaja
Jika anda hanya mahu menunjukkan ikon, anda boleh menggunakan "notext":
Instance
rreee

Jalankan Instance»
Klik butang "Run Instance" untuk melihat contoh dalam talian
Alih keluar bulatan

Secara lalai, semua ikon mempunyai bulatan kelabu. Jika anda tidak memerlukannya, anda boleh menggunakan kelas "ui-nodisc-icon" dalam elemen anda:
Instance
<a href="#anylink" class="ui-btn ui-icon-search ui-btn-icon-notext">搜索</a>

Jalankan Instance»
Klik butang "Run Instance" untuk melihat contoh dalam talian
Butang hitam dan putih
Secara lalai, semua ikon berwarna putih . Jika anda perlu menukar warna ikon kepada hitam, anda boleh menambah "ui-alt-icon" pada elemen:
Instance
<a href="#anylink" class="ui-btn ui-icon-search ui-btn-icon-left">使用圆圈 (默认)</a> <a href="#anylink" class="ui-btn ui-icon-search ui-btn-icon-left ui-nodisc-icon">去掉圆圈</a>

Jalankan Instance»
Klik butang "Run Instance" untuk melihat contoh dalam talian
Lagi kejadian
Tambahkan pada bekas Kelas "ui-nodisc-icon"
menggunakan contoh kelas "ui-nodisc-icon".
Tambahkan pada bekas Kelas "ui-alt-icon"
menggunakan contoh kelas "ui-alt-icon".

ikon butang mudah alih jQuery

Tambah ikon pada butang Mudah Alih jQuery

Ikon Kedudukan

Kedudukan ikon:

Instance

Tunjukkan ikon sahaja

Instance

Alih keluar bulatan

Instance

Butang hitam dan putih

Instance

Lagi kejadian

Laman web PHP Cina