在網上我們常常看見一些注冊表單的輸入框部分並不是我們常見的矩形框，而是一條細線，很多朋友對此很感興趣。其實要實現這樣的效果並不困難，我們只要用一段簡短的CSS代碼控制好表單輸入框的樣式即可。
示例如下：
請輸入您的用戶名：
下面我們就來看看這段實現效果的CSS代碼。它主要運用了表格邊框的樣式控制，將左、上、右邊框設置為none，只剩下下邊框即可。
<style type="text/CSS">
<!--
.line{
BORDER-LEFT-STYLE: none;
BORDER-RIGHT-STYLE: none;
BORDER-TOP-STYLE: none
}
-->
</style>
樣式表中代碼解釋如下：
“BORDER-LEFT-STYLE:none”： 隱藏左邊框
“BORDER-RIGHT-STYLE: none”： 隱藏右邊框
“BORDER-TOP-STYLE: none”： 隱藏上邊框
“BORDER-bottom-STYLE: none”： 隱藏下邊框。
下面讓我們一起來看一個應用實例：
<Html>
<head>
<title>橫線式輸入框</title>
<style type="text/CSS">
<!--
.line{
BORDER-LEFT-STYLE: none;
BORDER-RIGHT-STYLE: none;
BORDER-TOP-STYLE: none ;
}
-->
</style>
<!--注：此段為CSS代碼，你還可以在這裡設置出其他的樣式效果-->
</head>
<body bgcolor="#FFFFFF" text="#000000">
隱藏的邊框的輸入框：
<p>用戶名：<input type="text" name="name" class=line>
<!-- 注：class=line 這條語句將你預設的CSS應用在表單中 -->
</p>
</body>
</Html>
實現效果簡潔清爽。