在前端開發(fā)中，經(jīng)常需要使用到 IP 地址輸入框。在 HTML 中，可以使用 input 標(biāo)簽的 type 屬性設(shè)置為 text 來創(chuàng)建一個(gè)文本輸入框。

同時(shí)，我們可以使用 CSS 對 IP 地址輸入框進(jìn)行樣式設(shè)計(jì)。在這里，我們使用 pre 標(biāo)簽來展示 CSS 代碼。

以上是一個(gè)簡單的 IP 地址輸入框的 HTML 代碼。下面我們給它添加一些 CSS 樣式。

.ip-input {
width: 200px;
height: 30px;
border: 1px solid #ccc;
border-radius: 5px;
padding: 5px;
font-size: 16px;
}

經(jīng)過以上 CSS 樣式的設(shè)置，我們得到了一個(gè)簡單的 IP 地址輸入框。其中，width 屬性和 height 屬性用來設(shè)置輸入框的寬度和高度；border 屬性用來設(shè)置輸入框邊框的樣式；border-radius 屬性用來設(shè)置輸入框的圓角；padding 屬性用來設(shè)置輸入框內(nèi)容和邊框的間隔；font-size 屬性用來設(shè)置輸入框內(nèi)文字的字體大小。

當(dāng)然，以上只是一個(gè)簡單的例子。在實(shí)際開發(fā)中，我們可能需要根據(jù)具體的需求對 IP 地址輸入框進(jìn)行更精細(xì)的樣式設(shè)計(jì)。不過相信通過以上的介紹，大家已經(jīng)掌握了如何使用 CSS 來設(shè)計(jì) IP 地址輸入框的基礎(chǔ)知識(shí)。