HTML分隔線如何美化？

做HTML頁面開發時，在幾段文字之間，或幾塊內容之間，經常會使用分隔線去做分隔，以讓頁面顯示更加有條理。分隔線我們基本上都是用hr標籤去生成，怎麼去美化這個分隔線？下面一起看下。

操作方法

（01）先看下我們的html代碼，二個p段落，中間用hr作分隔，代碼如圖。

（02）頁面執行後，可以看到，默認的hr分隔線就是一條黑色的線條，算不上美觀。

（03）透過添加一些樣式，我們可以設定hr分隔線的大小和顏色，主要是設定它的border樣式。代碼如下，ent hr{ border: 2px solid #cc0000 }

（04）重新載入頁面，可以看到效果如圖

（05）我們還可以把分隔線默認的實體線改成點劃線，只需要把border樣式改成如下：border: 1px dashed #cc0000;效果如圖。

（06）另外如果你需要很複雜的分隔線，就需要用背景圖來實現了，我們可以爲hr設定背景圖，但要注意的是，如果是用背景圖，我們一定要設定hr的高度，和把border設定爲none，代碼如圖

（07）效果如圖，我們的分隔線雖然很簡單，但也能設定很多樣式，能做很好的美化效果。