Teman-teman yang sering berselancar di Internet pernah memperhatikan bahwa mouse di beberapa website tidak berbentuk panah diagonal ke atas biasa, melainkan berbentuk salib, atau panah kiri, atau tanda tanya, dan sebagainya. Bila Anda ingin mouse menampilkan bentuk yang berbeda di lokasi berbeda pada halaman web untuk mencerminkan area fungsional yang berbeda; bila Anda ingin situs web Anda mencerminkan gaya yang unik, pertimbangkan untuk menggunakan gaya mouse. Faktanya, gaya mouse memiliki kegunaan yang luas, jadi bagaimana Anda dapat menerapkan gaya mouse yang berbeda? Mulai Dreamweaver, buka halaman web tempat Anda ingin menerapkan gaya mouse, pilih menu drop-down Teks di jendela utama, dan lalu pilih New di submenu CSS Style. Perintah Style membuat style sheet baru. (Catatan: Jika style sheet sudah ada di halaman web Anda, Anda dapat memilih CSS Styles Edit Style Sheet untuk mengedit style sheet.) Kotak dialog New Style akan muncul. Item Tipe memiliki tiga tombol radio: Buat Gaya Kustom, Definisikan Ulang Tag HTML, dan Gunakan Pemilih CSS. Diantaranya, Make Custom Style adalah gaya khusus, dan nama gaya dimulai dengan titik; Gunakan Pemilih CSS adalah dengan menggunakan pemilih CSS, yang berisi empat gaya hyperlink
a:active/a:hover/a:link/a:visited ; Definisikan Ulang Tag HTML adalah gaya yang mendefinisikan tag sistem HTML, seperti abodybr dan seterusnya. Asumsikan kita hanya mengatur gaya mouse untuk hyperlink di halaman ini. Di sini, pilih tag a di opsi Definisikan Ulang Tag HTML. Pilih Hanya Dokumen Ini untuk item Tentukan di bawah. Klik tombol OK. Kotak dialog Definisi gaya untuk muncul dan memasukkan pengaturan gaya hyperlink. Kategori di sebelah kiri adalah kategori gaya. Tidak ada penjelasan untuk item lainnya di sini. Anda dapat melihat item Kursor di Efek Visual di sebelah kanan, yang merupakan item kunci untuk mengatur gaya mouse. Klik menu drop-down di sebelah kanan, pilih gaya mouse yang Anda perlukan, dan klik tombol OK. Mari kita bicara tentang arti umum dari masing-masing gaya.
tangan: adalah bentuk tangan yang familiar.
crosshair: Ini adalah gaya berbentuk salib yang digunakan di beranda Little Turtle.
teks: Ini adalah gaya ketika mouse digerakkan ke teks.
tunggu: adalah efek menunggu.
default: Ini adalah efek default.
bantuan: adalah gaya mouse dengan tanda tanya.
e-resize: adalah panah kanan.
ne-resize: adalah tanda panah mengarah ke atas ke kanan.
n-resize: adalah panah ke atas.
nw-resize: adalah panah yang mengarah ke atas ke kiri.
w-resize: Ini adalah panah yang diteruskan ke kiri.
sw-resize: adalah panah yang mengarah ke bawah ke kiri.
s-resize: adalah panah ke bawah.
se-resize: adalah tanda panah mengarah ke bawah ke kanan.
otomatis: Ini adalah efek otomatis dari sistem.
Tentu saja, Anda juga dapat menerapkan gaya tersebut ke tag lain sesuai kebutuhan, atau cukup menerapkannya pada paragraf teks tertentu. Jika pembaca sudah familiar dengan kode CSS, mungkin akan lebih mudah untuk menulis kode secara langsung dengan tangan. Khususnya, jika Anda ingin menggunakan gaya mouse berbeda untuk lokasi berbeda, atau menggunakan gaya mouse berbeda untuk tab berbeda. Tulis saja gayanya langsung di tag tertentu.
Caranya adalah: <tag style=cursor:mouse_style>. Dimana tag adalah nama tag, mouse_style adalah gaya mouse, seperti hand/crosshair/text/wait, dll.
Mari kita berikan contoh spesifik untuk memperdalam pemahaman semua orang tentang pengaturan gaya mouse.
<span style=cursor:hand> hand: adalah bentuk tangan yang familiar. < /span>
< span style=cursor:crosshair>crosshair: Ini adalah crosshair, yang merupakan gaya yang digunakan di beranda Little Turtle. < /span>
< span style=cursor:text>teks: adalah gaya yang biasanya digunakan mouse untuk menggerakkan teks. < /span>
< span style=cursor:wait>wait: adalah efek menunggu. < /span>
< span style=cursor:default>default: adalah efek default. < /span>
< span style=cursor:help>help: adalah gaya mouse dengan tanda tanya. < /span>
< span style=cursor:e-resize>e-resize: adalah panah ke kanan. < /span>
< span style=cursor:ne-resize>ne-resize: adalah tanda panah yang mengarah ke atas ke kanan. < /span>
< span style=cursor:n-resize>n-resize: adalah panah ke atas. < /span>
< span style=cursor:nw-resize>nw-resize: adalah panah yang mengarah ke atas ke kiri. < /span>
< span style=cursor:w-resize>w-resize: Ini adalah panah yang diteruskan ke kiri. < /span>
< span style=cursor:sw-resize>sw-resize: adalah panah yang mengarah ke bawah ke kiri. < /span>
< span style=cursor:s-resize>s-resize: adalah panah ke bawah. < /span>
< span style=cursor:se-resize>se-resize: adalah panah yang mengarah ke bawah ke kanan. < /span>
< span style=cursor:auto>auto: adalah efek otomatis dari sistem. </span>
Salin kode di atas ke halaman web Anda dan tekan F12 untuk melihat pratinjau. Gerakkan mouse Anda ke atas teks yang sesuai dan lihat apa yang terjadi pada mouse? Apakah teks tersebut muncul dengan gaya yang sesuai?