CSS - 分享生活和学习中的点点滴滴

前端技术 2023/09/01 CSS

最近使用position属性进行界面布局，在以后的开发中将要经常使用，便于以后使用方便特别把样式写在这里：复制代码代码如下: <!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Transitional//EN\"...

前端技术 2023/09/01 CSS

show()/hide()的实现 show()/hide()的实现主要控制元素的display属性。html: XML/HTML Code复制内容到剪贴板 <div id=\"box\"> <input type=\"checkbox\" i...

前端技术 2023/09/01 CSS

:first-child伪类用于匹配一个序列的第一个元素。我们经常用它来实现一个序列的第一个元素或最后一个元素的上（下）边框，如：复制代码代码如下: ul:nth-last-of-type(3) { border: 1px solid black; } 但是我...

前端技术 2023/09/01 CSS

CSS Reset是指重设浏览器的样式。在各种浏览器中，都会对CSS的选择器默认一些数值，譬如当h1没有被设置数值时，显示一定大小。但并不是所有的浏览器都使用一样的数值，所以有了CSS Reset，以让网页的样式在各浏览器中表现一致。下面介绍几个主流的CSS Reset代码：...

前端技术 2023/09/01 CSS

语音气泡是一种很流行的效果，在很多社交网站上可以看到评论使用这样的效果来实现，对于游客来说非常有吸引力，但我发现很多这样的效果都是依赖于HTML或JavaScript来实现的非常麻烦。本教程包含各种形式的使用CSS 2.1与CSS3创建的渐进增强气泡效果。纯CS...

display:inline-block的使用示例

前端技术 2023/09/01 CSS

在实习中做专题时，遇到的一个问题：建立一个宽度很长的一个页面，里面包含许多列。或许许多人认为直接设置float：left；不就行了但是这个有一个问题，你必须把外面的div的宽度设置的很长已满足大于所有子div的宽度，而实际中由于子页面中个数不定，因此外面的di...

前端技术 2023/09/01 CSS

初始：点击“更多以后”： ie6、ie7下出现问题，\"芒果推荐\"所在的div 没有被撑下来，有底部虚线可知，上一个div确实已经撑开了，但是它的下一个同辈结点怎么没有撑下来，当时，当我鼠标移到“满意度”、“销量”、“价格”这些a标签上时，它就恢复正常了。解决这个点击“...

前端技术 2023/09/01 CSS

这是一款效果超酷的纯CSS3鼠标滑过图片动画效果，它共分为8组不同的效果，它们分别在鼠标滑过图片时，以不同的方式显示遮罩层和图片标题。每一组效果又分为3种不同的鼠标滑过图片效果。这些鼠标滑过图片时的动画效果都是使用CSS3来完成的，分别有：滑动效果，倾斜效果，翻转效果，旋转效...

前端技术 2023/09/01 CSS

演示 | 下载今天我们来探索一下Carl Philipe Brenner的网站上一个微妙而有趣的动画效果。当鼠标经过网格元素时，会有一个微妙的动画发生——网格元素变得透明，每条边有个顺时针的动画，创造了非常好的效果。这种效果是通过JS给span标签的宽或者高做了动画。...

前端技术 2023/09/01 CSS

在ie下模拟css3中的box-shadow（阴影）可以使用ie的Shadow（阴影）滤镜基本语法：filter: progid:DXImageTransform.Microsoft.Shadow(color=’颜色值’, Direction=阴影角度（数值）...

关闭

我的博客