css属性记录

控制placeholder的样式

::-webkit-input-placeholder{}

/* 默认placeholder颜色透明不可见,跟上面的区别没做测试,一直用的上面那个 */

.input-control:placeholder-shown::placeholder {

color: transparent;

}

:focus-within伪类选择器,当前元素或者当前元素的子元素处于focus状态的样式

主要用于输入界面有动画时使用

给返回顶部的a标签添加href="#",实现非js滚动回顶部动画

html,body{ scroll-behavior: smooth; }

流畅滚动,具体原理自行查询

-webkit-overflow-scrolling: touch;

文字渐变

-webkit-background-clip: text;

color: rgba(0,0,0,.01);

background-image: -webkit-gradient(linear, left top, left bottom, from(#f06332), color-stop(0.6,#f06332), to(#bb4532));

-webkit-font-smoothing: antialiased;  //字体抗锯齿

移动端字体大小无法调节

(只对chrome27.0 版本以下有效,27.0以上版本无效;只对英文才有效,对中文无效。在新版的chrome中,已经禁止了改属性,建议使用CSS3中的方法:transform:scale(0.875);当使用transform:scale(0.875)时; 不仅是文字变小了,整个文字所在的容器也同时会变小。)

-webkit-text-size-adjust: 100%|none;

键盘聚焦时控制的样式

:focus-visible{}

用于图像,特殊图形相关的布局(延图像周边排列文字时使用)

shape-outside

你可能感兴趣的:(css属性记录)