テーブルを使用してフォームコントロールの形式を調整し、見栄えを良くします。

自分でウェブページを書きたいので、HTML 言語についても少し勉強しています。これは、大学時代にウェブデザインに興味があったことを思い出させます。残念ながら、当時は自分のコンピュータを持っていませんでした。よくインターネットカフェに行ってフロッピーディスクを買って画像をダウンロードし、fontpage を使用してウェブページをいくつか作成していました。その後、コンピュータを購入し、「Legend」に夢中になり、ウェブデザインのことも忘れてしまいました...

私は Ubuntu で作業しており、Linux には WYSIWYG Web デザインツールがほとんどなかったので、最終的に Bluefish を選択しました。

デバイスを追加するフォームを作りたいのですが、プレフィックスが異なるため見た目が醜くなってしまいます。図の通りです。

コードをコピー

コードは次のとおりです。

<!DOCTYPE html>
<meta http-equiv="コンテンツタイプ" コンテンツ="text/html; charset=utf-8" />
<html>
<本文>
ユーザー名:<input type="text" name="username"><br/>
パスワード:<input type="password" name="password">
</本文>
</html>

この入力ボックスは整列していないので、とても残念に思います。すると同僚が、テーブルを使用してフォーマットできると言ってきたので、アドバイスを求めました。コードは次のようになります。

コードをコピー

コードは次のとおりです。

<!DOCTYPE html>
<meta http-equiv="コンテンツタイプ" コンテンツ="text/html; charset=utf-8" />
<html>
<本文>
<テーブル>
<tr>
<td>ユーザー名:</td>
<td><input type="text" name="ユーザー名"><br/></td>
</tr>
<tr>
<td>パスワード:</td>
<td><input type="password" name="パスワード"></td>
</tr>
</テーブル>
</本文>
</html>

ああはは、新しいスキルを手に入れました。Tong Junの強力なサポートに感謝します〜〜

また、CSS を使用してテーブルのフォーマットを制御する方法も学びました。

コードをコピー

コードは次のとおりです。

<スタイルタイプ="text/css">
テーブル{border-top:#000 solid 1px; border-left:#000 solid 1px;}
td{ border-bottom:#000 solid 1px; border-right:#000 solid 1px;}
</スタイル>

<<: Tkinterはjsキャンバスを使用してグラデーションカラーを実現します

>>: DockerがMySQL構成実装プロセスを開始