[开发工具] html5常用语法-1:标题段落无序列表超链接图片块表格

开发: C++知识库 Java知识库 JavaScript Python PHP知识库人工智能区块链大数据移动开发嵌入式开发工具数据结构与算法开发测试游戏开发网络协议系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑笔记本显卡显示器固态硬盘硬盘耳机手机 iphone vivo oppo 小米华为单反装机图拉丁

-> 开发工具 -> html5常用语法-1:标题段落无序列表超链接图片块表格 -> 正文阅读

[开发工具]html5常用语法-1:标题段落无序列表超链接图片块表格

1.idea新建web项目

新建项目
在这里插入图片描述
选web,next

随便命个名字

2.html代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>这是Title</title>
</head>
<body>
<!-- 六种标题-->
<h1>这是标题一</h1>
<h2>这是标题二</h2>
<h3>这是标题三</h3>
<h4>这是标题四</h4>
<h5>这是标题五</h5>
<h6>这是标题六</h6>

<!-- 段落：</br>换行符-->
<p>这是段落这是段落这是段落这是段落这是段落这是段落这是段落这是段落这是段落这是段落</br>
    这是段落这是段落这是段落这是段落这是段落这是段落这是段落这是段落这是段落这是段落
</p>

<!-- 无序列表-->
<ul>
    <ul>
        <ul>
            <ul>
                <li>cat4</li>
            </ul>
            <li>cat3</li>
        </ul>
        <li>cat2</li>
    </ul>
    <li>cat</li>
    <li>dog</li>
    <li>dragon</li>
</ul>

<!-- 超链接-->
<a href = "https://www.baidu.com">百度</a></br>
<a href = "./跳转页.html">百度</a></br>

<!-- 图片标签-->
<img src=".\img\游戏人物.png" width="1000" height="600">


<!-- 块标签-->
<div style="border: 1px solid red; width: 100px; height: 30px">这是块标签1</div>
<div>这是块标签2</div>

<span style="border: 1px solid red; width: 100px; height: 30px">这是块标签1</span>
<span>这是块标签2</span>

<p> </p>
<!-- 表格-->
<table>
    <tr>
        <th>企业</th>
        <th>渠道</th>
        <th>金额</th>
    </tr>
    <tr>
        <td>百度</td>
        <td>网页</td>
        <td rowspan="2">2000万</td>
    </tr>
    <tr>
        <td>阿里</td>
        <td>电话</td>
    </tr>
    <tr>
        <td>腾讯</td>
        <td colspan="2">1000万</td>
    </tr>
</table>


<style typeof="text/css">
    table,th,td{
        border-collapse: collapse;
        border: 1px solid sandybrown;
        padding: 5px;
    }
</style>

</body>
</html>