随笔分类 - CSS
摘要：input:-webkit-autofill , textarea:-webkit-autofill, select:-webkit-autofill {-webkit-text-fill-color: #333 !important;background-color:transparent; tr
阅读全文
摘要：做得有点简陋 <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta htt
阅读全文
摘要：<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Animated Login Form UI Design</title> <style type="text/css"> *{ margin: 0; padding: 0; bo
阅读全文
摘要：<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv
阅读全文
摘要：1.层叠性 相同选择器给设置相同的样式，此时一个样式就会覆盖（层叠）另外一个冲突的样式。层叠性主要解决样式冲突的问题 层叠性原则： 样式冲突，遵循的原则是就近原则，哪个样式离结构近，就执行哪个样式 样式不冲突，不会层叠 2. 继承性 现实中的继承：我们继承了父亲的姓 CSS中的继承：子标签会继承父标
阅读全文
摘要：vertical-align CSS的vertical-align属性使用场景：经常用于设置图片或者表单（行内块元素）和文字垂直居中对齐。 官方解释：用于设置一个元素的垂直的垂直对齐方式，但是它只针对于行内元素或者行内块元素有效。
阅读全文
摘要：1.单行文本溢出省略号--必须满足三个条件 2.多行文本溢出省略号-- 多行文本溢出显示省略号，有较大兼容性问题，适合webkit浏览器或移动端（移动端大部分是webkit内核） 可以让后台人员做，设置文字的个数，操作更简单。
阅读全文
摘要：Github上的案例： 效果图如下： 代码如下： index.html <!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <title>CodePen - Swipeable Tabs</title> <link rel=
阅读全文
摘要：1. 什么是 SASS/SCSS? SASS 代表着 “Syntactically Awesome Stylesheets”（语法完善打样式表） Sass不在浏览器运行，相反，它将在开发的过程中扩展CSS，可以编写可重复使用的干净代码，易于维护和调整。 2. SASS Features Nested
阅读全文
摘要：border-image-source 用在边框的图片路径 border-image-slice 图片的边框向内偏移（裁剪的尺寸，一定不加单位，上右下左顺序） border-image-width 图片边框的宽度(需要加单位)(不是边框的宽度，是边框图片的宽度) border-image-repea
阅读全文
摘要：<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <style type="text/css"> *{ margin: 0; padding: 0; font-family: 'Popins',s
阅读全文
摘要：<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>How to Create AnimeJS Text Animation Effects | Anime.js</title> <style type="text/css"> @i
阅读全文
