网站基本框架

最新推荐文章于 2024-08-12 22:06:26 发布

前端新手-

最新推荐文章于 2024-08-12 22:06:26 发布

阅读量38

点赞数

文章标签： css css3 前端

版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文链接：https://blog.csdn.net/fengyinanp/article/details/133049727

版权

	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="utf-8">
	<title></title>
	<style type="text/css">
	* {
	margin: 0;
	padding: 0;
	}
	.divbody {
	width: 1200px;
	height: 100%;
	/* background-color: aquamarine; */
	margin: 0 auto;
	border: 2px solid red;
	}
	.div1{
	width: 1200px;
	height: 90px;
	/* background-color: aqua; */
	border: 2px solid red;
	}
	.div2{
	width: 1200px;
	height: 50px;
	/* background-color: blueviolet; */
	border: 2px solid yellow;
	}
	.div3{
	width: 1200px;
	height: 350px;
	/* background-color: coral; */
	border: 2px solid red;
	}
	.div4{
	width: 1200px;
	height: 440px;
	/* background-color: darkgreen; */
	border: 2px solid red;
	}
	.div5{
	width: 1200px;
	height: 300px;
	/* background-color: red; */
	border: 2px solid blue;
	}
	.divT {
	width: 350px;
	height: 230px;
	/* background-color: #FF0000; */
	border: 2px solid yellowgreen;
	float: left;
	margin-left: 140px;
	}
	.divm {
	width: 300px;
	height: 230px;
	/* background-color: fuchsia; */
	border: 2px solid red;
	float: left;
	}
	.divs {
	width: 240px;
	height: 230px;
	/* background-color: aqua; */
	border: 2px solid blueviolet;
	float: left;
	}

	.divh {
	width: 900px;
	height: 210px;
	/* background-color: goldenrod; */
	border: 2px solid red;
	float: left;
	margin-left: 140px;
	}
	</style>
	</head>
	<body>
	<div class="divbody">
	<div class="div1"></div>
	<div class="div2"></div>
	<div class="div3"></div>
	<div class="div4">
	<div class="divT"></div>
	<div class="divm"></div>
	<div class="divs"></div>
	<div class="divh"></div>
	</div>
	<div class="div5"></div>
	</div>
	</body>
	</html>

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
网站基本框架

学习前端认识完基本标签后重要的就是搭建网页的基本框架
复制链接

扫一扫

前端新手- CSDN认证博客专家 CSDN认证企业博客

码龄2年

3: 原创

192万+: 周排名

131万+: 总排名

229: 访问

: 等级

33: 积分

0: 粉丝

3: 获赞

2: 评论

3: 收藏

私信

关注

热门文章

最新评论

CSS实现轮播图效果（小米）
CSDN-Ada助手: 恭喜您写了第三篇博客！标题为“CSS实现轮播图效果（小米）”的博文听起来非常有趣。我很高兴看到您持续创作，并分享了一个关于实现轮播图效果的教程。您在这方面的专业知识令人印象深刻。对于下一步的创作建议，我谦虚地建议您可以考虑进一步拓展这个主题，比如分享更多关于CSS实现其他动态效果的技巧或者介绍不同品牌的轮播图实现方法。这样的话，读者们将会更加受益，并且能够更好地了解不同的设计风格和技巧。期待您未来更多精彩的创作！ CSDN 正在通过评论红包奖励优秀博客，请看红包流：https://bbs.csdn.net/?type=4&header=0&utm_source=csdn_ai_ada_blog_reply3
小米官网内容部分
CSDN-Ada助手: 非常棒的博客！看到你已经完成了小米官网内容部分的框架构建，这是一个很好的开始。你的描述让人期待后续的优化工作。我鼓励你继续努力创作，分享你的优化经验和技巧。除了优化导航栏和轮播图，你可能还考虑到以下扩展知识和技能来进一步提升小米官网的用户体验： 1. 响应式设计：确保网站在不同设备上都能正常显示，包括手机、平板和电脑等。 2. 图片优化：通过压缩图片大小和使用适当的格式，提高页面加载速度。 3. 用户界面设计：考虑色彩搭配、字体选择和版面设计等方面，使网站更具吸引力和易用性。 4. SEO优化：了解搜索引擎优化的基本原则，使用合适的关键词、页面标题和元描述，提升网站在搜索引擎中的排名。这些扩展知识和技能可能需要你花费更多的时间和精力，但它们能够帮助你打造出更加完善和专业的小米官网。期待看到你在这些方面的探索和分享！加油！如何写出更高质量的博客，请看该博主的分享：https://blog.csdn.net/lmy_520/article/details/128686434?utm_source=csdn_ai_ada_blog_reply2
网站基本框架
CSDN-Ada助手: 恭喜你这篇博客进入【CSDN每天最佳新人】榜单，全部的排名请看 https://bbs.csdn.net/topics/617281847。

最新文章

目录

评论

被折叠的条评论为什么被折叠?

到【灌水乐园】发言

查看更多评论

添加红包

成就一亿技术人!

hope_wisdom

发出的红包

实付元

使用余额支付

点击重新获取

扫码支付

钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。