css实现9宫格
2024-10-07 00:05:27
html
<div class="nine">
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
<li>6</li>
<li>7</li>
<li>8</li>
<li>9</li>
</ul>
</div>
css
*{
list-style: none;
padding:;
margin:;
}
.nine{
width: 170px;
height: 170px;
background: blue;
margin:50px auto ;
}
.nine ul li{
width: 50px;
height: 50px;
color: #000;
text-align: center;
float: left;
margin: 5px 0 0 5px;
background: #fff;
line-height: 50px;
}
.nine ul li:hover{
border: 5px #f00 solid;
box-sizing:border-box;
width: 60px;
height: 60px;
margin: 0 -5px -5px 0;
}
最新文章
- ABP(现代ASP.NET样板开发框架)系列之15、ABP应用层——应用服务(Application services)
- Shiro-HelloWord
- RK3288的gpio设置
- 使用 crosswalk-cordova 打包sencha touch 项目,再也不用担心安卓兼容问题!
- iOS时间那点事儿–NSTimeZone
- WPF 碰撞检测
- PHP实例开发(2)PHP通过mail()或Socket发邮件
- Codeforces Round #354 (Div. 2) C. Vasya and String
- REST四种请求(get,delete,put,post) 收集整理 之一
- oracle窗口函数中range interval的使用
- Web测试点 转
- Super Jumping! Jumping! Jumping!(dp)
- 洛谷 P1876 开灯(思维,枚举,规律题)
- 漫画:什么是HTTPS?
- java语言基础--方法的执行图解
- suctf逆向部分
- python 全栈开发,Day21(抽象类,接口类,多态,鸭子类型)
- WebApi的调用-1.前端调用
- 深入理解java虚拟机----java技术体系(一)
- Spring 注解 @Resource和@Autowired