本站后续会推出各种前端实用的好工具,杜绝造轮子,每款工具都经过精心打磨,帮助所有程序员提高前端开发效率!
.one{ width: 0; height: 0; border-style: solid; border-top-width:20px; border-bottom-width:20px; border-left-width:100px; border-right-width:100px; border-color:transparent #dddddd #dddddd transparent; //上右下左 需要哪个边进行修改即可 }
.sss { margin-bottom: 0; /* 确保 div 紧贴底部 */ text-align: center; /* 水平居中内容 */ background-color: #f0f0f0; /* 可选:添加背景颜色以便更容易看到效果 */ padding: 10px; /* 可选:添加内边距 */ position: sticky; /* 如果需要它在滚动时仍然保持固定,可以使用 sticky */ bottom: 0; /* 与 sticky 一起使用时,确保它固定在底部 */ }
css渐变设置
在线动态配置自己想要的DIV CSS阴影效果
Whirl 是一个专注于Loading动画的css库。有上百种Loading效果,任君挑选。 再也不用为 loading 动画发愁了!
width: 300px;height: 400px;background: #42b983; color: rgba(255, 255, 255, 0.8); position: absolute; left: 150px; top: 20%; z-index: 10; font-family: sans-serif; text-align: center; width: 300px; height: 500px; border-bottom: 1px solid rgba(255, 255, 255, 0.4); border-left: 1px solid rgba(255, 255, 255, 0.4); background: linear-gradient( to top right, rgba(90, 149, 207, 0.5), rgba(58, 76, 99, 0.8) );