为了账号安全,请及时绑定邮箱和手机立即绑定
  • 表单元素中,单选按钮复选按钮都具有选中未选中状态。(大家都知道,要覆写这两个按钮默认样式比较困难)。在CSS3中,我们可以通过状态选择器“:checked”配合其他标签实现自定义样式。而“:checked”表示的是选中状态。


    查看全部
  • “:disabled”选择器刚好与“:enabled”选择器相反,用来选择不可用表单元素。要正常使用“:disabled”选择器,需要在表单元素的HTML中设置“disabled”属性。

    例如:HTML代码

    <div>
        <input type="text" name="name" id="name" placeholder="我是不可用输入框"  />
      </div>

    CSS代码:

    input[type="text"] {
      background: rgba(0,0,0,.15);
      border: 1px solid rgba(0,0,0,.15);
      color: rgba(0,0,0,.15);


    查看全部
  • 在Web的表单中,有些表单元素有可用(“:enabled”)和不可用(“:disabled”)状态,比如输入框,密码框,复选框等。在默认情况之下,这些表单元素都处在可用状态。那么我们可以通过伪选择器“:enabled”对这些表单元素设置样式。

    查看全部
  • mark...

    mark.//

    查看全部
  • mark


    mark

    查看全部
  • 不要被老师的代码讲解迷惑了,格式可不是那样子写的哦!这节其实就是个你学过东西的集合,只不过这个结合能让你用一个方法设置多个图片,除了颜色只能设置一个以外,没其他的了。
     
        background:url(http://static.mukewang.com/static/img/logo_index.png) no-repeat,
                   url(http://static.mukewang.com/static/img/logo_index.png) no-repeat;
        background-position:left top,right bottom;
        background-repeat:no-repeat,no-repeat;
        background-color:color;
        background-size:75% 50%,50% 40%;
       

    查看全部
  • “:only-of-type”选择器用来选择一个元素是它的父元素的唯一一个相同类型的子元素。这样说或许不太好理解,换一种说法。“:only-of-type”是表示一个元素他有很多个子元素,而其中只有一种类型的子元素是唯一的,使用“:only-of-type”选择器就可以选中这个元素中的唯一一个类型子元素。

    查看全部
  • :only-child选择器选择的是父元素中只有一个子元素,而且只有唯一的一个子元素。也就是说,匹配的元素的父元素中仅有一个子元素,而且是一个唯一的子元素

    查看全部
  • :nth-last-of-type(n)”选择器和“:nth-of-type(n)”选择器是一样的,选择父元素中指定的某种子元素类型,但它的起始方向是从最后一个子元素开始,而且它的使用方法类似于上节中介绍的“:nth-last-child(n)”选择器一样。

    查看全部
  • :root选择器,从字面上我们就可以很清楚的理解是根选择器,他的意思就是匹配元素E所在文档的根元素。在HTML文档中,根元素始终是<html>。

    查看全部
  • :last-of-type”选择器和“:first-of-type”选择器功能是一样的,不同的是他选择是父元素下的某个类型的最后一个子元素

    查看全部
  • :nth-of-type(n)选择器和“:nth-child(n)”选择器非常类似,不同的是它只计算父元素中指定的某种类型的子元素。当某个元素中的子元素不单单是同一种类型的子元素时,使用“:nth-of-type(n)”选择器来定位于父元素中某种类型的子元素是非常方便和有用的。在“:nth-of-type(n)”选择器中的“n”和“:nth-child(n)”选择器中的“n”参数也一样,可以是具体的整数,也可以是表达式,还可以是关键词。

    查看全部
  • “:first-of-type”选择器类似于“:first-child”选择器,不同之处就是指定了元素的类型,其主要用来定位一个父元素下的某个类型的第一个子元素。

    查看全部
  •         Flexbox布局,即伸缩布局盒模型(Flexible Box),用来提供一个更加有效的方式制定、调整和分布一个容器里项目布局,即使它们的大小是未知或者动态的,这里简称为Flex。

    优点:

    第一,屏幕和浏览器窗口大小发生改变也可以灵活调整布局;

    第二,可以指定伸缩项目沿着主轴或侧轴按比例分配额外空间(伸缩容器额外空间),从而调整伸缩项目的大小;

    第三,可以指定伸缩项目沿着主轴或侧轴将伸缩容器额外空间,分配到伸缩项目之前、之后或之间;

    第四,可以指定如何将垂直于元素布局轴的额外空间分布到该元素的周围;

    第五,可以控制元素在页面上的布局方向;

    第六,可以按照不同于文档对象模型(DOM)所指定排序方式对屏幕上的元素重新排序。也就是说可以在浏览器渲染中不按照文档流先后顺序重排伸缩项目顺序。


    查看全部

  • box-shadow是向盒子添加阴影。支持添加一个或者多个。

    很简单的一段代码,就实现了投影效果,酷毙了。我们来看下语法:

    box-shadow: X轴偏移量 Y轴偏移量 [阴影模糊半径] [阴影扩展半径] [阴影颜色] [投影方式];


    查看全部

举报

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

微信扫码,参与3人拼团

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

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