用过css3哪些特性

  • 新增的选择器标签,见下面第3条:css选择器
  • display:flex响应式布局
  • border-radius box-shadow text-shadow box-sizing font-face
  • transform2D/3D转换 (scale rotate translate) transition过渡(简单动画)
  • animation 动画
  • @media媒体查询 max-width等判断
  • 多列布局:columns column-count column-gap column-span等

另:
1、选择器中单冒号和双冒号的区别:
单冒号代表伪类,双冒号代表伪元素。为了兼容旧版本浏览器,最好都写单冒号,但当只需要支持高级版本时,建议伪类和伪元素区分写。
2、a锚点元素的伪类顺序:lvha,即:

  • :link 未点击时的样式
  • :visited 鼠标点击后的样式
  • :hover 鼠标悬停的样式
  • :active 鼠标点击后未抬起时的样式

3、css选择器:

// css2中的
div > p div下的直接子元素p
div + p 紧挨着div的p元素
:last-child :first-child
//四大伪类
[attribute~=value] 属性包含值

// css3中的
div ~ p 前面有div的p元素(前面的兄弟节点中有div的p元素)(css3中的)
:nth-child(n) :nth-last-child(n) //n取值从0开始计算,但是数元素的时候,是从1开始数的
tagName:nth-of-type className:nth-of-type(n) //选取父元素下的第N个XXX元素(要指定类型)
[attribute^=value]属性以value开头
[attribute$=value]属性以value结尾
[attribute*=value]属性包含值
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 选择qi:是表达式 标签选择器 类选择器 属性选择器 继承属性: color,font,text-align,li...
    wzhiq896阅读 1,810评论 0 2
  • 选择qi:是表达式 标签选择器 类选择器 属性选择器 继承属性: color,font,text-align,li...
    love2013阅读 2,342评论 0 11
  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,815评论 1 92
  • display: none; 与 visibility: hidden; 的区别 联系:它们都能让元素不可见 区别...
    纹小艾阅读 1,696评论 0 1
  • 俗话说:“婚姻是爱情的坟墓’,但是又有人说:“要是不结婚,爱情岂不是连葬身之地都没有了么?”我其实一直特别奇怪,为...
    灿灿_e560阅读 590评论 6 8