悬停不工作，我不知道为什么 [英] Hover not working and I don't know why
本文介绍了悬停不工作，我不知道为什么的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
你好，我是一个试图建立我自己的网站的初学者。我有麻烦试图定位一个图像，并赋予它一个悬停属性，这里的代码
<！DOCTYPE html>< html>< head> < title> Tu est fis de pute< / title> < link rel =stylesheettype =text / csshref =stylesheet.css> <风格> div {height：30px;宽度：30px;位置：绝对;顶部：45％;左：25％; -webkit-transition：宽度2s，高度2s;过渡：宽度2s，高度2s; } div：hover {width：40px; height：40px; }< / style>< / head>< body> < img src =logo.pngstyle =width：13％; position：absolute; top：11％; left：44.2％/> < div id =fbicon> < img src =图标/ facebook.png/> < / div>< / html>
p>我基本上试图在图标上方悬停时放大效果，同时将图标放在我想要的位置。任何帮助将不胜感激！感谢！
解决方案
您可以使用 scale ：
div {height：30px;宽度：30px;位置：绝对;背景：蓝绿色;顶部：45％;左：25％; -webkit-transition：所有1都很轻松; transition：all 1s ease;} div：hover {transform：scale（1.3）;}
< $ img src =logo.pngstyle =width：13％; position：absolute; top：11％; left：44.2％/>< div id =fbicon > < img src =http://lorempixel.com/output/abstract-qc-50-50-2.jpg/>< / div>
Hi I am a beginner trying to make my own website. I have had troubles trying to position an image and endow it with a hover property, here's the code
<!DOCTYPE html>
<html>
<head>
<title>Tu est fis de pute</title>
<link rel="stylesheet" type="text/css" href="stylesheet.css">
<style>
div {
height: 30px;
width: 30px;
position: absolute;
top: 45%;
left: 25%;
-webkit-transition: width 2s, height 2s;
transition: width 2s, height 2s;
}
div:hover {
width: 40px;
height: 40px;
}
</style>
</head>
<body>
<img src="logo.png" style="width:13%; position:absolute; top:11%; left:44.2%" />
<div id="fbicon">
<img src="icons/facebook.png" />
</div>
</body>
</html>
I am basically trying to bring a enlargement effect when hovered over the icon, whilst putting the icon where I want. Any help will be appreciated! Thanks!
解决方案
You can use scale to enlarge whole div on hover:
div {
height: 30px;
width: 30px;
position: absolute;
background: teal;
top: 45%;
left: 25%;
-webkit-transition: all 1s ease;
transition: all 1s ease;
}
div:hover {
transform: scale(1.3);
}
<img src="logo.png" style="width:13%; position:absolute; top:11%; left:44.2%" />
<div id="fbicon">
<img src="http://lorempixel.com/output/abstract-q-c-50-50-2.jpg" />
</div>
这篇关于悬停不工作，我不知道为什么的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
