前端学习（1805）：前端调试之列表伪类练习

index.html

<!DOCTYPE html>
<html lang="en"><head><!--系统内置 start--><script type="text/javascript"></script><!--系统内置 end--><meta charset="UTF-8"><title>练习</title><!-- 不要忘记引入index.css --><link rel="stylesheet" href="index.css">
</head><body><ul><li></li><li></li><li></li><li></li><li></li><li></li></ul>
</body></html>

index.css

* {margin: 0;padding: 0;
}
ul{position:relative;height: 199px;
background: #FFFFFF;
}
li{margin-top:29px;float:left;
list-style:none;
width: 126px;
height: 141px;
background: #C4C4C4;
margin-right:51px;}
li:first-child{margin-left:215px;
}li:last-child{margin-right:0px;
}li::after{content: '';position:absolute;width: 1px;
height: 86px;
background: #DFDFDF;
}

运行结果

前端学习（1805）：前端调试之列表伪类练习相关推荐

前端学习（1807）：前端调试之列表伪类练习三
index.html <!DOCTYPE html> <html lang="en"><head> ...
前端学习（1806）：前端调试之列表伪类练习二
index.html <!DOCTYPE html> <html lang="en"><head> ...
前端学习（1804）：前端调试之列表伪类
2021年最新版Web前端学习路线图-前端小白入门必读-推荐
2021年最新版Web前端学习路线图-前端小白入门必读-推荐 Hello,大家好,相信很多学习前端的小伙伴,会有很多的疑惑: 我要学习那些技术? 我要到哪里去学习这些技术呢? 学习这些技术的目的对就业 ...
顾川的前端学习笔记--前端开发基础
阶段一前端开发基础初始HTML 本阶段重难点 3.29小时40小节4个模块 CSS选择器盒模型 CSS三大特性浮动和清楚浮动 CSS四种定位 CSS进阶 CSS3 前端工程师需要会的PS取图案 ...
web前端学习之前端重构方案，来了解一下
前端技术发展很快,很多项目面临前端部分重构,很开心可以让我进行这次项目前端的重构方案编写,在思考的同时参考了网上很多资料,希望本篇重构方案有一定的完整性,可以带给大家一些在面临重构时有用的东西,同时希 ...
前端培训丁鹿学堂：css伪类选择器（一）
css结构伪类 :nth-child(n) css结构伪类是css比较复杂的选择器.了解了怎么使用以后可以在实际项目中更高效率的写样式. :nth-child(n) 表示当前元素向上查找的父元素的第n ...
前端学习（1803）：前端调试之事件伪类练习二
index.html <!DOCTYPE html> <html lang="en"><head> ...
前端学习（1802）：前端调试之事件伪类练习
index.html <!DOCTYPE html> <html lang="en"><head>  ...

前端学习（1805）：前端调试之列表伪类练习

前端学习（1805）：前端调试之列表伪类练习相关推荐

最新文章

热门文章