CSS制作导航鼠标经过后面文字会跟着动怎么解决

html-css024

CSS制作导航鼠标经过后面文字会跟着动怎么解决,第1张

我看你的代码实在晕,错误百出,

float:left写成了float-left

color:red写成了clolr:red

href=#"少写了半个引号

结束</li>标签没有写

</body>写成了</boyd>

然后说一下为什么你后面的字为什么会动,因为你的a标签和a标签经过的宽高不一样,当然会动了。比如,你想想,本来a宽50px,你鼠标指上去是宽100px了,它后面当然会往右移啦。所以,你只要保持a和a:hover宽高一致就不会动来动去了。

例如去掉a:hover里的width:50pxheight:50px

根据字面意思,给出这种解决方案,看看是否合

<!DOCTYPE html>

<html>

<head>

<meta http-equiv="Content-Type" content="text/htmlcharset=utf-8" />

<title>无标题文档</title>

<style>

.box {

width: 400px

display: flex

align-items: center

}

</style>

</head>

<body>

<div class="box">

<p>我是左边文字</p>

<p><img src="images/20150813115845612.jpg" style="width:150px" /></p>

<p>我是右边文字</p>

</div>

</body>

</html>