假設(shè)用來(lái)顯示圓點(diǎn)div的class是point，圖片區(qū)域的大小是10*10px的，然后那個(gè)圖片的文件名是point_picgif那么html的代碼大致上可以寫(xiě)成下面這樣 在css里面的定義可以是這樣point width10px height10px backgroundurlpoint_picgif 0 0 norepeat pointhover background0 10px。

這類(lèi)開(kāi)發(fā)通?？梢酝ㄟ^(guò)JavaScript或CSS實(shí)現(xiàn)比如，你可以為每個(gè)名字添加一個(gè)點(diǎn)擊事件，當(dāng)點(diǎn)擊名字時(shí)，通過(guò)改變背景圖片或其他方式來(lái)實(shí)現(xiàn)圖片的變換這種技術(shù)在響應(yīng)式設(shè)計(jì)中尤其有用，可以提升用戶(hù)體驗(yàn)，使網(wǎng)站更加生動(dòng)使用焦點(diǎn)圖也是一種有效的方法你可以設(shè)置焦點(diǎn)圖的切換邏輯，使得點(diǎn)擊名字時(shí)，焦點(diǎn)圖自動(dòng)。

在網(wǎng)頁(yè)插入div很簡(jiǎn)單，就是寫(xiě)這樣一對(duì)標(biāo)記，就在網(wǎng)頁(yè)里建立了一個(gè)div，不過(guò)這是默認(rèn)的格式，css就是來(lái)為這個(gè)div設(shè)置各種外觀，比如長(zhǎng)度高度邊框等等，所以你要是在一個(gè)已經(jīng)建好的不是div+css布局的網(wǎng)頁(yè)上添加div，如果這個(gè)網(wǎng)頁(yè)元素不多，還不麻煩主要是要會(huì)一點(diǎn)csscss比較簡(jiǎn)單，比js簡(jiǎn)單多了。

好多種類(lèi)型的 ，今天給你寫(xiě)一下最簡(jiǎn)單的 1234 的 焦點(diǎn)圖切換2首先電腦上 ps處理好 470PX * 150px的圖片三四張為了方便觀看效果最好三張以上處理完成后 如下圖 放在同一個(gè)文件夾中 3電腦上安裝好 Dreamweaver 軟件 編寫(xiě)代碼的我這里用的 DW cs55 4打開(kāi)后開(kāi)始編寫(xiě)代碼 我。

這是JS焦點(diǎn)圖切換代碼，需要寫(xiě)jscss等代碼，如果你是新手，建議你用網(wǎng)絡(luò)上的吧，同樣也是不錯(cuò)的。

在css里寫(xiě) container width 800pxmargin 0 auto 就把寬設(shè)置成800px，并居中了。

純JS+HTML+CSS制作出的幻燈片效果 代碼簡(jiǎn)單，思路講解也很清晰，有詳細(xì)demo示例 details53。

另存為下列代碼試試吧，應(yīng)該還有樣式文件css吧 lt！DOCTYPE html PUBLIC quotW3CDTD XHTML 10 TransitionalENquot quotDTDxhtml1transitionaldtdquot 無(wú)標(biāo)題文檔 var n=0function Meavalue n=valuesetBgvalueplaysvalueconausn f。

焦點(diǎn)圖輪播我建議你使用插件，SuperSlide插件layer插件swiper插件，都可以滿(mǎn)足你的要求，最主要的是使用簡(jiǎn)單，兼容性也好。

bleucss中的slide段slide會(huì)不起作用可把此段main colleftslide中和它外層盒子的內(nèi)容根據(jù)需要放到你自己的盒子中2會(huì)出現(xiàn)本想要3個(gè)圖片，卻出現(xiàn)6個(gè)圖片后三個(gè)空白的現(xiàn)象，是因?yàn)榻裹c(diǎn)圖沖突，你的html文件中出現(xiàn)了相同一兩個(gè)幻燈片盒子取消一個(gè)或重新設(shè)置另一個(gè)。