随笔分类 -  CSS

上一页 1 2
iphone x 网页兼容
摘要：默认的显示内容在安全区域，不会在圆角和设备的传感器内显示。 第一个新功能是扩展到现有的视区 meta 标记, 称为视区匹配, 它提供对镶行为的控制。视区适合在 iOS 11 中提供。设置viewport-fit可以全屏显示。 设置完viewport-fit=cover后，会发现title位置上移，这 阅读全文
posted @ 2017-11-17 14:24 艾路 阅读(247) 评论(0) 推荐(0)
CSS文本处理
摘要：italic与oblique的区别。基本来说，斜体（italic)是一种单独的字体风格，对每个字母的结构有一些小改动，来反映变化的外观。与此不同，倾斜（oblique)文本则是正常竖直文本的一个倾斜版本。 除了大小和风格，字体还可以有变形。font-variant,它只有两个非继承值：默认值norm 阅读全文
posted @ 2017-09-22 11:48 艾路 阅读(210) 评论(0) 推荐(0)
CSS规则重要性以及继承、层叠
摘要：多个规则中只有一个胜出，那么怎么知道哪一个规则更强呢？答案在于每个选择器的特殊性。对于每个规则，用户代理会计算选择器的特殊性，并将这个特殊性附加到规则中的各个声明。如果一个元素有两个或者多个冲突的属性声明，那么有最高特殊性的声明就会胜出。（这并不是解决冲突的全部。实际上，所有样式冲突的解决都由层叠来 阅读全文
posted @ 2017-09-04 16:06 艾路 阅读(184) 评论(0) 推荐(0)
伪元素选择器
摘要：就像伪类为锚指定幻想类一样，伪元素能够在文档中插入假想的元素，从而得到某种效果。设置首字母样式、设置第一行样式、设置之前和之后的元素的样式。 第一个伪元素用于设置一个块级元素首字母的样式，而且仅对该首字母设置样式：p:first-letter{color:red;} 如果让每个H2中第一个字母的大小 阅读全文
posted @ 2017-09-04 12:09 艾路 阅读(471) 评论(0) 推荐(0)
伪类选择器
摘要：css属性选择器 如果想选择class属性中包含warning的元素，可以用一个属性选择器做到这一点：p[class~=“warning”]{font-weight:bold;}如果忽略了这个波浪号，则需要完全值匹配。 HTML要有这种属性主要用来其他属性，而不只是class。img[title~= 阅读全文
posted @ 2017-08-30 19:15 艾路 阅读(235) 评论(0) 推荐(0)
CSS 布局
摘要：不给元素指定一个具体的width,它就会自动适应其内容的宽度。而且水平居中。 figure{ width:min-content; margin:auto; } 如何精确的控制表格列宽 可以使用table-layout来让表格的行为更加可控。table-layout的默认值是auto,其行为模式被称 阅读全文
posted @ 2017-07-07 16:35 艾路 阅读(139) 评论(0) 推荐(0)
CSS 多边形
摘要：平行四边形 我们可以通过skew()的变形属性来对这个矩形进行斜向拉伸。trasnsform:skewX(-45deg);这样会导致内容也发生斜向变形。 嵌套元素方案：我们可以对内容在应用一次反向的skew()变形，从而抵消容器的变形效果。如果想把这个效果应用到一个默认显示为行内的元素，需要把它的d 阅读全文
posted @ 2017-06-22 16:25 艾路 阅读(941) 评论(0) 推荐(0)
CSS随机排列 boder-radius
摘要：当你注意到一个有辨识度的特征在以固定的规律循环重复时，那它试图营造的自然随机性就会立刻崩塌。 CSS中使用质数，从而增加了随机的真实感。这个被alex walker定名为“蝉原则”。他最先提出了通过质数来着鞥家随机真实性的想法。这个方法不仅适用于背景，还可以用于其他涉及有规律重复的情况。 borde 阅读全文
posted @ 2017-06-22 11:24 艾路 阅读(986) 评论(0) 推荐(0)
CSS3边框
摘要：currentColor 等于color, background-size:cover这个属性可以做到不管容器的尺寸如何变化，背景图片都完整地铺满一个容器。 我们可以通过 background-clip 属性来调整上述默认行为所带来的不便。这个属性的初始值是 border-box，意味着背景会被元素 阅读全文
posted @ 2017-06-21 15:14 艾路 阅读(273) 评论(0) 推荐(0)

上一页 1 2