使用 html css 和 js 克隆 Chatgpt 註冊頁面 https://www.instagram.com/webstreet_code/

在 Instagram 上追蹤我們：https://www.instagram.com/webstreet_code/

    
    
    <title>ChatGPT 註冊</title>
    
        /* 常規重置 */
        * {
            保證金：0；
            填充：0；
            框大小：邊框框；
            字體系列：Arial、無襯線字體；
        }

        /* 居中容器 */
        。容器 {
            最大寬度：350px；
            邊距：50px 自動；
            文字對齊：居中；
            顏色：#333；
        }

        /* 標誌和標題 */
        .container img {
            寬度：80px；
            底部邊距：80px；
        }

        h1 {
            字體大小：30px；
            字體粗細：粗體；
            下邊距：20px；
            /* 顏色: hsl(152, 97%, 30%); */
        }

        /* 輸入和按鈕 */
        .輸入容器{

            對齊項目：居中；
            調整內容：居中；
            下邊距：20px；
        }

        .input-container 輸入[type="text"] {
            內邊距：16px；
            寬度：100%；
            邊框：1px實心#ccc；
            邊框半徑：5px；
            概要：無；
            字體大小：14px；
        }

        .輸入容器按鈕{
            背景顏色：#10a37f；
            顏色: 白色;
            邊框：無；
            內邊距：15px；
            上邊距：40px；
            邊框半徑：5px；
            遊標：指針；
            字體粗細：粗體；
            寬度：100%；
        }

        .input-container 按鈕：懸停 {
            背景顏色：#064d22；
        }

        /* 已有帳號登入 */
        .登入連結{
            字體大小：14px；
            邊距：10px 0；
            顏色：#555；
        }

        .login-link span {
            顏色：#10a37f；
            遊標：指針；
            文字裝飾：底線；
        }

        /* 帶「OR」的除數 */
        .分隔符號{
            顯示：柔性；
            對齊項目：居中；
            調整內容：居中；
            顏色：#aaa；
            邊距：20px 0；
        }

        .divider hr {
            寬度：30%；
            高度：1px；
            背景顏色：#ccc；
            邊框：無；
        }

/* 社群登入選項 */
.logocontainer {
    顯示：柔性；
    彈性方向：列；
    間隙：10px；
    下邊距：20px；
    對齊項目：居中；
}

。標識 {
    顯示：柔性；
    對齊項目：居中； /* 在一行中垂直居中項目 */
    justify-content：flex-start； /* 對齊專案以水平開始 */
    邊框：1px實心#ccc；
    內邊距：10 像素 15 像素； /* 增加填充以獲得更好的間距 */
    邊框半徑：5px；
    遊標：指針；
    寬度：350px；
    過渡：背景色0.3s；
}.標誌圖片{
    寬度：40px；
    高度：40px；
    邊距：自動0px；
    右邊距：10px； /* 圖片與文字之間的空間 */
}

.標誌 h4 {
    字體大小：14px；
    顏色：#555；
    保證金：0； /* 刪除多餘的邊距 */
    文字對齊：左對齊； /* 確保文字左對齊 */
}

.logo:懸停{
    背景顏色：#f1f1f1；
}



        /* 頁腳連結 */
        .lastline {
            顯示：柔性；
            調整內容：居中；
            間隙：10px；
            字體大小：12px；
            顏色：#10a37f；
        }

        .lastline 小時 {
            寬度：1 像素；
            高度：12px；
            背景顏色：#ccc；
            邊框：無；
        }
    風格>
頭>

    <div>




          </div>

            
        

以上是使用 html css 和 js 克隆 Chatgpt 註冊頁面 https://www.instagram.com/webstreet_code/的詳細內容。更多資訊請關注PHP中文網其他相關文章！