为了账号安全,请及时绑定邮箱和手机立即绑定
  • text-overflow 与 word-wrap text-overflow:ellipsis; //text-overflow用来设置是否使用一个省略标记(...)标示对象内文本的溢出。 overflow:hidden; //溢出内容为隐藏 white-space:nowrap; //强制文本在一行内显示
    查看全部
  • text-overflow用来设置是否使用一个省略标记(...)标示对象内文本的溢出。通过width来判断省略的部分
    查看全部
  • box-shadow:x-偏移量,y-偏移量,阴影模糊程度,阴影扩展程度,颜色;
    查看全部
  • RGB是一种色彩标准,是由红(R)、绿(G)、蓝(B)的变化以及相互叠加来得到各式各样的颜色。RGBA是在RGB的基础上增加了控制alpha透明度的参数。 语法: color:rgba(R,G,B,A)
    查看全部
  • 渐变色彩 CSS3 Gradient分为线性渐变(linear)和径向渐变(radial) 第一个参数省略时,默认为“180deg”,等同于“to bottom”。 0deg to top 从下向上 90deg to right 从左到右 180deg to bottom 从上向下 270deg to left 从右向左 to top left 右下角到左上角 to top right 左下角到右上角 第二个和第三个参数,表示颜色的起始点和结束点,可以有多个颜色值。 background-image:linear-gradient(to left, red, orange,yellow,green,blue,indigo,violet);
    查看全部
  • box-shadow: X轴偏移量 Y轴偏移量 [阴影模糊半径] [阴影扩展半径] [阴影颜色] [投影方式];阴影模糊半径与阴影扩展半径的区别 阴影模糊半径:此参数可选,其值只能是为正值,如果其值为0时,表示阴影不具有模糊效果,其值越大阴影的边缘就越模糊; 阴影扩展半径:此参数可选,其值可以是正负值,如果值为正,则整个阴影都延展扩大,反之值为负值时,则缩小;
    查看全部
  • 方法:把宽度(width)设为高度(height)的一半,并且只设置左上角和右上角的半径与元素的高度一致(大于也是可以的)。 div{ height:50px;/*是width的一半*/ width:100px; background:#9da; 这里怎么有点看糊涂了呢
    查看全部
  • 以上的语法的介绍,就这么简单,如果添加多个阴影,只需用逗号隔开即可。如: .box_shadow{ box-shadow:4px 2px 6px #f00, -4px -2px 6px #000, 0px 0px 12px 5px #33CC00 inset; }
    查看全部
  • border-radius: 5px 4px 3px 2px; /* 四个半径值分别是左上角、右上角、右下角和左下角,顺时针 */ border-radius是向元素添加圆角边框。
    查看全部
  • css3
    查看全部
    0 采集 收起 来源:什么是CSS3?

    2014-12-30

  • CSS3给我们带来了什么好处呢?简单的说,CSS3把很多以前需要使用图片和脚本来实现的效果、甚至动画效果,只需要短短几行代码就能搞定。比如圆角,图片边框,文字阴影和盒阴影,过渡、动画等。 简化了前端开发工作人员的设计过程,加快页面载入速度。
    查看全部
    1 采集 收起 来源:CSS3能做什么?

    2014-12-30

  • 目前主流浏览器chrome谷歌、safari苹果、firefox火狐、opera、甚至360都已经支持了CSS3大部分功能了,IE10以后也开始全面支持CSS3了。 在编写CSS3样式时,不同的浏览器可能需要不同的前缀W3C标准 前缀 浏览器 -webkit chrome和safari -moz firefox -ms IE -o opera
    查看全部
    0 采集 收起 来源:什么是CSS3?

    2014-12-30

  • 取值: 布局 ---> display: flex; 方向 ---> flex-direction: row(横)||column(竖); 上下 ---> align-items: flex-start||center||flex-end; 左右 ---> justify-content: 同上; 兼容加-webkit-前缀
    查看全部
  • 1.创建flex容器 .flexcontainer{ display: -webkit-flex; display: flex; } 2.Flex项目显示 Flex项目是Flex容器的子元素。他们沿着主要轴和横轴定位。默认的是沿着水平轴排列一行。你可以通过flex-direction来改变主轴方向修改为column,其默认值是row。 .flexcontainer{ display: -webkit-flex; display: flex; -webkit-flex-direction: column; flex-direction: column; } 3.Flex项目移动到顶部 如何将flex项目移动到顶部,取决于主轴的方向。如果它是垂直的方向通过align-items设置;如果它是水平的方向通过justify-content设置。 .flexcontainer{ -webkit-flex-direction: column; flex-direction: column; -webkit-justify-content: flex-start; justify-content: flex-start; }
    查看全部
  • 【CSS3 属性】 box-shadow:4px 4px 16px #666,-4px -4px 16px red inset; 负值是改变阴影的反方向,不负值是正常方向。 inset 是内阴影,去掉它,就是外阴影。
    查看全部

举报

0/150
提交
取消
课程须知
1.html+CSS相关基础知识 2.具有一定的网页制作经验 3.此课程不支持IE9版本以下,建议使用 chrome、safari、firefox、opera浏览器学习本课程。
老师告诉你能学到什么?
1.系统学习CSS3相关知识 2.轻松制作出各种绚丽的效果

微信扫码,参与3人拼团

意见反馈 帮助中心 APP下载
官方微信
友情提示:

您好,此课程属于迁移课程,您已购买该课程,无需重复购买,感谢您对慕课网的支持!