CSS 畫乙個心

2022-02-13 22:38:35 字數 906 閱讀 1850

效果圖:

實現原理:

可以把這個心分為兩部分,兩個長方形,分別設定 border-radius,transform: rotate() 。

設定屬性之後

再次新增乙個,設定相反的 rotate

設定其中乙個的 left 值 就成了

為了看起來有立體感,可以設定左邊的 box-shadow 。

css

bodydivdiv::before,div::afterdiv::afterdiv::before@keyframes tiaodong50%100%}
html

<

div>

div>

用的是 after 和 before 偽元素實現的,沒有考慮相容性,在 ie 10 之前就顯示不出來了。

可以用 span 元素替換掉 after 和 before 解決掉。

需要加上: -ms-transform 。

若是用 span 元素畫的話,需要右邊的塊設定 z-index 屬性。

遇到的問題:

求指點迷津qaq

CSS 畫乙個心

效果圖 實現原理 可以把這個心分為兩部分,兩個長方形,分別設定 border radius,transform rotate 設定屬性之後 再次新增乙個,設定相反的 rotate 設定其中乙個的 left 值 就成了 為了看起來有立體感,可以設定左邊的 box shadow cssbodydivdi...

Python 畫乙個心形

畫心形圓弧 defhart arc for i in range 200 turtle.right 1 turtle.forward 2 defmove pen position x,y turtle.hideturtle 隱藏畫筆 先 turtle.up 提筆 turtle.goto x,y 移動...

用C語言畫乙個心

環家偉 這次我教大家用 畫乙個心,這樣你們就可以送給你們的女 男 朋友了。沒找到物件的也可以用來表白啊。2.聯絡高中的數學知識,我們知道 f x 0和f x 0的點分別在圖形線兩邊 這樣我們可以通過 這兩個公式篩選出在心裡面或者外面的點,然後對他們進行不同的操作。如果想畫乙個紅心就可以這樣寫 for...