前端应用_html_利用html表格制作个人简历_02

最新推荐文章于 2024-05-12 03:14:35 发布

上海_彭彭

最新推荐文章于 2024-05-12 03:14:35 发布

阅读量2k

点赞数 2

分类专栏： html 文章标签： html 表格演示表格制作

本文链接：https://blog.csdn.net/qq_34979346/article/details/96969788

版权

html 专栏收录该内容

14 篇文章 0 订阅

订阅专栏

作业为制作的个人简历的样式为如下：
在这里插入图片描述
特点如下：

第一行全部合并
图片占据竖直五个格子

我们要用到的知识就是合并。
1.首先用快捷键制作一个表格 table>(tr>td*5) 然后点击tab 键。
3. 加border 和表格高度以及宽度 (winth ,height)
4. 合并第一行， (colspan)
5. 合并图片占用的格子（rowspan）
代码例子如下：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <!-- 这是注释的格式-->

</head>
<h1>简历制作</h1>
<!-- table 标签是创建一个表格， tr 代表是一行， th 是字段名称 ， td 是字段的值，border 是边框 -->

<table border="1"  width="600" height="300">
    <tr>
        <td colspan="5"></td>
    </tr>
    <tr>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td rowspan="5"></td>
    </tr>
    <tr>
        <td></td>
        <td></td>
        <td></td>
        <td></td>

    </tr>
    <tr>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
    </tr>
    <tr>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        
    </tr>
    <tr>
        <td></td>
        <td></td>
        <td></td>
        <td></td>

    </tr>
</table>
</body>
</html>

效果如下：
在这里插入图片描述

上海_彭彭

关注

2
点赞
踩
13

收藏

觉得还不错? 一键收藏
3
评论
前端应用_html_利用html表格制作个人简历_02

作业为制作的个人简历的样式为如下：特点如下：第一行全部合并图片占据竖直五个格子我们要用到的知识就是合并。1.首先用快捷键制作一个表格 table>(tr>td*5) 然后点击tab 键。3. 加border 和表格高度以及宽度 (winth ,height)4. 合并第一行， (colspan)5. 合并图片占用的格子（rowspan）代...
复制链接

扫一扫