...

主要使用border-radius屬性實現圓，半圓，定位坐標覆蓋部分模塊。 半圓： 實例源碼 ...

太極圖可以理解為一個一半黑一半白的半圓，上面放置着兩個圓形，一個黑色邊框白色芯，一個白色邊框黑色芯。 1、實現黑白各半的圓形。 2、用：before偽類實現一個黑色邊框白色芯的園。 3、用：after偽類實現一個白色邊框黑色芯的圓 ...

...

...

使用一個div實現太極圖的步驟如下： HTML部分： 第一步，結合border實現左黑右白的正方形，加上圓角、陰影。代碼如下; 效果如下： 第二步，通過偽類，實現一個一個白色的圓形，定位好位置。同時，利用box-shadow:0 200px 0 #000 ...

使用三個div實現太極圖的步驟如下： HTML部分 第一步，畫一個寬高為300px的圓，並為其加上陰影（為了看起來有立體感） 　　　　　　/*animation:rotation 2.5s linear infinite ...