WEB第一次作业

作业分析:

本次要使用table表格标签编写如下的效果:


screenshot-1733928485928.png

代码实现:

使用html标签代码实现

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <h3>人物介绍</h3>
    <table border="1" 
            width="1200"
            align="center"
            cellspacing="0"
            cellpadding="3"
        <tr >
            <td width="30" rowspan="4" >剑来</td>
            <td width="50">姓名</td>
            <td>相貌</td>
            <td>人物设定</td>
            <td width="200">技能或被动</td>
            <td width="200">经典语录</td>
        </tr>
        <tr>
            
            <td>陈平安</td>
            <td><img src="./images/20240903092028324.jpg.1680.0.jpg" width="300px"></td>
            <td>陈平安,出生于三十六小洞天之一的骊珠洞天小镇。家境贫寒,在五岁时遭遇父母双亡的悲痛,陈平安依靠在瓷窑劳动以及为邻居担水送信维持生计。资质平平,先天不足,但凭借不懈的努力和勤奋,最终武道大成</td>
            <td>修习功法:《撼山谱》、《剑气十八停》、《剑术正经》<br>
               本命飞剑:笼中雀、井底月 <br>              飞    剑:初一、十五、松针、啖雷、笼中雀、井底月
            </td>
            <td>“大千世界,无奇不有。天道崩塌,我陈平安,唯有一剑,可搬山,断江,倒海,降妖,镇魔,敕神,摘星,摧城,开天。”</td>
        </tr>
        <tr>
           
            <td>宁姚</td>
            <td><img src="./images\496.avif"" width="300"></td>
            <td>宁姚,剑气长城两大剑仙眷侣之女,在骊珠洞天曾和陈平安一起对敌,教导陈平安拳谱《撼山谱》。和陈平安互相喜欢,在剑气长城表达心意。父母因在与妖族赌斗中战死而受人唾弃。在倒悬山对主角说:“陈平安,我喜欢你,不比你喜欢我少一点点。”现修为飞升境剑修,但曾言:“境界对于宁姚无意义。”
                在剑气长城被蛮荒天下破城后,随另一半城池飞升第五座天下,并在第五座天下破境,成为第五座天下第一位玉璞境剑修,得整座天下大道庇护。现已破境成为飞升境剑修,成为第五座天下第一位飞升境修士,现已去找陈平安。</td>
            <td>本命飞剑:斩仙、天真<br>
                配    剑:剑仙</td>
            <td>我宁姚的命运,由我自己的剑来书写。</td>    
        </tr>
        <tr>
   
            <td>齐静春</td>
            <td><img src="./images\2024071618014962202.jpg" width="300" </td>
            <td>齐静春,小说《剑来》第一卷的核心人物,为儒家第四圣文圣的亲传弟子,有三个本命字“齐”“静”“春”。被誉为“有望立教称祖的读书人”。浩然天下战役中,与绣虎崔瀺布局引诱贾生(周密)入局一战。骊珠洞天破碎前,齐静春牺牲自己换取小镇几千百姓的性命,最终消逝。</td>
            <td>境    界:十四境(失传境)、三个本命字
                合道三教根基.
            </td>
            
            <td>天下有我齐静春,天下快哉,我亦快哉!</td>
        </tr>
    </table>
</body>
</html>

个人总结:

对于图片的插入,得保存起,从文件中复制来粘贴,使用相对路径。不能使用绝对路径,即直接从网站复制粘贴。
还有对“行,列”不熟悉,易搞混,<tr>是行;<td>是列
对于行,列:直接在<>这里面就行。

是换行
对于列出表格,有简便方法:再body中输入:
h3{表格属性标签}+table>tr3>td{内容$$$}3
(此中是tr乘3,同样后面3前面有一个乘号)

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • 1
    牢弟还得练阅读 548评论 0 0
  • #作业分析 本次要使用table表格标签编写如下效果 #代码实现 使用html标签代码实现 ...html <!D...
    W_2848阅读 1,081评论 0 0
  • 作业分析 本次要使用table表格标签编写如下的效果 代码实现 使用html标签代码实现 个人总结 这次作业让我对...
    jhsdgfa阅读 818评论 0 0
  • 作业分析 本次要使用table表格标签编写如下效果 代码实现--HTML标签代码实现 <!DOCTYPE html...
    C_11f7阅读 493评论 0 0
  • 作业分析 本次要使用table表格标签编写如下效果 代码实现 使用HTML标签代码实现<!DOCTYPE html...
    C_11f7阅读 514评论 0 0

友情链接更多精彩内容