last-child为啥不生效
last-child基本定义
指定属于其父元素的最后一个子元素的 p 元素的背景色
如果你这样写是不会生效的
<div class="limit-border">
<div class="text">text</div>
<div v-for = "(item,index) in provideList" :key="index" style="height:1.5rem;padding-top:.2rem;" class="limit-top" @click="toSupplierDetail(item.supplierId)">
<div style="line-height:0.5rem;margin-top: .2rem;" class="limit-long get-black-color">{{item.name}}</div>
<div style="color:rgb(173, 173, 173);font-size:12px;line-height:0.8rem" class="limit-long get-grey-color" >{{item.province}}{{item.city}}{{item.district}}{{item.address}}</div>
</div>
</div>
css如下
.limit-top{
border:1px solid red
}
.limit-top:last-child{
border none
}
原因是相同的limit-top类名的同级不能再有其他的标签元素,去掉class为text的就好了,也就是父元素底下只能有class为limit-top的列表才可以,如果你遇到这个问题,直接列表外面包一个div就好了
正确template如下
<div class="limit-border">
<div v-for = "(item,index) in provideList" :key="index" style="height:1.5rem;padding-top:.2rem;" class="limit-top" @click="toSupplierDetail(item.supplierId)">
<div style="line-height:0.5rem;margin-top: .2rem;" class="limit-long get-black-color">{{item.name}}</div>
<div style="color:rgb(173, 173, 173);font-size:12px;line-height:0.8rem" class="limit-long get-grey-color" >{{item.province}}{{item.city}}{{item.district}}{{item.address}}</div>
</div>
</div>
css不变
last-child为啥不生效的更多相关文章
- linux动态追踪神器——Strace实例介绍【转】
Strace是Linux下一款通用的进程动态跟踪工具,用来追踪程序执行时的系统调用和所接收的信号.其应用方法如下图(部分). 首先,简单说说它的使用参数,Strace的参数包括输出参数.过滤参数.统计 ...
- 解决SDL/SDL.h: No such file or directory
我在使用SDL2的时候遇到始终找不到头文件的问题,到处百度然后我尝试使用#include<SDL2/SDL.h>编译通过了,那么我很显然我之前设置的环境变量应该是没有生效的,后面在返回来研 ...
- spring-boot 加入拦截器Interceptor
1.spring boot拦截器默认有 HandlerInterceptorAdapter AbstractHandlerMapping UserRoleAuthorizationIntercepto ...
- Redis的Aof被阻塞原因调查
背景 Redis是单进程的,为了发挥多核的优势,我们redis集群采用在单台机器上部署多个redis实例,同时对持久化方式做了改进,采用rdb和增量的aof相结合的方式,appendfsync配置为n ...
- awk简单应用
偷懒之人,必定会想方设法的走捷径.如果你想结束多个ID进程,有的人可能会说pkill 和killall.但是有时候不知道为啥 不生效啊 = =! 知道的可以告诉我.刚好最近在学awk 下面命令调用系统 ...
- 开发中如何让本地host和代理共存?
开发中若遇到了需要相同域名的情况,比如利用cookie共享的sso策略,可以设置本地host映射到开发服务.设置域名,生效,正常开发. 但在公司中可能是内网,请求都需要经过代理,这时候可能会发现设置h ...
- JVM调优工具锦囊
Arthas线上 分析诊断调优工具 以前我们要排查线上问题,通常使用的是jdk自带的调优工具和命令.最常见的就是dump线上日志,然后下载到本地,导入到jvisualvm工具中.这样操作有诸多不变,现 ...
- 急~为啥我指定的的maven依赖版本没有生效?不是最短路径原则吗?
女朋友他们项目用了 spring-boot,以 spring-boot-parent 作为 parent: <parent> <groupId>org.springframew ...
- Jrebel不生效的原因和解决办法
一.问题原因和解决办法 我这里用的是idea,装了jrebel.之前用的好好的. 后边新建了一个project,不知道为啥,感觉总是不生效,虽然显示class reload了,但感觉还是没起作用. 后 ...
随机推荐
- python预习day1
计算机基础 cpu 大脑 内存 临时记忆 硬盘 永久记忆 输入设备 眼睛 耳朵 输出设备 嘴巴 操作系统 控制计算机硬件工作流程的 应用程序 安装在操作系统之上的软件 python简介 python是 ...
- 01、MySQL_简介
数据库概念 数据库(Database)是按照数据结构来组织.存储和管理数据的建立在计算机存储设备上的仓库. 数据库:存储数据的仓库 数据库分类 网络数据库 网络数据库是指把数据库技术引入到计算机网络系 ...
- copy file
import io,,,,,,, from https://pub.dev/packages/large_file_copy Directory directory = await getApplic ...
- Vue学习之npm常用命令及参数小结(十四)
NPM几个常用命令和参数的意思: npm install packagename 安装模块如不指定版本号 默认会安装最新的版本 npm install packagename 0.0.1 安装指定版本 ...
- JS-练习题
1.foo()结果 function foo() { bar.apply(null, arguments); } function bar(){ console.log(arguments); } f ...
- 英语Bisynes商务
英语bisynes商务概念的提出是改革的产物,有一个演变的过程:贸易部--商业部.外贸部--内贸部--内贸局--商务部.是内外贸一体化的概念. 中文名:商务 外文名:Business,Bisynes商 ...
- caement Archaic spelling of cement
caement Archaic spelling of cement. caement Alternative forms[edit] caement (archaic) cæment (archai ...
- property Alternative forms propretie
property Alternative forms propretie English English Wikipedia has articles on: Property (disambigua ...
- linux技能点 二
三. 文件操作:新增,删除,修改,查找,文件属性,文件内容查看,文件辅助命令,打包(解压缩),文件名注意事项. 新增:单文件,目录 ...
- 初识osquery
初识osquery osquery是一个由Facebook的开源用于对系统进行查询,监控以及分析的一款软件. osquery对其的说明如下: osquery将操作系统公开为高性能关系数据库.这允许您编 ...