CSS的背景圓點是一種很實用的設計元素,可以用來點綴頁面內容,增加視覺效果。
下面是一段示例CSS代碼,可以用來實現帶有圓點背景的文本:
p {
background-image: radial-gradient(circle, #fff 5px, transparent 6px);
background-size: 10px 10px;
background-position: top left;
background-repeat: repeat-y;
padding-left: 20px;
}
這段代碼中,我們使用了radial-gradient函數來創建一個徑向漸變背景。其中,circle參數表示漸變的形狀為圓形,#fff 5px表示從白色開始,漸變到半徑為5像素的位置,transparent 6px表示從透明開始,漸變到半徑為6像素的位置。
接著,我們指定了背景的大小為10像素,位置在左上角,水平方向上重復填充,并設置了左側的內邊距為20像素。
這樣,我們就成功地實現了帶有圓點背景的文本效果。
上一篇css黑色代碼對照表
下一篇css背景怎么樣平鋪開來