Skip to content

Commit 854cecd

Browse files
huang303513huang303513
committed
less即学即用完成
1 parent 9e7a484 commit 854cecd

File tree

6 files changed

+250
-6
lines changed

6 files changed

+250
-6
lines changed

‎Less即学即用/.idea/Less即学即用.iml

Lines changed: 12 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎Less即学即用/.idea/modules.xml

Lines changed: 8 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎Less即学即用/.idea/workspace.xml

Lines changed: 144 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎Less即学即用/Less/index.html

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,14 @@
66
<link rel="stylesheet" href="style/main.css">
77
</head>
88
<body>
9-
<div class="box"></div>
9+
<ul class="list">
10+
<li><a href="#">这是一个测试的文字</a><span>2014-10-12</span></li>
11+
<li><a href="#">这是一个测试的文字</a><span>2014-10-12</span></li>
12+
<li><a href="#">这是一个测试的文字</a><span>2014-10-12</span></li>
13+
<li><a href="#">这是一个测试的文字</a><span>2014-10-12</span></li>
14+
</ul>
15+
<br><br><br><br><br><br><br><br><br><br>
16+
<div class="box2"></div>
1017
<div class="radius_test"></div>
1118
<div class="sanjiao"></div>
1219
<div class="pipe"></div>

‎Less即学即用/Less/style/main.css

Lines changed: 29 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,4 @@
11
@charset "UTF-8";
2-
body {
3-
background-color: #00d4b4;
4-
}
52
.box {
63
width: 300px;
74
height: 300px;
@@ -43,3 +40,32 @@ body {
4340
width: 1600px;
4441
color: #c2c2c2;
4542
}
43+
.list {
44+
width: 600px;
45+
margin: 30px auto;
46+
padding: 0;
47+
list-style: none;
48+
}
49+
.list li {
50+
height: 30px;
51+
line-height: 30px;
52+
background-color: pink;
53+
margin-bottow: 5px;
54+
padding: 0 10px;
55+
}
56+
.list a {
57+
float: left;
58+
}
59+
.list a:hover {
60+
color: red;
61+
}
62+
.list span {
63+
float: right;
64+
}
65+
.test_arguments {
66+
border: 40px #ff0000 solid;
67+
}
68+
.test_03 {
69+
width: calc(270px);
70+
height: calc(300px-30px);
71+
}

‎Less即学即用/Less/style/main.less

Lines changed: 49 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
@charset "UTF-8";
22

33
body {
4-
background-color: #00d4b4;
4+
//background-color: #00d4b4;
55
}
66

77
//变量一定要用@开头，变量名后面一个：值
@@ -115,4 +115,51 @@ body {
115115
.box_02{
116116
width:(@test_01 + 20) * 5;
117117
color: #ccc - 10;
118-
}
118+
}
119+
120+
121+
//==========================嵌套规则==============================
122+
.list{
123+
width:600px;
124+
margin:30px auto;
125+
padding:0;
126+
list-style:none;
127+
128+
li{
129+
height:30px;
130+
line-height:30px;
131+
background-color:pink;
132+
margin-bottow:5px;
133+
padding: 0 10px;
134+
}
135+
a{
136+
float:left;
137+
//&代表上一层
138+
&:hover{
139+
color:red;
140+
}
141+
}
142+
span{
143+
float:right;
144+
}
145+
}
146+
147+
//=======================arguments==================================
148+
.border_arg(@w:30px, @c:red, @xx:solid){
149+
border:@arguments;
150+
}
151+
.test_arguments{
152+
.border_arg(40px);
153+
}
154+
155+
.test_03{
156+
width:calc(300px-30px);
157+
height:~'calc(300px-30px)';
158+
}
159+
160+
161+
162+
163+
164+
165+

0 commit comments

Comments
 (0)