JavaWeb2自用（标签）

最新推荐文章于 2024-09-08 11:55:17 发布

压住AK也压住了你

最新推荐文章于 2024-09-08 11:55:17 发布

阅读量231

点赞数

文章标签： gnu

本文链接：https://blog.csdn.net/cihuaiya/article/details/121798365

版权

对其的实现：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<table border="30">
    <thead>
     <tr>
         <th>班级</th>
         <th>分组</th>
         <th>学生</th>
         <th>随便</th>
     </tr>
    </thead>
    <tbody>
    <tr>
        <td rowspan="6">葵花班</td>
        <td rowspan="3">A组</td>
        <td>张三</td>
        <td>1</td>
    </tr>
    <tr>
        <td>李四</td>
        <td>2</td>
    </tr>
    <tr>
        <td colspan="2">王五</td>
    </tr>
    <tr>
        <td rowspan="3">B组</td>
        <td colspan="2">孙六</td>
    </tr>
    <tr>
        <td>韩七</td>
        <td>3</td>
    </tr>
    <tr>
        <td>鲁八</td>
        <td>4</td>
    </tr>
    <tr>
        <td rowspan="3">莲花班</td>
        <td rowspan="3">A组</td>
        <td>Alice</td>
        <td>5</td>
    </tr>

    <tr></tr>
    <tr>
        <td rowspan="2" colspan="2">Fallen</td>
    </tr>
    </tbody>
</table>
</body>
</html>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>练习！</title>
</head>
<body>
<a href="http://www.baidu.com"><img src="..."></a>
<a href="#">空链接</a>
<a href="#one">目录</a>
<a href="https://co2.cnki.net/Login.html?dp=xaufe&r=1638947886542">毕设论文</a>>
<p id="one">>
    content属性值 : <br>
    width:可视区域的宽度，值可为数字或关键词device-width<br>
    height:同width<br>
</p>
<p>
    复杂的说：<br>
    移动前端开发之viewport的深入理解<br>
    在移动设备上进行网页的重构或开发，首先得搞明白的就是移动设备上的viewpor
</p>
</body>
</html>

上图中#one表示点击目录定位到id=one的文本

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>做饭</title>
</head>
<body>
<h1>西红柿炒鸡蛋</h1>
<img src="">
<h2>食材</h2>
<ul>
    <li>
        <h3>主料</h3>
        <ul>
            <li>西红柿</li>
            <li>鸡蛋</li>
        </ul>
        <h3>配菜</h3>
        <ul>
            <li>香菇</li>
            <li>瘦肉</li>
        </ul>
    </li>
</ul>
<h2>步骤</h2>
<ol>
    <li>打鸡蛋</li>
    <li>下锅炒</li>
    <li>出锅</li>
</ol>
</body>
</html>

ol有序 ul无序自定义标题 dl dt dd

其中div和span div简单来说说是自动换行 span是不换行的

<h1>某某某</h1>
<!-- 基本信息 -->
<div>
    <h2>基本信息</h2>
    <img src="image/profile.jpg">
    <p><span>求职意向：</span>Java 开发工程师</p>
    <p><span>联系电话：</span>XXX-XXX-XXXX</p>
    <p><span>邮箱：</span>xxx@foxmail.com</p>
    <p><a href="https://github.com">我的 github</a></p>
    <p><a href="https://csdn.com">我的 博客</a></p>
</div>
<!-- 教育背景 -->
<div>
    <h2>教育背景</h2>
    <ol>
        <li>1990 - 1996 小葵花幼儿园 幼儿园</li>
        <li>1996 - 2002 小葵花小学 小学</li>
        <li>2002 - 2005 小葵花中学 初中</li>
        <li>2005 - 2008 小葵花中学 高中</li>
        <li>2008 - 2012 小葵花大学 计算机专业 本科</li>
    </ol>
</div>
<!-- 专业技能 -->
<div>
    <h2>专业技能</h2>
    <ul>
        <li>Java 基础语法扎实，已经刷了 800 道 Leetcode 题；</li>
        <li>常见数据结构都可以独立实现并熟练应用；</li>
        <li>熟知计算机网络理论，并且可以独立排查常见问题；</li>
        <li>掌握 Web 开发能力，并且独立开发了学校的留言墙功能。</li>
    </ul>
</div>
<!-- 项目 -->
<div>
    <h2>我的项目</h2>
比特就业课
综合案例: 填写简历信息
    <ol>
        <li>
            <h3>留言墙</h3>
            <p>开发时间：2008年9月 到 2008年12月</p>
            <p>功能介绍：
            <ul>
                <li>支持留言发布</li>
                <li>支持匿名留言</li>
            </ul>
        </p>
    </li>
<li>
    <h3>学习小助手</h3>
    <p>开发时间：2008年9月 到 2008年12月</p>
    <p>功能介绍：
    <ul>
        <li>支持错题检索</li>
        <li>支持同学探讨</li>
    </ul>
</p>
</li>
</ol>
</div>