慕课网

精品课程十天精通CSS3

十天精通CSS3

最热最新

Triangel

设置单行省略： .test_demo{ overflow:hidden; background:#ccc; width:200px; position: relative; line-height: 20px; max-height: 40px; } 设置多行省略： .test_demo{ text-overflow:ellipsis; overflow:hidden; width:200px; background:#ccc; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3; } 这只能兼容webkit内核的，如果想要兼容其他浏览器，需要用到伪元素:after中的content来显示...，代码如下： .test_demo{ position: relative; line-height: 20px; max-height: 40px; overflow: hidden;//line-height和max-height结合是为了让其显示两行文本 } .test_demo::after{ content: "..."; position: absolute; bottom: 0; right: 0; padding-left: 40px; background: -webkit-linear-gradient(right, transparent, #ccc 55%); background: -o-linear-gradient(right, transparent, #ccc 55%); background: -moz-linear-gradient(right, transparent, #ccc 55%); background: linear-gradient(to right, transparent, #ccc 55%); }

查看全部

0 采集收起来源：CSS3文字与字体 text-overflow 与 word-wrap
2018-03-22
anfumin

background-image:linear-gradient(to left top,#00f,#ff0); 为文字段落添加从右下角向左上角的线性渐变背景

查看全部

0 采集收起来源：CSS3颜色渐变色彩
2016-10-08
fantacy吴贝

element:not([属性选择器]),选择一类tag派出特定含有某属性的，添加样式。

查看全部

0 采集收起来源：CSS3 结构性伪类选择器—not
2016-10-08
qq_繁华雨落尽空城_0

结构性伪类选择器—empty: :empty选择器表示的就是空。用来选择没有任何内容的元素，这里没有内容指的是一点内容都没有，哪怕是一个空格。示例显示：比如说，你的文档中有三个段落p元素，你想把没有任何内容的P元素隐藏起来。我们就可以使用“:empty”选择器来控制。 HTML代码： <p>我是一个段落</p> <p> </p> <p></p> CSS代码： p{ background: orange; min-height: 30px; } p:empty { display: none; }

查看全部

0 采集收起来源：CSS3 结构性伪类选择器—empty
2018-03-22
qq_繁华雨落尽空城_0

结构性伪类选择器—not: :not选择器称为否定选择器,可以选择除某个元素之外的所有元素。例：就拿form元素来说，比如说你想给表单中除submit按钮之外的input元素添加红色边框 SS代码可以写成： form { width: 200px; margin: 20px auto; } div { margin-bottom: 20px; } input:not([type="submit"]){ border:1px solid red; } 相关HTML代码： <form action="#"> <div> <label for="name">Text Input:</label> <input type="text" name="name" id="name" placeholder="John Smith" /> </div> <div> <label for="name">Password Input:</label> <input type="text" name="name" id="name" placeholder="John Smith" /> </div> <div> <input type="submit" value="Submit" /> </div> </form> 例图：

查看全部

0 采集收起来源：CSS3 结构性伪类选择器—not
2018-03-22
fantacy吴贝

first-of-type指定了元素类型，用来定位父元素下某个类型的第一个子元素。

查看全部

0 采集收起来源：CSS3 first-of-type选择器
2016-10-06
慕运维6092719

*使用伪元素制作导航列表项分隔线*/ .nav li{background:linear-gradient(to bottom,#dd2926,#a82724,#dd2926) no-repeat right / 1px 15px;};

查看全部

0 采集收起来源：CSS3背景制作导航菜单综合练习题
2016-10-06
慕粉3782381

线性渐变 1. http://img1.sycdn.imooc.com//54b72b2e0001500103790158.jpg 2. http://img1.sycdn.imooc.com//542a25da00017e9406980223.jpg

查看全部

0 采集收起来源：CSS3颜色渐变色彩
2016-10-06
fantacy吴贝

:after or :before创建的伪元素在Element内部。创建的是子元素。注意！:first-child选择所有的子元素和本身，选择的是直系后代一层。

查看全部

0 采集收起来源：CSS3 结构性伪类选择器—first-child
2016-10-18
fantacy吴贝

1.一个页面通过<tagname href="#idname" #idname指向><tagname id="idname"taget目标> 2.设置多个：target时，点击另一个时，其他通过:target点击显示设置的属性会消失。 3.一个页面应该最多只能有一个taget比较合适

查看全部

0 采集收起来源：CSS3 结构性伪类选择器—target
2018-03-22
fantacy吴贝

结构性伪类选择器：empty,选择所有空元素（没有任何内容的元素，与void元素不同）

查看全部

0 采集收起来源：CSS3 结构性伪类选择器—empty
2016-10-06
fantacy吴贝

结构性伪类选择器：not结合属性选择器。排除选择元素，选择所有其他元素。

查看全部

0 采集收起来源：CSS3 结构性伪类选择器—not
2016-10-06
fantacy吴贝

结构性伪类选择器:root，选择文档根元素。

查看全部

0 采集收起来源：CSS3 结构性伪类选择器—root
2016-10-06
fantacy吴贝

属性选择器[attribute=start value^=/end value$=/contain value*=]

查看全部

0 采集收起来源：CSS3选择器属性选择器
2016-10-06
慕运维6092719

repeat round stretch

查看全部

0 采集收起来源：CSS3边框为边框应用图片 border-image
2016-10-05

首页上一页 393 394 395 396 397 398 399 下一页尾页

0/150

提交

取消

开始学习

课程须知: 1.html+CSS相关基础知识 2.具有一定的网页制作经验 3.此课程不支持IE9版本以下，建议使用 chrome、safari、firefox、opera浏览器学习本课程。

老师告诉你能学到什么？: 1.系统学习CSS3相关知识 2.轻松制作出各种绚丽的效果