HTML 初心者 (ここ 2 日間、女の子と一緒に div+css を書いていますが、彼女の理解が必ずしも正しくないように感じています)_html/css

HTML 初心者 (ここ 2 日間、女の子と一緒に div+css を書いていますが、彼女の理解が必ずしも正しくないように感じています)_html/css_WEB-ITnose

WBOY

リリース： 2016-06-24 11:35:39

オリジナル

1085 人が閲覧しました

まず最初に、私も途中で僧侶になった者ですので、正確ではない部分があるかもしれないことを説明させていただきます。

この内容は、私が北京の会社に勤めていた時に習ったのですが、当時一緒に勉強してくれる人がいなかったので、他の人から W3C について教えてもらい、自分で読んでタイプし始めたのを覚えています。その内容に従ってコードを作成し、毎晩陵城 3 時にアクセスして、各タグの機能を理解し (標準ではないかもしれません)、タグの属性を 1 つずつ確認します。私が自主的に書いた最初のページは表を使った履歴書でした。

コード:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"><head>    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">    <title>个人简历</title></head><body bgcolor="#BBFFFF">    <center><h2>个人简历</h2></center>    <table cellpadding="0" cellspacing="0" border="1px" width="800px" height="600px" align="center">        <tr align="center" height="50px">            <td>姓名</td><td>Strip_liu</td><td rowspan="4">照片区</td>        </tr>        <tr align="center" height="50px">            <td>性别</td><td>男</td>        </tr>        <tr align="center" height="50px">            <td>电话</td><td>180xxxxxxxx</td>        </tr>        <tr align="center" height="50px">            <td>E-mail</td><td>strip_liu@xxx.com</td>        </tr>        <tr >            <td align="center">工作经验</td><td colspan="2">上大学的时候……</td>        </tr>        <tr>            <td align="center">个人介绍</td><td colspan="2">我叫XXX，……</td>        </tr>        <tr>            <td align="center">兴趣爱好</td><td colspan="2">我喜欢象棋……</td>        </tr>    </table>    <center><a href="这里当时写的是QQ空间地址">我的空间</a></center></body></html>

ログイン後にコピー

レンダリング:

厳密に言えば、このコードはまだ問題があります。なぜなら、当時私は div についてすでに知っていましたが、その使い方をまったく知らなかったからです。作ってみようと思いました履歴書というとまず表を思い浮かべますが、もともと表の形になっているので、ちょっとセルを結合するだけで大丈夫です。

ここでコードについて話しましょう。書き出した後、中央のタグが破棄されていることに気付きました。ここでは、北京カラーが bgcolor 属性としてボディに直接追加されています。テーブル内の cellpadding は、セルの外側の距離を表し、区切るために使用されます。セルとセルのスペースは通常 0 に設定されます。 cellspacing cell spacing table spacing - テーブルの境界線とセルのパディング間の距離を表し、通常は 0 に設定されます。属性は一般的ですブロック要素はありますが、表示するように設定するものと表示しないように設定するものがあります。border の一般的な使用方法は、幅と高さを設定するために使用されます。もちろん、テーブル全体のブロック要素 (ラベル) では、幅と高さの両方が設定されます。
tr は row 要素、つまり tr タグのペアは td に対応し、td は列に埋められることを意味します。複数の行にまたがるセルの結合。同様に、colspan は複数の列の範囲を表します。
上記のコードから、text-align="center" 属性が使用されていることがわかります。この書き方はひどいですが、初心者にとってはこのように書くのが一般的であり、この方法の効果を理解しやすいです。それらの一部は行の中央に配置する必要があるため、 tr に書き込みます。また、中央に配置する必要がある列は 1 つだけであるため、列の中央配置を個別に記述します。

最後は a タグ、a タグはハイパーリンク、href 属性はリンク先のページです (http:// を href に追加する必要があることに注意してください。つまり、リンクは http プロトコルを使用します) );

実際、コードは非常に簡単なので、初心者でも見てみることができます。これらは基本的にテーブルに関するいくつかのことです。実際にページを作成するには、現時点でテーブルを使用するのは明らかに非現実的ですが、これは基礎でもあります。いくつか断片的に述べましたが、初心者にとって役立つことを願っています。