让header内的nav标签靠左居中
答案:1 悬赏:60 手机版
解决时间 2021-01-22 22:46
- 提问者网友：niaiwoma
- 2021-01-22 18:32
让header内的nav标签靠左居中
最佳答案
- 五星知识达人网友：第幾種人
- 2021-01-22 19:51
header{background:#00c;height:150px;line-height:150px;}追问字跑出来了，nav标签还在那，我的意思是nav怎么贴左居中并且让字也居中，我用margin-top:xxpx来调试header nav{margin-top：xxpx}，我发现header居然也动了，然后顶部露出白色，怎么回事？追答margin-top确实也可以做到，关键是如果你要严格垂直剧中的话，那么需要计算好margin-top：xxpx中XX 的数值；对于你说的问题，为了消除那个空白，在header的样式中假如overflow:hidden;即可。
另外，对于这种垂直居中的问题，较好的方法是用height和line-height的组合，两个的数值设置一样的，也就是说高度和一行的高度一样，那么元素就垂直居中显示了；另外应为文字放在P标签中国，为了避免他的影响，最终可以使用
*{margin:0;padding:0;}
nav{height:60px;line-height:60px;}追问基于原页面我改了下，margin-top问题解决了；可加入line-height后，标签还是没反应，然后加入*{height:1150px;margin:0;padding:0}，文字上部分的三分之一看不见了
header nav{background:#ccc;height:40%;width:45%;border:2px solid red;line-height:40%}追答header 的height和line-height改用绝对值如XXpx呢？追问没反应；奇怪的是在header nav{background:#ccc;height:40%;width:45%;border:2px solid red;margin-top:40px}中，我把margin-top：40px换成40%居然nav消失了，我用计算器算过了，居中大约也就是44%左右追答你把现在所有的代码贴出来看看，如果超出字数限制，发个文件，然后说明一下样式要求追问怎么发文件，代码就是图片那些，你可以试下追答把header nav的高度设为绝对值，然后line-height等于nav的height即可
另外，对于这种垂直居中的问题，较好的方法是用height和line-height的组合，两个的数值设置一样的，也就是说高度和一行的高度一样，那么元素就垂直居中显示了；另外应为文字放在P标签中国，为了避免他的影响，最终可以使用
*{margin:0;padding:0;}
nav{height:60px;line-height:60px;}追问基于原页面我改了下，margin-top问题解决了；可加入line-height后，标签还是没反应，然后加入*{height:1150px;margin:0;padding:0}，文字上部分的三分之一看不见了
header nav{background:#ccc;height:40%;width:45%;border:2px solid red;line-height:40%}追答header 的height和line-height改用绝对值如XXpx呢？追问没反应；奇怪的是在header nav{background:#ccc;height:40%;width:45%;border:2px solid red;margin-top:40px}中，我把margin-top：40px换成40%居然nav消失了，我用计算器算过了，居中大约也就是44%左右追答你把现在所有的代码贴出来看看，如果超出字数限制，发个文件，然后说明一下样式要求追问怎么发文件，代码就是图片那些，你可以试下追答把header nav的高度设为绝对值，然后line-height等于nav的height即可