nth-of-type

Pyhton网页爬虫抓取学习(一) BeautifulSoup的使用

风流意气都作罢 提交于 2020-01-28 07:36:49
<table id="table" width="100%" border="0" align="center" cellpadding="0" cellspacing="0" class="from_w"> <tbody><tr> <td width="20%" align="right" class="tdlable">1</td> <td width="30%" align="left" class="tdvalue">2</td> <td width="20%" align="right" class="tdlable">1<font color="#FF0000">*</font> </td> <td width="30%" align="left" class="tdvalue">2 </td> </tr> <tr class="evenRow"> <td align="right" class="tdlable">2<font color="#FF0000">*</font> </td> <td class="tdvalue"></td> <td align="right" class="tdlable">1<font color="#FF0000">*</font> </td> <td class="tdvalue">1</td> </tr> <tr> <td

【CSS3】loading动画

一个人想着一个人 提交于 2020-01-05 02:54:22
HTML: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>loading</title> </head> <body> <div> <ul> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> </ul> <p>loading</p> </div> </body> </html> CSS: <style> * { margin: 0; padding: 0; list-style: none; } div { width: 85px; height: 70px; margin: 50px auto; } ul { width: 85px; height: 50px; } li { width: 8px; height: 50px; background-color: green; float: left; margin-left: 5px; animation: loading 1.2s ease-in-out infinite; } p { text-align: center; vertical-align: middle; } li:nth-of-type(1) { animation-delay: -1.1s; }

轮播图--使用原生js的轮播图

拟墨画扇 提交于 2019-12-19 09:33:34
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>轮播图-不用jquery</title> <style> *{ padding:0; margin:0; } .view{ width: 1000px; height: 600px; margin: 0px auto; margin-top:30px; position: relative; } .view > ul{ list-style: none; width: 100%; height: 100%; transform: rotate3d(1,1,0,0deg); transform-style: preserve-3d; } .view > ul > li{ width: 20%; float: left; height: 100%; position: relative; transform-style: preserve-3d; transition: transform ; transition-duration: 0.5s; } .view > ul > li > span{ display: block; width: 100%; height: 100%; position: absolute; left: 0; top

js和css多种方式实现隔行变色

心不动则不痛 提交于 2019-12-06 10:46:30
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>两种方式让css隔行变色js和css3属性.box li:nth-of-type</title> <style> *{ margin:0; padding:0; /* 通配符,表示所有标签元素。 */ } ul, ol { list-style:none; } .box { margin:20px auto; width:300px; } .box li{ padding:0 5px; line-height:35px; border-bottom:1px dashed #AAA; /* 可点击的小手 */ cursor: pointer; /* 超过一行的内容裁切三个点来代替 */ text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } /* 以下css3完成 */ /* nth-child(n):当前容器所有子元素中的第n个 */ /* .box li:nth-child(1):box容器所有子元素的第一个并且标签名是li的 */ /* nth-of-type