0201 初识html

最新推荐文章于 2024-03-08 14:14:11 发布

DumFuxx

最新推荐文章于 2024-03-08 14:14:11 发布

阅读量71

点赞数

分类专栏：笔记文章标签： python

本文链接：https://blog.csdn.net/weixin_54056549/article/details/113638774

版权

笔记专栏收录该内容

30 篇文章 0 订阅

订阅专栏

代码1>代码2>代码3*指定数，可以快速生成指定数量的框架
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>网页1</title>
</head>
<body>
<div>段落测试</div>
<p>段落1<p>
<p>段落2<p>
<p>段落3<p>
<p>段落4<p>
<div><p>1</p><p>2</p><p>3</p></div>
<div><span>123</span><span>456</span><br/><span>你好</span></div>
<img src="lyh.jpg" alt="">
<input type="text" placeholder="请输入账号"/>
<input type="button" />
<input type="radio" name="r1"/>
<input type="radio" name="r1"/>
<input type="checkbox" />
<input type="checkbox" />
<input type="password" placeholder="请输入密码"/>
</body>
</html>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>链接练习</title>
    <style>
        #box div{
            width:100px;
            height:100px;
            background-color: deepskyblue;
            margin-top: 20px;
        }
    </style>
</head>
<body>
<div><a href="#i6">转到6</a>***<a href="#i3">转到3</a>***<a href="https://item.jd.com/39689153276.html#none">jd.com</a></div>
<div id="box">
    <div id="i1">1</div>
    <div id="i2">2</div>
    <div id="i3">3</div>
    <div id="i4">4</div>
    <div id="i5">5</div>
    <div id="i6">6</div>
</div>
</div>
</body>
</html>

布局设置-盒子模型

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>盒子模型</title>
    <style>
        #box{
            width: 500px;
            height: 500px;
            background-color: darkorange;
            top: 50%;
            left: 50%;
            position: absolute;
            margin-top: -250px;
            margin-left: -250px;

            line-height: 500px;
            font-size: 80px;
            color: white;
            text-align: center;
        }
        .d1{
            width: 500px;
            height: 100px;
            position: absolute;
        }
    </style>
</head>
<body>
<div id="box" >中心box
<div class="d1" style="background-color: blue;height: 190px;z-index: 400">1</div>
<div class="d1" style="background-color: green;height: 190px;z-index: 300">z-index更大</div>

</body>
</html>

DumFuxx

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
0201 初识html

代码1>代码2>代码3*指定数，可以快速生成指定数量的框架<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>网页1</title></head><body><div>段落测试</div><p>段落1<p><p>段落2<p
复制链接

扫一扫