SHARE
Facebook X Pinterest WhatsApp

CSS and Cursors

Written By
thumbnail
Joe Burns
Joe Burns
Jan 4, 2005

     Ah, the cursor. Some like the pointing finger, some like that I-beam-looking thing, and others try to lose the cursor altogether. Whatever your cup of tea, CSS version 2.0 is trying to help. Internet Explorer 4.0 has supported these commands as of 1/17/98. I’m sure Navigator won’t be too far behind.
     Seventeen different cursor properties have been incorporated into standard CSS so you can be pretty sure some of these will work. I say “some of these” because the cursor look depends a lot more on the operating system and settings your user has set. If you didn’t know it, you can set your cursor to a whole bunch of different standard settings and even install new cursors that animate. At one time, my cursor was Snoopy on his Sopwith Camel; when I clicked on something it became a TV set with snow on the screen. I’m just a fun guy, I guess.

     So I offer this chart as help. Each link points back to this page so even if you click, it’ll just reload. Plus the link will be a description of what you should see.
     The Style Sheet command is incorporated by adding the STYLE=”–” format into the anchor command like so:

<A HREF=”/beyond/css_cursors.html
STYLE=”cursor: auto”>Text</A>

     Of course, you can also put these into a Style Block and alter the cursor for all your links at once:

<STYLE>
     link {cursor: crosshair}
<STYLE>

     So, here we go. These are the chosen seventeen. Roll your pointer over the top. Depending on a lot of factors, you may get it or you may not.

     There you go. Use them wisely.

Recommended for you...

Importing Custom Less Styles at Run-time in Angular
Rob Gravelle
Jun 14, 2022
Setting CSS Values from Less Variables in Angular
Rob Gravelle
Jun 4, 2022
Color Manipulation with JavaScript
Rob Gravelle
May 21, 2022
An Introduction to CSS-in-JS
Rob Gravelle
May 14, 2022
HTML Goodies Logo

The original home of HTML tutorials. HTMLGoodies is a website dedicated to publishing tutorials that cover every aspect of being a web developer. We cover programming and web development tutorials on languages and technologies such as HTML, JavaScript, and CSS. In addition, our articles cover web frameworks like Angular and React.JS, as well as popular Content Management Systems (CMS) that include WordPress, Drupal, and Joomla. Website development platforms like Shopify, Squarespace, and Wix are also featured. Topics related to solid web design and Internet Marketing also find a home on HTMLGoodies, as we discuss UX/UI Design, Search Engine Optimization (SEO), and web dev best practices.

Property of TechnologyAdvice. © 2025 TechnologyAdvice. All Rights Reserved

Advertiser Disclosure: Some of the products that appear on this site are from companies from which TechnologyAdvice receives compensation. This compensation may impact how and where products appear on this site including, for example, the order in which they appear. TechnologyAdvice does not include all companies or all types of products available in the marketplace.