ネットで懸賞情報をやっていると、試験問題の穴埋め問題のような、記入欄が1行しかない登録フォームをよく見かけますが、これはとても素敵ですね!
実際、このような効果を実現するには、非常に短い CSS コードを使用するだけで済みます。
引用した内容は以下の通りです。 < style type="text/css"> < !-- .xian{ボーダー左スタイル: なし; ボーダートップスタイル: なし} --> </スタイル> |
コードの機能は次のとおりです。
引用した内容は以下の通りです。 「BORDER-LEFT-STYLE: none」:左ボーダーを表示しない 「BORDER-RIGHT-STYLE: none」:右ボーダーを表示しない 「BORDER-TOP-STYLE: none」:上ボーダーを表示しない 「BORDER -bottom-STYLE: none" ": 上枠を表示しません。これを追加すると、枠がまったく表示されなくなります。 |
アプリケーションの例を見てみましょう。
引用した内容は以下の通りです。 <html> <頭> <title>オンラインで空白を埋める</title> < style type="text/css"> < !-- .xian{ボーダー左スタイル: なし; ボーダー右スタイル: なし;} --> </ /style>< !--注: このセクションは CSS コードであり、ここでパラメータを変更すると、よりクールな効果を設定できます--> </head> < body bgcolor="#FFFFFF" text="#000000"> 境界線を非表示にします<p>ユーザー名: < input type="text" name="name" class=xian> <!--注: class= を追加する必要があります。フォームに適用される CSS を設定します--> < /p> < /body> < /html> |
簡単かつ爽快な効果が得られますので、あなたもフォームを変えてみてはいかがでしょうか。