DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> CSS入門知識 >> CSS詳解 >> 用CSS輕松實現網上填空
用CSS輕松實現網上填空
編輯:CSS詳解     
  在網上做有獎信息的時候,經常看見一些注冊表單,只有一條線供你填寫,就跟做考卷時的填空題一樣,很Cool!

    其實要做成這樣的效果並不難,只需用一段很簡短的CSS代碼即可搞定!

    < style type="text/CSS">
  < !--
  .xian{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">
  < !--
  .xian{BORDER-LEFT-STYLE: none; BORDER-RIGHT-STYLE: none; BORDER-TOP-STYLE: none ;}
  -- >
  < /style>< !--注:此段為CSS代碼,在這裡更改參數可以設置出更cool的效果-->
  < /head>
  < body bgcolor="#FFFFFF" text="#000000">
  隱藏你的邊框
  < p>用戶名:
  < input type="text" name="name" class=xian> < !--注:class=這條一定要加,設置你的CSS應用在表單裡面-- >
  < /p>
  < /body>
  < /Html>

    實現的效果簡潔清爽,怎麼樣,也改改你的表單吧!

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved