CSS3新增属性

25 篇文章 0 订阅

关于文本的: 


文本阴影:text-shadow      文本换行: Word-wrap 、 Word-break      Css3服务器端字体: @font-face 使用方法: @font-face{  font-family:webFont;  src:url(‘font/字体名称.otf’);  }   Div{font-family:webFont;}
    (阿里文字图标的加载步骤 1.先从阿里图标库下载图标; 2.把文件放到站点中,可以建一个font文件夹 3.把iconfont.css文件导入到html文件中; 4.在html文档中写一个内联元素如span标签,加class=“iconfont    图标对应class名” <span class="iconfont icon-shouji"></span>)

 

关于背景的:


Background-origin 背景原点  Background-clip 背景裁切  Background-size 背景尺寸关于边框的:
Border-color 边框颜色、Border-image 图片边框     Border-radius 圆角边框、 Box-shadow 盒子阴影

文本阴影:text-shadow: h-shadow   v-shadow     blur    color
h-shadow    必需。水平阴影的位置。允许负值;
v-shadow    必需。垂直阴影的位置。允许负值。
blur                  可选。模糊的距离。    
color                  可选。阴影的颜色。

1)是否允许长单词换行:word-wrap:normal  \ break-word
2)是否允许长单词换行(加上后单词不会另起一行显示):word-break:normal\ break-all

背景裁切:Background-clip; 用来规定背景的绘制区域(对于背景颜色)border-box、padding-box、content-box

背景原点:Background-origin;padding-box/border-box/content-box
背景尺寸:Background-size;数值/百分比/cover/contain
背景图片多个用逗号隔开
背景颜色模式:rgba(r:红色;g:绿色;b:蓝色;a:alpha)
边框color、style、width,圆角:border-radius(圆50%)透明:transparent
box-shadow:水平 垂直 模糊距离 阴影尺寸 颜色 内外部 。
图片边框:border-image;

  • 2
    点赞
  • 14
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值