HTML基础学习

最新推荐文章于 2024-07-28 20:59:34 发布

良睿

最新推荐文章于 2024-07-28 20:59:34 发布

阅读量164

点赞数

分类专栏： html基础文章标签： html基础

本文链接：https://blog.csdn.net/liangruilz/article/details/100995473

版权

html基础专栏收录该内容

2 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
<head lang="en">

    <!-- 解决中文乱码 -->
    <meta charset="UTF-8"/>

    <!-- 百度或者谷歌搜索时可以搜索到,但是需要注册上线后才行 -->
    <meta name="keywords" content="我的demo"/>

    <!-- 设置网页ico图标 -->
    <link rel="shortcut icon" href="favicon.ico">

    <!-- 三秒后跳转到http://www.baidu.com -->
    <!-- <meta http-equiv="refresh" content="3;url=http://www.baidu.com"/> -->

    <!-- 网页标题 -->
    <title>我的demo</title>
</head>
<body>

<!-- href="#tail"跳转到name="tail"的标签,就是尾部 -->
<a name="top" href="#tail">到底部</a>

<!-- 换行 -->
<br/>

<!-- target="show"跳转到name="show"的iframe标签显示 -->
<a href="http://taobao.com" target="show">淘宝</a>
<a href="http://baidu.com" target="show">百度</a>
<a href="http://jingdong.com" target="show">京东</a>
<br/><iframe name="show" height="600px" width="1000px"></iframe>


<!-- 图片显示标签 -->
<img src="QQ图片20190702232952.png" usemap="#baidu"/>
<map name="baidu">

    <!-- shape="rect"表示矩形,100,100表示矩形在QQ图片20190702232952.png的左上角坐标,300,300表示矩形在QQ图片20190702232952.png的右下角坐标,点击该矩形会跳转到http://www.baidu.com -->
    <area shape="rect" coords="100,100,300,300" href="http://www.baidu.com"/>

    <!-- shape="circle"表示圆形,400,400表示圆心坐标,50表示圆的半径,点击该圆形会跳转到http://www.baidu.com -->
    <area shape="circle" coords="400,400,100" href="http://www.baidu.com"/>

    <!-- shape="poly"表示多边形,11,12,23,24,35,36每两个数表示一个角的坐标,后边可以无限加,点击该图形会跳转到http://www.baidu.com -->
    <area shape="poly" coords="10,10,10,80,80,80" href="http://www.baidu.com"/>

</map>

<br/>找男朋友标准
<!-- 无序标签,type="square",正方形前缀 -->
<ul type="square">
    <li>高</li>
    <li>富</li>
    <li>帅</li>
</ul>

找女朋友标准
<!-- 有序标签,start="3"从c开始排序 -->
<ol type="a" start="3">
    <li>白</li>
    <li>富</li>
    <li>美</li>
</ol>

<!-- 自定义标签 -->
<dl>

    <dt>大娃</dt>
    <dd>红色</dd>
    <dd>力大无穷</dd>
    <dd>可以变大</dd>

    <dt>二娃</dt>
    <dd>橙色</dd>
    <dd>千里眼</dd>
    <dd>顺风耳</dd>
</dl>

<!-- sup为上标, -->
<br/>2<sup>2</sup>=4
<!-- sub为下标 -->
<br/>H<sub>2</sub>O(化学中的水)

<!-- href="#top"跳转到name="top"的标签,就是尾部 -->
<a name="tail" href="#top">到顶部</a>

<!-- &copy;就是版权标签 -->
<br/>版权:&copy;


</body>
</html>

在这里插入图片描述