///////////////////////
宣告
#toolbar li#files-tab {
left: 185px;
width: 96px;
background-image: url(./img/toolbar_tab-files.png);
}
使用
<ul id="toolbar">
<li class="active" id="new-tab"><a title="New in Coda 1.6" onclick="ScrollSection('new-pane', 'scroller', 'new-pane'); return false" href="#new-pane">New!</a></li>
<li class="inactive" id="sites-tab"><a title="Sites" onclick="ScrollSection('sites-pane', 'scroller', 'new-pane'); return false" href="#sites-pane">Sites</a></li>
<li class="inactive" id="files-tab"><a title="Files" onclick="ScrollSection('files-pane', 'scroller', 'new-pane'); return false" href="#files-pane">Files</a></li>
<li class="inactive" id="editor-tab"><a title="Editor" onclick="ScrollSection('editor-pane', 'scroller', 'new-pane'); return false" href="#editor-pane">Editor</a></li>
<li class="inactive" id="preview-tab"><a title="Preview" onclick="ScrollSection('preview-pane', 'scroller', 'new-pane'); return false" href="#preview-pane">Preview</a></li>
<li class="inactive" id="css-tab"><a title="CSS" onclick="ScrollSection('css-pane', 'scroller', 'new-pane'); return false" href="#css-pane">CSS</a></li>
<li class="inactive" id="more-tab"><a title="More" onclick="ScrollSection('more-pane', 'scroller', 'new-pane'); return false" href="#more-pane">More</a></li>
</ul>
///////////////////////
宣告
div.button#left { left: 0; }
div.button#right { right: 0; }
使用
<div id="right" class="button"><a href="javascript:ScrollArrow('right','toolbar','scroller','new-pane');"><img onmouseout="this.src = 'img/button-right.gif'" onmouseover="this.src = 'img/button-right-rollover.gif'" alt="right scroll arrow" src="./img/button-right.gif"></a></div>
///////////////////////