css根据子元素多少类设置子元素的属性--九宫格
.moment-image-div:nth-child(n+1):nth-last-child(-n+9){
width: 33.33%;
float: left;
}
.moment-image-div:nth-child(1):nth-last-child(1){
width: 100%;
}
.moment-image-div:nth-child(1):nth-last-child(2),
.moment-image-div:nth-child(2):nth-last-child(1) {
width: 50%;
float: left;
}
效果图:
至于高度啥的,再自行略调。
css根据子元素多少类设置子元素的属性--九宫格的更多相关文章
- HTML块元素,行内元素,类,头部元素
总结HTML块元素,行内元素,类,头部元素 块元素: 在HTML中,块级元素的高度为其内容的高度,宽度会扩展到与父容器同宽.默认情况下,块级元素会独占一行,并且元素前后行留空. 示例:<h1&g ...
- 关于自适应屏幕,设置子元素浮动,父div不能包裹子div,子元素中内容溢出的问题。
设置HTML适应不同分辨率的屏幕. 需求结构如下: HTML结构代码如下(只是其中一条): <body> <div class="content">< ...
- Winform中用户自定义控件中外部设置子控件属性的方法
假设我们新建立一个用户自定义控件,由一个lable1和pictureBox1组成 此时我们在外部调用该控件,然后想动态改变lable1的值,我们该怎么办? 假设实例化的用户控件名为UserContro ...
- 转帖 css的块元素、内联元素、内联块元素、display属性、浮动、定位
块元素 块元素,也可以称为行元素,布局中常用的标签如:div.p.ul.li.h1~h6.dl.dt.dd等等都是块元素,它在布局中的行为:1.支持全部的样式.2.如果没有设置宽度,默认的宽度为父级宽 ...
- 18 12 27 css 盒模型使用 以及相关技巧问题 元素溢出 块元素、内联元素、内联块元素
盒子模型的实际尺寸 盒子的width和height设置的是盒子内容的宽和高,不是盒子本身的宽和高,盒子的真实尺寸计算公式如下: 盒子宽度 = width + padding左右 + border左右 ...
- css 块元素、内联元素、内联块元素
块元素.内联元素.内联块元素: 元素就是标签,布局中常用的有三种标签,块元素.内联元素.内联块元素,了解这三种元素的特性,才能熟练的进行页面布局. 块元素: 块元素,也可以称为行元素,布局中常用的标签 ...
- CSS 块元素、内联元素、内联块元素三者的区别与转换
三种元素 块元素 内联元素 内联块元素 元素之间的转换 三种元素 元素就是标签,布局中常用的有三种标签,块元素.内联元素.内联块元素. 了解这三种元素的特性,才能熟练的进行页面布局. 块元素 块元素, ...
- HTML&CSS基础-子元素的伪类选择器
HTML&CSS基础-子元素的伪类选择器 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.html的源代码 <!DOCTYPE html> <html& ...
- python 全栈开发,Day47(行级块级标签,高级选择器,属性选择器,伪类选择器,伪元素选择器,css的继承性和层叠性,层叠性权重相同处理,盒模型,padding,border,margin)
一.HTML中的行级标签和块级标签 块级标签 常见的块级标签:div,p,h1-h6,ul,li,dl,dt,dd 1.独占一行,不和其他元素待在同一行2.能设置宽高3.如果不设置宽高,默认为body ...
随机推荐
- Ubuntu 10.04下架设流媒体服务器
Ubuntu 10.04下架设流媒体服务器 个人建议:使用DarwinStreamingSrvr5.5.5,因为DarwinStreamingSrvr6.0.3安装过程中有很多问题需要解决! 目前主流 ...
- MySQL-监控告警系统
开源地址: https://github.com/ycg/mysql_web QQ: 779647966 Email: ycg166911@163.com 利用python的flask进行后台开发,前 ...
- Thread类的join()方法
public class Demo { /** * Thread类的join()方法 * -------------------------------- * 1)join() * 2)join(lo ...
- 在IE中启动火狐——自定义浏览器链接协议
有时候需求就是这么奇葩,特别是在这个浏览器混战收尾的节骨眼上,有的客户正在将全单位的浏览器统一到Chrome.有的正在统一到Firefox.还有的正在统一到360上.于是就有了如题的需求,客户正在将浏 ...
- iOS 调试大法
本文转载至 http://www.jianshu.com/p/d19e19a91071 0.笨办法 看变量.对象?NSLog+重新编译运行:改某对象?改源码+重新编译运行:隔离某个方法?在方法中写 r ...
- java基础---->String中replace和replaceAll方法
这里面我们分析一下replace与replaceAll方法的差异以及原理. replace各个方法的定义 一.replaceFirst方法 public String replaceFirst(Str ...
- 11.9luffycity(4)
2018-11-9 17:57:09 明天开始自己独立写luffy部分表的接口, 越努力,越幸运!永远不要高估自己! 明天后天先不想下看视频,把接口做完,然后整理一下笔记,温故而习之,可以为师啊! 知 ...
- react withClamp装饰器
Clamp.js 等待异步数据加载完后在初始化$clamp withClamp.js import React, { Component } from "react"; expor ...
- mac 初次配置apache,及mac下安装mysql
先打开apache,在浏览器上输入 localhost 回车后会如果屏幕上显示:It works! 如下图: 这说明你的apache已开启 mac 下apache配置(mac自带apache ...
- 静态方法(staticmethod)和类方法(classmethod)
类方法:有个默认参数cls,并且可以直接用类名去调用,可以与类属性交互(也就是可以使用类属性) 静态方法:让类里的方法直接被类调用,就像正常调用函数一样 类方法和静态方法的相同点:都可以直接被类调用, ...