CSS共43篇

Discuz根据不同版块区域设置图片主题列表显示不同尺寸

Discuz根据不同版块区域设置图片主题列表显示不同尺寸-雪哥尔
最近在弄discuz论坛,因为discuz在国内主流搜索引擎特友好,所以想改做discuz。下面就来分享一下我最近遇到的对于不同版块想要显示不同尺寸的主题列表封面的问题的解决方法: 第一步,我们先在...
5年前
433650

xulgrbtn按钮样式文档

xulgrbtn按钮样式文档-雪哥尔
查看xulgrbtn样式 样式对应代码 纯色按钮 <a class='xulgrbtn'>紫色</a> <a class='xulgrbtn xulgrbtn-lb'>蓝色</a> <a class='xulgrbtn xulgrbtn-hb'>红色</...
5年前
06080

简单的JS实现选项卡Tab非同级切换

简单的JS实现选项卡Tab非同级切换-雪哥尔
网上大部分选项卡代码是在同个父级下实现的,这样对前端比较难设计显示出来的样式,所以我就简单记录一下我设计的两个父级或者同级都能使用的选项卡代码。 思路 将所有选项按钮定义点击事件,然...
2年前
02867

CSS居屏幕正中

CSS居屏幕正中-雪哥尔
<style> body{ background-color:#000; } .xulgr-table{ width:100%; height:100%; border:0; text-align:center; cellpadding:0; cellspacing:0; }.xulgr-table td{ text-align:center; ...
5年前
09080

[进阶方法]JS+CSS滑动到某位置元素固定住不动或滚动到顶部然后固定的进阶方法

[进阶方法]JS+CSS滑动到某位置元素固定住不动或滚动到顶部然后固定的进阶方法-雪哥尔
进阶方法有个好处就是悬浮前和滚动悬浮后的样式都可以自定义,比如没有滚动到设置的元素时,样式的宽度是100px,然后当用户滚动屏幕到设置的元素时,设置的元素就可以又以另一种自定义样式悬浮...
3年前
02680

纯CSS文字动画特效|CSS3 For Animations

纯CSS文字动画特效|CSS3 For Animations-雪哥尔
今天刚帮客户写了个CSS动画效果样式,具体看样式的注释 <style> .animate { font-size: 35px; margin: 100px 0 0; border-bottom: 2px solid #ccc; } .animate span { display: inline-bl...
5年前
06350

CSS的Flex布局并排间距换行间距和每几个元素换行间隔

CSS的Flex布局并排间距换行间距和每几个元素换行间隔-雪哥尔
直接上例子,每4个元素换行并设置10px的间距 ul{ display: flex; flex-wrap: wrap; /*flex弹性换行*/ margin: -10px; /*父元素抵消掉子元素的间距*/ } ul li{ margin: 10px; /*子元素之间的间距...
2年前
048110

CSS悬浮固定效果

CSS悬浮固定效果-雪哥尔
<style> /*设置了高度,可以上下滚动*/ body { height: 1800px; background:#dddddd; } /*div通用样式*/ div{ background: #1a59b7; color:#ffffff; overflow: hidden; z-index: 9999; po...
5年前
09840

CSS3鼠标:hover经过元素呼出显示图片

CSS3鼠标:hover经过元素呼出显示图片-雪哥尔
  当鼠标停留在设置的元素时呼出图片,移开后隐藏。 CSS代码 .xulgr-hovershow .xulgr-hovershow-img { opacity:0; transform:translateY(6px); transition:.4s; } .xulgr-hovershow:hover...
3年前
020214

CSS响应式样式及断点

CSS响应式样式及断点-雪哥尔
第一步:设置viewport 至于为什么要设置这个,答案请移步移动前端开发之viewport的深入理解(人家解释的比我好,在这就不啰嗦了) <meta name='viewport' content='width=device-width, init...
5年前
010000