css3新样式

寻技术 Html/CSS 2023年07月11日 64

css3跟html5一样是css的最新版本,但也是很多年前了

css3更新了

  1. max/min-width/height 最大最小宽高
  2. border-radius 圆角
  3. background(image,size,repeat,position,Origin,clip) 背景,可以用图片作为背景
  4. Gradients 渐变
  5. text-shadow 字体阴影
  6. box-shadow 盒子阴影
  7. word-break 文本单词处理
  8. transform 2D效果,3D效果
  9. animation+@keyframes 动画效果
  10. flex 弹性布局 这个单独写一个文章
  11. grid 网格布局 这个还没能全普及
  12. white-space 文本空格处理

上面更新的这些内容
最常用的,最有用的就是圆角,文字切割,2D效果,flex布局,特别是background,transform2D和flex直接改变了css原来的布局方式,打开了新世界的大门

比如在transform2D出现之前,定位居中是left:50%,margin-left:负的元素本身宽度的一半px;
比如在background支持图片背景之前,背景图片全靠定位去做;
比如在flex之前,经典的浮动双飞翼布局 和 圣杯布局

可继承属性

  • 字体系列属性:font-family,font-weight,font-size,font-style...
  • 文本系列属性:text-indent,text-align,line-heigh,word-spacing,letter-spacing,text-transform, color
  • 元素可见性:visibility
  • 光标属性:cursor
关闭

用微信“扫一扫”