Css
明知山_
这个作者很懒,什么都没留下…
展开
-
Css实现点击图片旋转动画
效果图 <div class="switch"> <img src="http://sucai.suoluomei.cn/sucai_zs/images/20190919162145-%E5%8F%8C%E4%B8%8A%E7%AE%AD%E5%A4%B4-01.png" alt="箭头""> </div>...原创 2019-09-19 16:59:09 · 5590 阅读 · 0 评论 -
Css添加div点击态
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document&l...原创 2020-05-05 17:54:54 · 1735 阅读 · 0 评论 -
Css实现聊天框
<!DOCTYPE html><html><head> <meta charset=utf-8 /> <title>css聊天框</title> <style> * { margin: 0; padding: 0; ...原创 2020-02-17 10:46:32 · 3003 阅读 · 0 评论 -
Css文字环绕圆形图片
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X...原创 2020-01-13 11:58:58 · 2543 阅读 · 0 评论 -
Css制作hover下划线动画
.demo { position: relative; font-size: 20px; display: inline-block; cursor: pointer; } .demo:before { content: ""; position: absolute; ...原创 2019-10-08 13:52:50 · 1308 阅读 · 0 评论 -
Css移动端隐藏横向滚动条但可以滚动
::-webkit-scrollbar {display:none}原创 2019-09-11 09:14:17 · 9819 阅读 · 6 评论 -
Css实现一行或多行溢出显示省略号
一行溢出显示省略号 overflow: hidden; white-space: nowrap; text-overflow: ellipsis;多行溢出显示省略号 text-overflow: -o-ellipsis-lastline; overflow: hidden; text-overflow: ellipsis; display: -webkit-box;...原创 2019-09-11 09:05:56 · 299 阅读 · 0 评论 -
Css实现瀑布流布局
效果图 <div class="waterfall"> <div class="poster"> <div class="pic"> <img src="http://sucai.suoluomei.cn/sucai_zs/images/20190920...原创 2019-09-21 10:12:48 · 334 阅读 · 0 评论 -
Css修改选中的文本高亮
::selection { color: #fff; background: #088; }原创 2019-09-21 16:09:49 · 1038 阅读 · 0 评论 -
Css修改滚动条样式
/* 滚动条整体部分 */ ::-webkit-scrollbar { width: 20px; height: 20px; } /*滚动条轨道、滚动条*/ ::-webkit-scrollbar-track, ::-webkit-scrollbar-thumb { border-radius: 50...原创 2019-09-21 16:11:45 · 381 阅读 · 0 评论 -
Css实现内容溢出添加横向滚动条
先放一张效果图在这里每一个div标签包裹着一张图片和一行文字 <div class="banner"> <div class="one"> <img src="http://sucai.suoluomei.cn/sucai_zs/images/20190729/e082397f7c597ee10599b6...原创 2019-08-16 09:19:14 · 13698 阅读 · 0 评论 -
Css实现上下无限跳动动画
来一张效果图图中的三角形会一直上下跳动 .arrow { position: absolute; bottom: 15%; left: 50%; transform: translate(-50%, -50%); text-align: center; ...原创 2019-08-23 16:23:00 · 5391 阅读 · 0 评论