css3 子元素的的应用 注意点
已经第二次犯错误,不允许有下次
<ul class="ul">
<li>
<a>哈哈</a>
</li>
<li>
<a>嘿嘿</a>
</li>
<li>
<a>呵呵</a>
</li>
</ul>
需求:除了最后一个a元素,其他a元素都要下边框。
错误写法:
.ul li a:not(:last-child){
border-bottom:1px solid #e4e4e4;
}
↑↑以为自己选择的是第三个a。其实是每个li里面的a。
正确写法:
.ul li:not(:last-child) a{
border:1px solid #e4e4e4;
}
↑↑↑这就是选择除了最后一个li里面的a之外的所有li里面的a。bingo
css3 子元素的的应用 注意点的更多相关文章
- 给div设置background-color: rgba(0, 0, 0, 0.2)属性,并加了css3动画--opacity动画淡出动画,之后div子元素的字体会抖一下
问题:给div设置background-color: rgba(0, 0, 0, 0.2)属性,并加了css3动画--opacity动画淡出动画,之后div子元素的字体会抖一下: 解决:animati ...
- CSS3可伸缩框属性,可用于等分显示子元素或按比例显示子元素的大小
使用方法跟Android的android:layout_weight属性类似.可类比Android中的使用方法.这样比較好记,因为眼下全部浏览器都不支持大部分的属性,所以全部的属性都须要加上Firef ...
- CSS3 04. 伸缩布局、设置主轴,侧轴方向、主/侧轴对齐方式、 伸缩比例、元素换行、换行控制、覆盖父元素的align-items;控制子元素顺序、web字体、突变字体
CSS3 在布局方面做了非常大的改进,对块级元素的布局排列变得十分灵活,适应性非常强,其强大的伸缩性,在响应式开发中可以发挥极大的作用.(兼容性不好) 必要元素: 指定一个盒子为伸缩盒子 displa ...
- 兼容性背景颜色半透明CSS代码(不影响内部子元素)
如何简单兼容性的实现父元素是半透明背景色,而子元素不受影响. 兼容所有浏览器的背景颜色半透明CSS代码: background-color: rgba(, , , .); filter: progid ...
- 关于opacity透明度子元素继承现象的若干研究以及hack方法
[感想]信息时代的信息是有时效性的,今天是确确实实感受到了.互联网资料虽然丰富,但是质量不一,还有大量的跟风雷同,很多人都是随手拷贝过来,根本没有实践.以前端为例,这两年浏览器的迅猛发展,造成很多原有 ...
- CSS 实现:父元素包含子元素,子元素垂直居中布局
☊[实现要求]:父元素包含子元素,子元素垂直居中布局 <div class="demo5"> <div class="child">A& ...
- 解决 border-radius 元素在应用了 transform 的子元素 时overflow:hidden 失效的问题
受大家启迪,于是最近深入研究了一下Css3中的一些属性.之中也是碰到了个不为我知的问题,在这里特此总结并与大家分享. 问题重现:在父元素上应用了 border-radius 的圆角属性.加上 ove ...
- CSS3控制元素排列
需求: 将改变为. 代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset=& ...
- css 文字和子元素水平垂直居中
关于水平垂直居中,这是一个很简单的问题,但是很多时候,往往简单的东西,反而做不出来.这就是基础不扎实的缘故吧,我参照一些资料,总结了水平垂直居中的几种方法如下: 1 .文字水平垂直居中 这个比较简单, ...
随机推荐
- #1413 : Rikka with String 后缀自动机 + 二级差分
http://hihocoder.com/problemset/problem/1413?sid=1199641 这题断断续续做了2个多星期吧,一直不会 设总答案为sum,替换后新加的子串数量为x,失 ...
- informix(南大通用)sql语法的差异
1.create view 444(...) as select ...from... 2.insert into select.......union select 不支持 请分开写 ...
- 牛客网Java刷题知识点之什么是进程、什么是线程、什么是多线程、多线程的好处和弊端、多线程的创建方式、JVM中的多线程解析、多线程运行图解
不多说,直接上干货! 什么是进程? 正在进行中的程序(直译). 什么是线程? 就是进程中一个负责程序执行的控制单元(执行路径). 见 牛客网Java刷题知识点之进程和线程的区别 什么是多线程? 一个进 ...
- DEDE利用Ajax实现调用当前登录会员的信息简要说明
其实这个功能在dede默认的模板上就有,只能算是在原有的功能上进行改造而已. 1.首先需要加载一个ajax的js文件进来 <script language="javascript&qu ...
- HDU 4334——Trouble——————【贪心&水题】
Trouble Time Limit: 10000/5000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others)Total Su ...
- ViewData、ViewBag和TempData比较
一.ViewData.ViewBag和TempData的定义 public dynamic ViewBag { get; } public ViewDataDictionary ViewData { ...
- mybatis问题记录
问题:2019年3月29日 23:46:24 org.apache.ibatis.builder.IncompleteElementException: Could not find result m ...
- guava的重试机制guava-retrying使用
1,添加maven依赖 <dependency> <groupId>com.github.rholder</groupId> <artifactId>g ...
- gof23 适配器模式
namespace Adapter { class Program { static void Main(string[] args) { //原实现 ClassBase customa = new ...
- vue2.0高仿饿了么better-scroll
首先安装better-scroll npm i better-scroll -S goods页面模板 <template> <div class="goods"& ...