圆角边框和悬停变色

收藏

1：保存代码

CSS代码如下：
.demo{ padding:1px; width:1px; height:1px;
border: 1px solid #606060;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius:5px; }

.demo:hover{padding:1px; width:1px; height:1px;
border: 1px solid #D94600 ;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius:5px; }
将文件保存至 ‘’自定义javaScript/CSS‘’ 上传CSS文件

2：调用命名

将命名的 demo 与字段的CSS类名绑定

3：试验效果
鼠标未在边框时效果如下：

鼠标悬停边框时效果如下：

总结：
.demo {静态边框效果}-- 可根据需求修改代码
.demo:hover {内容为鼠标悬停效果}-- 可根据需求修改代码

Eric.Liang · Eric.Liang

感谢分享

回复 · 504146555

好东东，颜值就靠他了！

Eric.Liang · Eric.Liang

504146555 发表于 2018-5-22 18:36
好东东，颜值就靠他了！

感谢支持

回复 · 504146555

建议官方推出专题关于常用的CSS效果demo，供前期零入门者使用。毕竟目前的开发者的水平参差不齐，这样大家都能快速、高效地开发出高颜值的作品，推动活字格发展。

回复 · 504146555

目前需要的时候要麻烦技术，其实本来这些都有的，只是比较零碎，稍微整理一下就好。

Eric.Liang · Eric.Liang

504146555 发表于 2018-5-25 07:30
目前需要的时候要麻烦技术，其实本来这些都有的，只是比较零碎，稍微整理一下就好。

感谢反馈

Eric.Liang · Eric.Liang

504146555 发表于 2018-5-25 07:30
目前需要的时候要麻烦技术，其实本来这些都有的，只是比较零碎，稍微整理一下就好。

你可以参考下这里：http://gcdn.grapecity.com.cn/for ... hread&tid=45810

放下 · 放下

Tracy.Liu · Tracy.Liu

放下发表于 2018-11-6 13:53

您好，您是遇到什么问题需要帮忙解决么？您可以另开一个帖子，这边帮您看一下呢~

		自动登录	找回密码
密码			立即注册

[已处理] 圆角边框和悬停变色

9 个回复

讲师达人

悬赏达人

元老葡萄

活字格认证

活字格高级认证

微信认证勋章