css鼠标放上图片变大

简介: css鼠标放上图片变大
<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>鼠标放上图片变大</title>
        <style type="text/css">
            div{
                width: 414px;
                height: 240px;
                border: #000 solid 1px;
                margin: 50px auto;
                overflow: hidden;
            }
            div img{
        width: 414px;
        height: 240px;
                cursor: pointer;
                transition: all 0.6s;
            }
            div img:hover{
                transform: scale(1.4);
            }
        </style>
    </head>
    <body>
        <div>
            <img src="http://tp.jxmlove.top/stf.png" />
        </div>
    </body>
</html>

相关文章
|
19天前
|
前端开发 计算机视觉 开发者
利用CSS改变图片颜色的100种方法!
利用CSS改变图片颜色的100种方法!
51 1
|
19天前
|
前端开发 UED 开发者
【专栏:HTML与CSS实战项目篇】制作一个响应式图片画廊
【4月更文挑战第30天】本文介绍了如何使用HTML和CSS创建响应式图片画廊。响应式画廊能根据用户设备屏幕大小自动调整布局。首先规划结构,包含一个图片容器和每张图片元素,并为图片提供替代文本。接着设计样式,设置图片大小、间距和视觉效果。然后通过媒体查询实现响应式设计,根据不同屏幕尺寸调整图片排列。同时考虑性能优化,如压缩图片和使用懒加载技术。最后,测试和调试确保画廊在各种设备上正常工作。这个过程强调了响应式设计和用户体验的重要性。
|
19天前
|
移动开发 前端开发 搜索推荐
HTML图片标签(2) HTML5+CSS3+移动web 前端开发入门笔记(三)
HTML图片标签(2) HTML5+CSS3+移动web 前端开发入门笔记(三)
27 0
|
19天前
|
前端开发
|
19天前
|
前端开发 JavaScript
CSS+JS鼠标事件触发鼠标模形实现手状
CSS+JS鼠标事件触发鼠标模形实现手状
|
19天前
css3鼠标悬停图片特效源码
css3鼠标悬停图片特效,图片悬停效果源码,可以在网页上面作为自己的动态加载名片,放到侧边栏或者网站合适的位置即可
15 0
css3鼠标悬停图片特效源码
|
19天前
|
Web App开发 前端开发 iOS开发
编程笔记 html5&css&js 008 HTML图片
编程笔记 html5&css&js 008 HTML图片
|
19天前
CSS3图片反射box-reflect属性
CSS3图片反射box-reflect属性
27 0
|
19天前
|
前端开发
html+css实现图片缓慢变大效果
html+css实现图片缓慢变大效果
70 0
|
19天前
|
前端开发
css实现鼠标多样化
css实现鼠标多样化
29 0