css*原來的背景色* bgbackground#39red#39 *要切換的背景色* bg_clickbackground#39green#39 js#39div#39on#39click#39，function var $div = $thisvar $others = $divsiblingsif$div。

需要準備的材料分別有電腦瀏覽器html編輯器1首先，打開html編輯器，新建html文件，例如indexhtml2在indexhtml中的ltstyle標簽中，輸入css代碼divwidth 300pxheight 150pxborder 3px solid blue。

dooropen transform translateY0 在上面的CSS代碼中，我們使用了transform屬性的translateY方法來實現(xiàn)垂直移動，并使用了transition屬性來設置動畫過渡效果我們還定義了一個類名為open的狀態(tài)，在這個狀態(tài)下，門。

其實用border還是可以到達這個效果的，但是這樣做會有缺點，就是會出現(xiàn)縫隙，因為你border就算1cm也是看的出來的，樓上說的都不錯，所以他們的方法我就不介紹了，但是哥們我推薦你用圖片替換的方式來做那樣效果會更好，首先。

設置div樣式 zindexauto auto可定義為一個值整數(shù)數(shù)字，越大代表越置前，如可定義為 zindex999前提是div是定位元素代碼實例如下1lthtml 2 ltbody 3ltstyle type=quottextcssquot 3div1 width。

原本不是圓形圖片，通過CSS樣式布局實現(xiàn)成圓形圖片，首先圖片必須為正方形1HTML源代碼完整代碼復制代碼代碼如下圖片圓形布局 在線演示 DIVCSS52對應CSS代碼復制代碼代碼如下#divcss5 margin10px auto#div。