HTML愛(ài)心代碼是一種可愛(ài)又常見(jiàn)的代碼,常常在網(wǎng)頁(yè)設(shè)計(jì)中使用,下面我們看一下HTML中實(shí)現(xiàn)愛(ài)心的方式。
<!DOCTYPE html> <html> <head> <title>HTML愛(ài)心代碼</title> </head> <body> <div style="width: 180px; height: 160px; margin: 100px auto; position: relative;"> <div style="position: absolute; top: 0; left: 60px; width: 60px; height: 100px; background: #FFB6C1; transform: rotate(-45deg); border-radius: 30px 30px 0 0;"></div> <div style="position: absolute; top: 0; right: 60px; width: 60px; height: 100px; background: #FFB6C1; transform: rotate(45deg); border-radius: 30px 30px 0 0;"></div> <div style="position: absolute; top: 30px; left: 0; width: 180px; height: 120px; background: #FFB6C1; border-radius: 90px 90px 0 0;"></div> </div> </body> </html>
以上的代碼利用了HTML中的樣式和一些定位屬性,通過(guò)組合實(shí)現(xiàn)了一個(gè)非常可愛(ài)的愛(ài)心圖案,在實(shí)際運(yùn)用中,可以根據(jù)需要進(jìn)行自行調(diào)整。