html&&html5（3）_html5中日期和c# 互传-优快云博客

本文介绍如何使用纯CSS绘制太极图案，通过特殊的边框和伪元素技巧实现阴阳鱼的效果，并附带了HTML代码示例。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

css 画太极：

<!DOCTYPE html> <html lang="en"> <head>    <meta charset="UTF-8"> <title>Document</title> <style>    #t2 {        width: 300px;        height: 600px;        background: white;        border:1px solid black;        border-left: 300px solid black;        border-radius: 300px;    }
    #t2::before{        content: '';        display: block;        width: 100px;
        height: 100px;        border: 100px solid black;        background: white;        border-radius: 150px;        margin-left: -150px;    }
    #t2::after {        content: '';        display: block;        width: 100px;        height: 100px;        border: 100px solid white;        background: black;        border-radius: 150px;        margin-left: -150px;    } </style> </head> <body>    <div id="t2"></div> </body> </html>

相对定位与绝对定位

position: relative;

position:absolute;

css手册 -> 布局 -> overflow

去手册找表单元素 type 写法；

★ 提高源自模仿查询尽在手册