Html/CSS 第16页
分类
子分类
排序
css3 column实现卡片瀑布流布局的示例代码
本文介绍了css3 column实现卡片瀑布流布局的示例代码，分享给大家，具体如下： 实现效果 今天遇到了需要实现一个卡片的瀑布流布局的问题，卡片高度是不同的。 最后使用css3中的column属性实现了...
30天前
CSS多级菜单的实现代码
这是一个相当炫的功能，让网页看起来像桌面程序，如window的开始菜单。实现原理基本和纯CSS相册差不多，但要注意的事项比较多，让我们一步步来吧。 先来一个非常简单的一级菜单与悬停效果。 <...
30天前css两端对齐之div+css布局实现2端对齐的4种方法总结
div+css布局实现2端对齐是我们网页排版中经常会使用到的，这篇文章将总结一下可以实现的方法： html结构 实现demo里面的div通过Css进行2端对齐。 <div class="box"> <div cl...
30天前什么是BFC？ CSS 使用伪元素清除浮动的方法
BFC概念： 块级格式化上下文，是一个独立的渲染区域，让处于 BFC 内部的元素与外部的元素相互隔离，使内外元素的定位不会相互影响。 我们先了解一个名词：BFC（block formatting context），中...
30天前
CSS实现鼠标移入时图片的放大效果及缓慢过渡效果的示例代码
transform:scale()可以实现按比例放大或者缩小功能。transition可以设置动画执行的时间，实现缓慢或者快速的执行动画，效果图如下： 源码： <!DOCTYPE html> <html> <head> &...
30天前
CSS中元素的显示模式
在CSS中，根据元素显示模式的不同元素标签被分为了两类:行内元素（inline-level）、块级元素（block-level）。 1，首先介绍什么是行内元素，什么又是块级元素？ 1.1，行内元素就是不会独占一行...
30天前
CSS3属性 line-clamp控制文本行数的使用
说明：限制在一个块元素显示的文本的行数。 -webkit-line-clamp 是一个 不规范的属性（unsupported WebKit property），它没有出现在 CSS 规范草案中。 为了实现该效果，它需要组合其他外来的We...
30天前通过CSS变量修改样式的方法示例
问题 js怎么去修改css伪类样式呢？但是js并没有伪类选择器，那么该怎么办呢？网上有不少方法，比如通过切换元素的类、在style中动态插入新的样式等。 那么这里再来一种方法，设置css变量（var）...
30天前
CSS3 毛玻璃效果
毛玻璃效果做的好能使页面显得非常生动立体。直接上图 body { min-height: 100vh; box-sizing: border-box; margin: 0; padding-top: calc(50vh - 6em); font: 150%/1.6 serif; background: url...
29天前css3媒体查询中device-width和width的区别详解
1.device-width 定义：定义输出设备的屏幕可见宽度。 不管你的网页是在safari打开还是嵌在某个webview中，device-width都只跟你的设备有关，如果是同一个设备，那么他的值就不会变。 比如iphone...
29天前