Heim >Web-Frontend >HTML-Tutorial >关于坛友的一个布局问题的解答_html/css_WEB-ITnose
关于坛友的一个布局问题的解答_html/css_WEB-ITnose
- WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOriginal
- 2016-06-24 11:54:331116Durchsuche
来源：http://www.ido321.com/1147.html
需求：让select、ul、文字、button、text显示在一行中，效果戳：http://bbs.csdn.net/topics/390915380?page=1#post-398415668
我的实现如下
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; } 效果：
下一篇：网页抓取：PHP实现网页爬虫方式小结
关于坛友的一个布局问题的解答
Stellungnahme：
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Vorheriger Artikel：CSS弹出背景半透明窗口_html/css_WEB-ITnoseNächster Artikel：Codeforces Round #276 (Div. 1)B（暴力）_html/css_WEB-ITnose