Source: http://www.ido321.com/1147.html
Requirement: Let select, ul, text, button, text be displayed in one line, Effect stamp: http://bbs.csdn.net/topics/390915380?page=1#post-398415668
My implementation is as follows
HTML:
<!DOCTYPE html><html> <head> <title>Test</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> </head> <body> <div class="main"> <div class="pagediv"> <ul> <li><a href="">《</a></li> <li><a href="">1</a></li> <li><a href="">2</a></li> <li><a href="">3</a></li> <li><a href="">4</a></li> <li><a href="">》</a></li> </ul> </div> <div class="seldiv"> 每页 <select> <option>20</option> <option>30</option> <option>50</option> </select> 记录跳转至第<input type="text">页 <input type="button" value="Go"> </div> </div></body> </html>
CSS:
ul { list-style: none; } .pagediv { float: left; } ul li { float: left; } a { text-decoration: none; display: block; border: 1px solid #ccc; text-align: center; line-height: 24px; width: 24px; height: 24px; } a:hover { text-decoration: none; color: red; } .seldiv { float: left; margin: 20px; }Effect:
Next article: Web crawling: Summary of how to implement web crawling with PHP
An answer to a forum friend’s layout question
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
