Let's work with styling some OpenLayers controls. We won't be creating a theme here; instead, we'll just link to an external CSS file which will overwrite the default styles of the elements we wish to style.
Let's start off with creating a new page. We're going to also put all our custom styles in a file called control_style.css. So, whenever we add a style, be sure to put it in the control_style.css. Also, make sure to include the CSS file in the
<head>section with:<link rel='stylesheet' href='control_style.css' />
Now, let's create our map object. We'll specify the controls array when we instantiate it since we do not want the PanZoombar control in this example. We also are not using a custom theme (we are just overriding styles with the external CSS file), but if we were we would specify the
themeproperty as well.map = new OpenLayers.Map('map_element', { controls: [new OpenLayers.Control.Navigation()] });Alright, let's create some controls...