web前端导航栏

最新推荐文章于 2024-08-14 15:45:18 发布

未来的旋律～

最新推荐文章于 2024-08-14 15:45:18 发布

阅读量189

点赞数 1

文章标签： javascript 前端 html

本文链接：https://blog.csdn.net/xz15881991074/article/details/140362344

版权

作业1

代码：


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        div{
            width: 800px;
            height: 25px;
            border: 1px;
            background-color: grey;
           box-shadow: 10px 10px 10px  grey ;
           text-align: center;
           border-radius: 80px;
        }
        li{
            list-style: none;
            display: inline-block;
            border: 1px;
            color: white;
           box-shadow: 2px 2px 2px  white;
           border-radius: 80px;
        }
    </style>
</head>
<body>
        <div>
            <li>项目</li>
            <li>项目</li>
            <li>项目</li>
            <li>项目</li>
            <li>项目</li>
            <li>项目</li>
            <li>项目</li>
            <li>项目</li>
            <li>项目</li>
            <li>项目</li>
            <li>项目</li>
        </div>
</body>
</html>

作业2

CSS 盒子模型由四个部分组成：内容区域、内边距、边框和外边距。
1. 内容区域：内容区域是盒子模型的最里面部分，它包含了 HTML 元素的实际内容，比如文本、图片等。

2. 内边距：内边距是内容区域和边框之间的空间，用于设置元素内部与内容之间的空白区域大小。内边距可以通过设置 top、right、bottom 和 left 属性来实现。

3. 边框：边框是盒子模型的最外部边界，用于定义元素的可见边框。边框可以通过设置 border 属性来实现，包括颜色、样式和宽度等。

4. 外边距：外边距是相邻元素之间的空白区域，用于控制元素与其他元素之间的距离。外边距可以通过设置 top、right、bottom 和 left 属性来实现。
如下是主要代码的总结

<!DOCTYPE html>
<html>
<head>
	<style>
		.box {
			width: 200px; /* 设置盒子的宽度 */
			height: 100px; /* 设置盒子的高度 */
			padding: 20px; /* 设置内边距 */
			border: 1px solid #ccc; /* 设置边框 */
			margin: 20px; /* 设置外边距 */
		}
	</style>
</head>
<body>
	<div class="box">这是一个盒子</div>
</body>
</html>

未来的旋律～

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
web前端导航栏

2. 内边距：内边距是内容区域和边框之间的空间，用于设置元素内部与内容之间的空白区域大小。4. 外边距：外边距是相邻元素之间的空白区域，用于控制元素与其他元素之间的距离。外边距可以通过设置 top、right、bottom 和 left 属性来实现。3. 边框：边框是盒子模型的最外部边界，用于定义元素的可见边框。1. 内容区域：内容区域是盒子模型的最里面部分，它包含了 HTML 元素的实际内容，比如文本、图片等。CSS 盒子模型由四个部分组成：内容区域、内边距、边框和外边距。如下是主要代码的总结。
复制链接

扫一扫