less嵌套规则
<ul class="list">
<li><a href="#">links</a><span>2018-07-16</span></li>
<li><a href="#">links</a><span>2018-07-16</span></li>
<li><a href="#">links</a><span>2018-07-16</span></li>
</ul>
/*
一般这么写
.list{}
.list li{}
.list a{}
.list span{}
*/
.list{
width:600px;
margin: 30px auto;
padding:;
list-style: none; li{
height: 30px;
line-height: 30px;
background-color: pink;
margin-bottom:5px;
}
a{//不要写在li里面,尽量避免嵌套层级过深
float: left;
}
span{
float: right;
}
}
=>
/*
一般这么写
.list{}
.list li{}
.list a{}
.list span{}
*/
.list {
width: 600px;
margin: 30px auto;
padding:;
list-style: none;
}
.list li {
height: 30px;
line-height: 30px;
background-color: pink;
margin-bottom: 5px;
}
.list a {
float: left;
}
.list span {
float: right;
}
/**
.list a{}
.list a:hover{}
*/
.list{
width:600px;
margin: 30px auto;
padding:;
list-style: none; a{
float: left;
//& 代表上了一层的选择器
&:hover{
color:red;
}
}
}
=>
/**
.list a{}
.list a:hover{}
*/
.list {
width: 600px;
margin: 30px auto;
padding:;
list-style: none;
}
.list a {
float: left;
}
.list a:hover {
color: red;
}
less嵌套规则的更多相关文章
- XHTML标签的嵌套规则分析
在 XHTML 的语言里,我们都知道:ul 标签包含着 li.dl 标签包含着 dt 和 dd——这些固定标签的嵌套规则十分明确.但是,还有许多标签是独立的,它们没有被捆绑在一起,比如 h1.div. ...
- HTML5标签嵌套规则
× 目录 [1]分类 [2]子元素 [3]总结 前面的话 在html5中,<a>元素的子元素可以是块级元素,这在以前是被认为不符合规则的.本文将详细介绍html5的标签嵌套规则 分类 ht ...
- HTML标签的嵌套规则
我在平时在写html文档的时候,发现不太清楚标签之间的嵌套规则,经常是想到什么标签就用那些,后来发现有些标签嵌套却是错误的.通过网上找资料,了解了html标签的嵌套规则. 一.HTML 标签包括 块级 ...
- XHTML标签的嵌套规则--很基础很重要
XHTML的标签有许多:div.ul.li.dl.dt.dd.h1~h6.p.a.addressa.span. strong……我们在运用这些标签搭建页面结构的时候,是可以将它们无限嵌套的,但是,嵌套 ...
- HTML的奇葩嵌套规则
一.HTML 标签包括 块级元素(block).内嵌元素(inline) 1.块级元素 一般用来搭建网站架构.布局.承载内容……它包括以下这些标签: address.blockquote.center ...
- html标签的嵌套规则分析
1.a标签最好不要嵌套块级元素,可以嵌套内联元素,但是不能嵌套a标签和input之类的标签.能嵌套的标签像,等等. 2.ul和ol的子元素不能是别的元素只能是li,不能是别的比如div等,但是li中可 ...
- 一天搞定HTML----标签的嵌套规则06
标签的嵌套规则 代码演示 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> ...
- Less的嵌套规则
Less的嵌套规则 在使用标准CSS时,要为多层嵌套的元素定义样式,要么使用后代选择器从外到内的嵌套定义,要么给这个元素加上类名或 id 来定义.这样的写法虽然很好理解,但维护起来很不方便,因为无法清 ...
- Unit 3.标签的分类和嵌套规则
一.标签分类 HTML中标签元素三种不同类型:块状元素,行内元素,行内块状元素. 常用的块状元素: <div> <p> <h1>~<h6> <ol ...
- HTML(二)HTML元素(整体结构,块级元素,内联元素,结构元素,交互元素,元素嵌套规则)
HTML整体结构解释 <!DOCTYPE html> // 文件应以"<!DOCTYPE ......>"首行顶格开始,推荐使用"<!DOC ...
随机推荐
- Java线程安全队列Queue实现原理
原文链接:https://www.cnblogs.com/DreamRecorder/p/9223016.html 在Java多线程应用中,队列的使用率很高,多数生产消费模型的首选数据结构就是队列.J ...
- BeginLinux Programming chapter16: X11桌面系统简介
当前两个最流行的linux desktop environment: GNOME 和KDE, 两者对应的图形库分别是 GTK+ 和 QT. GNOME与KDE与X11的关系: X defines no ...
- 基于tesseract-OCR进行中文识别
1. 环境准备 1.1 下载 下载Tesseract-OCR安装包,地址为: https://digi.bib.uni-mannheim.de/tesseract/tesseract-ocr-w32- ...
- 【牛客网】Longest Common Subsequence
[牛客网]Longest Common Subsequence 发现只有d数组最格路 于是我们把前三个数组中相同的数记成一个三维坐标,同一个数坐标不会超过8个 从前往后枚举d,每次最多只会更新不超过8 ...
- nginx 设置开机启动
设置nginx开机启动chkconfig --add /etc/init.d/nginx chkconfig nginx on
- java获取端口号,不用request
Integer port = null; MBeanServer mBeanServer = null; List<MBeanServer> mBeanServers = MBeanSer ...
- 面试经典算法:马拉松算法,最长回文子串Golang实现
求一个字符串中最长的回文子串. package main import "fmt" /* 马拉松算法,求最长回文子串,时间复杂度:线性 */ func main() { // 回文 ...
- (十八)SpringBoot之发送QQ邮件
一.引入maven依赖 <dependencies> <dependency> <groupId>org.springframework.boot</grou ...
- C#特性 详解
一:Conditional:条件特性,预定义了一个条件方法. 使用方法: [Conditional("DEBUG")] public void test() { MessageBo ...
- myeclipse 出现换行符和空格符 解决方案 换行出现乱码
请参看百度经验 https://jingyan.baidu.com/article/acf728fd2639e4f8e510a399.html myeclipse 2014 自定义视图Customiz ...