随笔分类 -  css

【CSS3】box-reflect 倒影属性介绍与使用
摘要：CSS3的box-reflect属性，也就是倒影特效。 语法： box-reflect：包括3个值。 1. direction 定义方向，取值包括 above 、 below 、 left 、 right。 above： 指定倒影在对象的上边 below： 指定倒影在对象的下边 left： 指定倒影 阅读全文
posted @ 2020-11-16 17:48 dzyany 阅读(479) 评论(0) 推荐(0)
【CSS3】clip-path属性深入理解与使用
摘要：clip-path CSS 属性可以创建一个只有元素的部分区域可以显示的剪切区域。区域内的部分显示，区域外的隐藏。 clip-path的属性值可以是以下几种： 1.inset； 将元素剪裁为一个矩形， 定义：clip-path: inset(<距离元素上面的距离>,<距离元素右面的距离> ,<距离元 阅读全文
posted @ 2020-11-16 17:02 dzyany 阅读(9787) 评论(0) 推荐(0)
css3旋转相册
摘要：效果图 步骤 1.需要在文件跟目录下新建img文件夹，添加对应图片； 2.新建index.html,复制下面代码 <html> <head> <meta charset="utf-8"> <title>旋转相册</title> <style> body { width: 100%; margin: 阅读全文
posted @ 2020-10-15 17:21 dzyany 阅读(731) 评论(0) 推荐(0)
flex布局解决内容超过盒子 在flex中设置单行显示
摘要：案例来罗 代码如下： <style> .box{ width: 300px; height: 300px; border: 1px solid #ccc; display: flex; flex-direction: column; } .blockB{ border: 1px solid pink 阅读全文
posted @ 2020-07-30 16:52 dzyany 阅读(5337) 评论(0) 推荐(0)