响应式徽标定位与徽标与菜单

Question

我正在学习响应式设计。现在我正在创建一个响应式网站..它有名称标识，左右两条水平线。标志应位于顶部中心。在徽标下我必须放置菜单。在响应式设计视图中，它应该保持中心位置

Answer 1

你的问题是在这里回答大问题，但媒体查询是你想要的。观看这个简短的You Tube视频，你将很快得到基础知识

https://www.youtube.com/watch?v=fA1NW-T1QXc

头部<meta name="viewport" content="width=device-width, initial-scale=1">

中的Html

正文中的Html <div id="container"><div id="header">Logo</div></div>

CSS #container{width: 1000px; height: 500px;} #header{width: 1000px; height: 100px; text-align: center;} @media only screen and (max-width: 999px){#container{width:100%;}#header{width: 100%;background-color: blue;}}

这只是一个例子，在999px处，只要屏幕宽度低于999px，标题就会变为蓝色并且会调整到屏幕大小。