Day 2 (html)

特别叮嘱禁止的错误

1.不要行内包区块

  • 行内:(inline) span
  • 区块:(block) p ha div
    使用区块包行内，虽然效果有时候会一样
    但是不要行内包区块

2.CSS相对应用法

(1). => class

        .opName
        {
            color: #AC915D;
        }

(2)XXX => < XXX >标签

        table {
            border-collapse: collapse;
        }

<table>
    <tr>
        <th class="opName" colspan="4">跨4列</th>
    </tr>
    <tr>
        <td rowspan="2"><img src="./img/op_01.jpg" alt=""></td>
        <td class="opName">B1</td>
        <td rowspan="2"><img src="./img/op_02.jpg" alt=""></td>
        <td class="opName">D1</td>
    </tr>
    <tr>
        <td class="opText">B2</td>
        <td class="opText">D3</td>
    </tr>

    <tr>
        <td rowspan="2"><img src="./img/op_03.jpg" alt=""></td>
        <td class="opName">B3</td>
        <td rowspan="2"><img src="./img/op_04.jpg" alt=""></td>
        <td class="opName">D3</td>
    </tr>
    <tr>
        <td class="opText">B4</td>
        <td class="opText">D4</td>
    </tr>
</table>

(3)#=>id


<head>
    <style>
        span{
            color: red;
        }
        #g{
            color: green;
        }
        #b{
            color: blue;
        }

    </style>
</head>

<body>
    三原色有，
    <span style="color:red";>红</span><span style="color:green";>绿</span><span style="color:blue";>蓝</span>三种颜色
</body>

3.设定Tab

https://ithelp.ithome.com.tw/upload/images/20210524/20137684ezTgjjn7Fj.png
选择空格4格比较好用

4.课後练习的发现

如果要使用同一个固定的路径可以先把大路径用base设在

<head>
        <base href="http://sheng.phy.nknu.edu.tw/shengwjs08MY/">
</head>

但是
1.如果此处放置#TOP会错误跑到前述网址+/#top

<a href="#top">到TOP</a>

2.注意不要放相对位置亦会错误

<a href="03-2.3.html">

    <p>大路径的使用方式,配合＜head＞</p>
    <a href="wjs-1305.htm">素材网01</a><br>
    <a href="wjs-1304.htm">素材网02</a>

<<:  该如何证明资料曾经存在?

>>:  前端工程学习日记２7天 header menu 三栏式 flex

离职倒数14天：2020年学到最多的两件事，解答了我人生最大的困惑

今年年初回顾2020年时的日记里写着，去年学到最多的两件事：一个是趁着肺炎，工作後第一次回家长住，一...

sed - 5 Replace command

前篇回顾 sed - 简介 读取编辑文字档的好工具 sed - 2 Pattern sed - 3 ...

产品团队调整

目前的产品团队主要是跑 Scrum 的方式，截至目前为止已经接近 100 次的 Sprint 了，从...

#12 JavaScript Introduction

What is JavaScript? HTML is like the structure/bon...

为了转生而点技能-JavaScript，day26(Event初探

Event(事件)：当满足触发事件的条件时，会触发设定好的事件，并执行触发後的动作。 目标.addE...