移动端手机端新闻资讯类app选项卡效果代码
代码语言：html
所属分类：布局界面
代码描述：移动端手机端新闻资讯类app选项卡效果代码
下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0" name="viewport" />
<meta content="yes" name="apple-mobile-web-app-capable" />
<meta content="black" name="apple-mobile-web-app-status-bar-style" />
<meta content="telephone=no" name="format-detection" />
<style>
html,body { color: #333; margin: 0; height: 100%; font-family: "Myriad Set Pro","Helvetica Neue",Helvetica,Arial,Verdana,sans-serif; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-weight: normal;}* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}a { text-decoration: none; color: #000;}a, label, button, input, select { -webkit-tap-highlight-color: rgba(0, 0, 0, 0);}img { border: 0;}body { background: #fff; color: #666;}html, body, div, dl, dt, dd, ol, ul, li, h1, h2, h3, h4, h5, h6, p, blockquote, pre, button, fieldset, form, input, legend, textarea, th, td { margin: 0; padding: 0;}a { text-decoration: none; color: #08acee;}button { outline: 0;}img { border: 0;}button,input,optgroup,select,textarea { margin: 0; font: inherit; color: inherit; outline: none;}li { list-style: none;}a { color: #666;}.clearfix::after { clear: both; content: "."; display: block; height: 0; visibility: hidden;}.clearfix {}.divHeight { width: 100%; height: 10px; background: #f5f5f5; position: relative; overflow: hidden;}.r-line { position: relative;}.r-line:after { content: ''; position: absolute; z-index: 0; top: 0; right: 0; height: 100%; border-right: 1px solid #D9D9D9; -webkit-transform: scaleX(0.5); transform: scaleX(0.5); -webkit-transform-origin: 100% 0; transform-origin: 100% 0;}.b-line { position: relative;}.b-line:after { content: ''; position: absolute; z-index: 2; bottom: 0; left: 0; width: 100%; height: 1px; border-bottom: 1px solid #e2e2e2; -webkit-transform: scaleY(0.5); transform: scaleY(0.5); -webkit-transform-origin: 0 100%; transform-origin: 0 100%;}.aui-flex { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; padding: 15px; position: relative;}.aui-flex-box { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; min-width: 0; font-size: 14px; color: #333;}/* 必要布局样式css */.aui-flexView { width: 100%; height: 100%; margin: 0 auto; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column;}.aui-scrollView { width: 100%; height: 100%; -webkit-box-flex: 1; -webkit-flex: 1; -ms-flex: 1; flex: 1; overflow-y: auto; overflow-x: hidden; -webkit-overflow-scrolling: touch; position: relative;}.aui-navBar { height: 44px; position: relative; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; z-index: 1002; background: #fff;}.aui-navBar-item { height: 44px; min-width: 25%; -webkit-box-flex: 0; -webkit-flex: 0 0 25%; -ms-flex: 0 0 25%; flex: 0 0 25%; padding: 0 0.9rem; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; font-size: 0.7rem; white-space: nowrap; overflow: hidden; color: #808080; position: relative;}.aui-navBar-item:first-child { -webkit-box-ordinal-group: 2; -webkit-order: 1; -ms-flex-order: 1; order: 1; margin-right: -25%; font-size: 0.9rem; font-weight: bold;}.aui-navBar-item:last-child { -webkit-box-ordinal-group: 4; -webkit-order: 3; -ms-flex-order: 3; order: 3; -webkit-box-pack: end; -webkit-justify-content: flex-end; -ms-flex-pack: end; justify-content: flex-end;}.aui-center { -webkit-box-ordinal-group: 3; -webkit-order: 2; -ms-flex-order: 2; order: 2; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; height: 44px; width: 50%; margin-left: 25%;}.aui-center-title { text-align: center; width: 100%; white-space: nowrap; overflow: hidden; display: block; text-overflow: ellipsis; font-size: 0.95rem; color: #333;}.icon { width: 20px; height: 20px; display: block; border: none; float: left; background-size: 20px; background-repeat: no-repeat;}.icon-return{ background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAYAAAA6/NlyAAACWklEQVRoQ+3bT0tVQRjH8a8QihCJ4kJ6AwVtQmgjihJGhdDGjb2K3ouvwhYtRNCEEqNw48I2LdrUOigSEZEikB+cE8PhHBVnnpnnXL2bC/feGeZz5pln/pxzh7hmr6Fr5uUG7LDH7wFTwCfgX2z7vPfwMrAG3KreXw4y+AXwpsLK+RcYHlRwEyvna2BlEMFt2G1An/8ZNLApVhfLU9Iyx3oCZ8F6AWfDegC3YXeA5ykSVFuCKzmGu7BLwGlsNu4qXwpcBFsqpIthS4CfARvBclFt0Jg1DeMwvHOGtLDrjfVwVmzOHnaBzQV2g80BdoW1BrdhdWrxxHKevWj+tkpaXdinwMlFjbL83gLsFmsR0q6xqcHusSnBvcCmAvcGmwL8GNhqLBc19RTPxlbbw1/ARFC5a2yKHj4ExgLwXtW7x5ZzaUzdsfOwVk3a7o0EjdgHFOou0bFgOReAt31BpwD3Cp0KfB56ETiKGXcpy6YE1+hNYDRo5Gdg3gs6NVjOGeCdV7QF2DXaCuwWbQmu0bq3e7sxpjVP/06ZjC5blzVY7XhUnT2H6C/AXAl0DrArdC6wG3ROcI3WlHUnGHMKby1Pf152HMb8LjdYbX0IfGigvwKzOdAlwEXRpcDF0CXBNVp3EMeDcWka3qXBcj4APragteH4EZOg2sp6AHehv1UbkaRoL+BsaE/gGr0LTAbhmLSnvYHl1APhOu41QXsEd6EPgOnYJOYV3IbWo8PhcfCV7J7BAt0H3gN3gVfA6pWUQSHvYDVVB4L6k8f3WKzK9wGcwvm/jhtw0svpsLIzwzyZPQ8HYYoAAAAASUVORK5CYII=');}.m-slider { overflow-x: hidden; width: 100%; position: relative;}.slider-wrapper { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; width: 100%; height: 100%; -webkit-transform: translate3d(0px, 0px, 0px); transform: translate3d(0px, 0px, 0px); position: relative; z-index: 1; -webkit-transition-property: -webkit-transform; transition-property: -webkit-transform; transition-property: transform; transition-property: transform, -webkit-transform;}.slider-item { width: 100%; height: 100%; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; background: #f6f6f6;}.slider-item img { width: 100%; height: auto; display: block; border: none;}.slider-pagination { text-align: right; position: absolute; width: 100%; z-index: 2; right: 0; bottom: 10px; pointer-events: none; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: end; -webkit-align-items: flex-end; -ms-flex-align: end; align-items: flex-end; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center;}.slider-pagination >.slider-pagination-item { margin: 0 .25rem; width: 8px; height: 8px; display: inline-block; border-radius: 100%; background-color: rgba(255,255,255,0.4);}.slider-pagination >.slider-pagination-item.slider-pagination-item-active { background-color: #fff; border-radius: 100%;}.aui-palace { padding: 0.5rem 0; position: relative; overflow: hidden;}.aui-palace-grid { position: relative; float: left; padding: 1px; width: 20%; box-sizing: border-box; margin: 5px 0;}.aui-palace-grid-icon { width: 30px; height: 30px; margin: 0 auto;}.aui-palace-grid-icon img { display: block; width: 100%; height: 100%; border: none;}.aui-palace-grid-text { display: block; text-align: center; color: #333; font-size: 0.85rem; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-top: 0.2rem;}.aui-palace-grid-text h2 { font-size: 0.8rem; font-weight: normal; color: #666666;}.tab-nav { height: 40px; line-height: 40px; display: block; position: relative; background: #fff; z-index: 1; width: 100%; margin: 0 auto; box-shadow:0 3px 4px #e2e2e2;}.tab-nav-item { height: 40px; line-height: 40px; position: relative; text-align: center; color: #585858; font-size: 0.9rem; display: block; float: left; width: 20%;}.tab-nav-item.tab-active { /* background-color: #51bd03; */}.tab-nav-item.tab-active a { color: #000000; font-size: 0.8rem; font-weight:bold;}.tab-nav-item a { display: inherit; font-size: 0.8rem; color: #666;}.tab-panel { position: relative; overflow: hidden;}.tab-panel .tab-panel-item { width: 100%; position: absolute; top: 0; -webkit-transform: translateX(-100%); transform: translateX(-100%);}.tab-panel .tab-panel-item.tab-active ~ .tab-panel-item { -webkit-transform: translateX(100%); transform: translateX(100%);}.tab-panel .tab-panel-item.tab-active { position: relative; -webkit-transition: -webkit-transform .15s; transition: -webkit-transform .15s; transition: transform .15s; transition: transform .15s, -webkit-transform .15s; -webkit-transform: translateX(0); transform: translateX(0);}.aui-car-img{ width:120px; height:auto; position:relative; border-radius:5px; overflow:hidden; margin-right: 0.8rem;}.aui-car-release{ position:absolute; left:-4px; top:-2px; background:#65b05e; color:#fff; padding:0.05rem 0.2rem; font-size:0.7rem; transform: scale(0.8);}.aui-icon-play{ position:absolute; right:5px; bottom:5px; background-color:rgba(0,0,0,0.6); border-radius:20px; padding:0.25rem 0.5rem;}.aui-icon-img{ position:absolute; right:0; bottom:0; background-color:rgba(0,0,0,0.4); border-radius:20px; padding:0.15rem 0.5rem;}.icon-play{ margin: 0 auto; display: block; float: initial; width: 8px; height: 8px; background-size:8px; background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAYAAAA6/NlyAAAC/UlEQVRoQ+WbuYsUQRSHv99/YbRibiLmCpoYuYGBJoIoi0aerCjei6C464WBR+KxHpkIRmqgoIIXHmisKEaeCJ6BljzshsWd7uma7pnurqp0Xr1+X9dUvX5HiS7DObcU2A7MTkS/AOeASUkPu81v2u/KM8g5dxRYmyNzD9gs6XbTwLLsyQR2zg0DVwqCnAE2SvpcUL42sTzg18CQh2XvgfWSLnrMGbhoR2Dn3FzgUY/WXANWS7IX1riRBbwGOF7C2p920Ek6WEJHX6ZmAe8BdlbwxKfAckkvKtBViYos4APAaCVP+KfEVnqHpB8V6uxJVRbwBLCpJ43Zk2xPr5B0q2K9XuoGCZwaNgmsq8uF1QFs4B+ADZLOey1PBcJ1Aaem30z+5m8qYCmkom5gM/I7sAs4JOlPIatLCDUBODXfXJgdas9K8HSd2iRgM/Y3cKSfLqxpwOkKmQsbkXSj65J5CjQVOMW4kAQkdqpXMpoObJAf7SNI0tkqiNsAPNWFrZL0qgx4m4CN077FLbCZkGQHnPdoG3AK+DyJwrxdWFuBUxd2LIm7vxVd6jYDp4xvgZVFXVgIwCn4ySQK+5W32iEBG6ft6QWSPmVBhwZsnHeA+VmBSIjABm3ppL2dVjlUYCsIDEn6+j90qMDGuVjS1ZiAreY1HhPwVkn7YwJeIulyLMB2WM2QNO2TM9RDa7cki6qmjRCB7wLzYvnweAIszKtqhLTCJ5L8V/DBQzThoVUpLAGwrdNpHFq0FE2Kx5J4Y8B4DEk8qzRGkaaNKhFvPV/WLRB8qSWaYlpU5dJoCuJRtTxE09QSVduSddNbm3EtvdWDDA8b3XpYdXOpZQ/Hmtxcaq3DHXNCReuwiVxr2odHgFOecFPFzdVYg/jhEjr6MjVrD88BHvf4xOtJj9XA+id97My75PESmOWh7F1y+l7ymDNw0TzgZUBR408nvVS1uBqft5YJbEqcc1uAfTkK79tVgSAuaqWQzrlFticBu9ozE7BVtJZAu4r3wOftNkH2L42IbEyFwjgiAAAAAElFTkSuQmCC');}.icon-img{ margin: 0 auto; display: block; float: initial; width: 12px; height: 12px; background-size:12px; background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAYAAAA6/NlyAAACwUlEQVRoQ+2bjXHUQAyF9SoAOoAKQiqA6wAqACogVECoAFIBSQWECshVkFABlJAOHvPCesYYr/9udbLvvDOeTOZya3162l1JdmBmRvKVmX00s+f6/QDHjZl9AnADki/N7McBQrYhbQR8e8DKNqG3AuaRqPuAuQI31L4wMy34+4VEwWMz0wb8Jmdvl8KnAO4WAvqPmenU+dZmew74AsDZEmErm0letimdA34N4HrhwBLsc5MhB7zRIb1w4Nb8YjIwSW0QJ2amiX+b2RaAfs5i5BKqScAklYYqZARdH4qKD3PY7IoBk9Tup60/N3SEaQ8IXRJFgEmepyKjL2wF/QxA2Pm9M3Bas79awjgHr9D+0ucZr89LAI+tqrSJ6TshowTw0HCuAO8BPAmh/Vvj73YskXxrZl9HAPwEENZQKAEs41U7Dx1XAOSkkLEzsKwmqaPmxUCC0GytFLBUFvSjHuhQdZM4u63hCjB5ToVFDjoctihwmkwppdanMi6prhxatfNldIbVEOa/5uSkXHrgGi76ZyTlWO0fClU5XNfoU2DWwCm7e5+i6WkJD84SOIGqeC9+rM0OOPWjlOA0S88SAmfbtCFnKEmBFle17qlZKOwZws2wmAtwX1OhSDhrkvCu5T7CeEhI69GiykHXQbK1lep505zCdwBOPW88odwsYk7Xoxa3ZnzKmpT2uRw9XZ7pAnZpxEXCdm1alZNUELwr1WdOYawMau/KVkBDng9L6TMAV1MX0T7P2T4bhwDX1Vbb9fvQfnMt+W97StFnm8vnY4DrBqjroUsh32y2q6rRVdXKLoZPnXQq8NT7hX9vBQ6XwNmAVWFnB4dPvyocLoGzAavCzg4On35VOFwCZwNWhZ0dHD79qnC4BM4GrAo7Ozh8+qNUWG0avQZ8DOPh33jGvlK4ZMdsIOsTtDqSh6r01szO9cLNH51C6GhMYZY8AAAAAElFTkSuQmCC');}.aui-car-img img{ width:100%; height:auto; display:block; border: none;}.aui-flex-box h2{ overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-all; text-overflow: ellipsis; color: #505050; font-size:1rem; text-align: justify; font-weight: normal; margin-bottom:0.4rem;}.aui-flex-box span{ color:#507cf7; font-size:0.7rem; border:1px solid #507cf7; border-radius:2px; margin-bottom:0.2rem; display:block; width:45px; text-align:center; transform: scale(0.8);}.aui-flex-box p{ color:#999999; font-size:0.8rem;}.aui-content-list { display:block; border-bottom:5px solid #f0f0f0;}.aui-content-list .b-line:after{ left:15px; width:92%;}.icon-share{ background-image:url('data:image/png;base64,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');}.icon-comment{ background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAYAAAA6/NlyAAAD6ElEQVRoQ+1aT2gUVxj/fZNgFttDUE8GPZkt2ELoRYOVZBWlVQ+FQkCkSSG78xZKc9B68LjgSbCCB4nzZjPZGmiPPQgtKuraP7bFFvEapX8hHtqqpSiLs9mvPJil07CzzsSZncG8d9rd+d77fr/v933fvJl9hDU2aI3xhSb8oiuuFV7TChcKhf58Pv8+M48B2JTxYDwC8MPy8vJZx3H+CcIamNITExN9g4ODXxPRaMaJ/g8eM//a39//+uzs7MNOuAMJCyHKAM57k35j5p8zTnwTEb2qMDLzKdu2T0QibJrmp0R0GMB9KeXmjJNFpVIxlpaWfgGwhZk/s237naiE60Q0zsw3bNsuZJ2wwmea5jMxB6Z0mMlZC0IYzJpwW7Uw0dIKpxyBMCLplNYprW9LKRdqF/e6hjsERzct3bR00wruGsVicZu6Ojc3d69ba4vbLkpWxlLDMzMzA41G4yIR7feeR68Q0SEppesnHrfdyqD2rEuXSqUpwzA+9gNotVrvVavVC/7f4rZLjbAQ4kMAp1cAOC6l/Mj/W9x2aRLeCeC7FQBGpZTfryAcq11qhJVjIcQRZj6oPhPR51LKTzo1rrjt/D56VsNZ2WxqwnprieB/D8OkR1ZSuecbj6wQDyNSLDstTTilCGiFdZfWXfq/HAhTDymVaqDbMJh1l26HTwhxDcAeAF9KKcezpmbAg8kNAOp4xnUp5d5ONt0UrhJREcATAPMA/oxKutVq1avVaj3KPCGEeoQ8EGWOsmVmIqJjAF4GcE5K+UEkwuVyeYyZrwMwojr32bvM/LZt21+EWaNYLL5mGMZXRDQYxj7ApklE2y3LuhuJsDI2TXMfgKMARolow2pAMPNjwzDesCzrTrf5QoitzPwtEa3qeAUzP1AvIQzDOGNZ1tUgX4kcTFPHnYaHh9WLvPZRifuu647Mz8//0QnI1NTUxlwu9w2AV7zrlxcXFw/V6/XmaoLcbU4ihJVDIcR6ADcBjHgAbqsmKKX82w9ocnLypVwud42Idni1eMt13bFardaIm6xaLzHCanGl3MDAwE0iyntkfmw0GuMLCwuP1Xfv4NtFAG951xdd191Zq9XUIbNERqKEFeLp6enNfX19t9q1ycyXhoaGDlYqFRZCqNe473rMfm82m6OO4ywlwtRbNHHCXvPLE5FK742ekqfVPQSAer2rxl/NZnOH4zg/JUk28ZT2gy+XyyPMrEir2vaPJ0S061ldPK5A9EThNthSqVQgoktEtM5T+ikzvxl1c/I85HtKWAEVQuxm5pMe6Ipt22o72LPRc8I9YxbgSBNOW4Gk/WuFk45w2utrhdNWIGn//wIjh15q3wfO9wAAAABJRU5ErkJggg==');}.icon-data{ background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAYAAAA6/NlyAAAE/UlEQVRoQ+2aXWgcVRTHz5kdg40tdNoEsZGCSvTFIvjxolBiRSqCTahdpLVimuy9Q/wA0aItWAiCWlAfREgy9+ym8asprh+NCkJQGqhP4qOtmNYHlTTUUhdRbOlk7pEbZsuw2SYds5O4m7lPu3fv3Pv/nf+5Z74WYYU1XGG8kAI3uuOpw6nDDRaBNKUbzNA5OKnD5ZAIIV4GgBcB4Cwi3q2U+rMR3K/qcF9fnxMEwR9lQGZ+kIi+bljgXC53o2VZv0WAHyair1LgOoxA1ZROHWZOU7oOs3lWcprSJgpLuYd7e3vvsyzrAcuyRj3PO5V05iy7w1LK0wBwCzNPENH9DQ0shLgHEb8zkMzMWuuWQqFw+YInCfhldVhK+SYAvBABc5VSKgnQ8pzLCYxCiGlEvD4COK6U2tqQwKZYZTKZb0M4HwCuYeYgCAJneHj4r6Sgl81hIcQ7iPhMuH/3IeLB8PMeIhppNOBoOn9fKpU2O45jbj+Ny18S0SMNBZzL5bZYlvVNCLVXKfWWlPIzAOhi5ktBELQkldbLktJSSg8ApDkVMfMN+Xz+rJRyFwB8aIKgtd6Vz+dHk3B5yYGz2WzGcZxzAOAw83Ei2mzAenp61ti2fd6kNQB8qpR6tCGAXdd9iJlnHyYw89NENBB5rHQUETsB4EKpVFpfLBYv1Bp6yR2WUpoK/KQ5Bdm23To4OFiKAD+OiB+EwdhBRJ/8r4GllAQAZi8KpdThSrFSSlOFzyPiGgCYc5ERTWtmHiUiM1dNW80cllJKADDFyLTpycnJjRMTEzNRtblcrtOyrKOmDxF7PM87VEkjhBhDxG1hWq8tFouXaklcE2Ap5UZmPomI15XFaa1z+Xy+EBUrhDiMiDsBwLdte93AwMDflTCu6+5m5vfDoGzzPO+LyjEdHR12e3v7AUQ0Y28CgBIiPq+Ueneh4CwauL+/35qamjqOiPeGi/0DAM3M/EtbW9vN/f392vRns9lVjuOYKryKmceIqKuauIpqvZD+6O9mnVuVUj/Pd9CigYUQ+xHxtbDQECKax7uvhN93E9HsuVVKmQWAj8L+nUR05ErChBDvIeITcWjDsVuUUsdqBtzb23s7IraUJ0REBxENhM3Mk77v39Hc3GzPzMxMA8BqADillLrNnIGklKbibmfmi77vOyMjIxevJKy7u/vapqamZwHg8haJjmXmDYgoKvp+9H3/zvnmnd0m1Rat9ognCIKfMpnMaUScc4y5HNRa31UoFH4I3TQOHwjd3BEEwXj5ooKZjxCR2ceLaq7rPsbMPWZtADiGiENKKbOd5m2xgG3brro/mPk5Inq7vFJ3d/fapqYmk9qrmfmEZVkHy4VIa92Vz+fHFhKW1O9XDWxetUgpN2mt10fFIOI5IjpRKVBK+ToA7AtdPoOIGwDAVOV1Silz/7ssLRZwHIVSSrPXfzVVOXLcIaVUT5x5aj02MWAjVAjxBiLujYjeqpQarzVEnPkSBa5wuVQqlVqLxWIQR2CtxyYKHLr8FAC8CgD7iWio1gBx50scOK6gpMenwCbCS/luKWlHK+e/KocB4CWt9ewrkXppiHiGiCb/K3C9cEZ1akTc5HneyWhnVYfDW7nfwxuAeoSd1czMnUT0+YLAZoDrutu11kOI2FqHxDPM/LHv+3sq757Sf+LVoZuxJKcOxwpXHQ5OHa5D02JJTh2OFa46HLziHP4XeJkLarfDZ2MAAAAASUVORK5CYII=');}.icon-more{ background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAYAAAA6/NlyAAACb0lEQVRoQ+1WXW7TQBCeseS8Uk5AewLSE1BO0OQE5CG7yhvtCYATUN6iXT+EEzQ5AeEE5AaYEwCvXsmDpnIk18Reb6SqWmfmdcdf5vvJ7CKcWOGJ8QUhPHTHxWFxeGAKSKQHZuh/dMRhcXhgCkikB2aoLC2JtER6YApIpAdmqGxpibREemAKeCM9m83ORqPRNQCcM3ci2lhrd8fqoLWeAMBr/r4sy12WZZtjsZRSY0Tk2bjyoig2q9XqTxdeJ2Gl1AwAPiPiWR2EiLbOuakPvP5NNdz9XrjaWU5E0xAR2YQ0Te8R8aoxF5O9tdau2ki3EtZa3zDZDrVY0cs+pCuyP7qUJ6LLPqSrxDHWQ+Ja6tYYc3fo7CDhxWJxXpblzx5R+2qM4RR0llIqR8RXnrbcGHPhw9Jas3vvfH1Jklwsl8u82XeQsFLqDhHf+0D5vCiKl10uV/9ZjnKfmhpj1m2Nlbu/+wAR0RdrLaf0UbUR3iLimz7AZVm+zbJs29artf4IAB/6YAHAJ2MM9x+s+Xx+lSTJtz5YRPTdWvvoP87fCWFW4eQi/RxLi4h+WWu7Nu9Dkp9kaVXAndcSD+icGz/HtZSm6c6z9cOupf1S4IcHIvJ99qK+KHghOOcmfcjWsMYAsG4OysIBwKTPHbzHqh4ejNVcrH+J6Oaoh0cDfIKI+6flOmS45katrikmz7XruoZ827h60PBTlZ+8uXNu7TPB+5b2/Whs50I4NsdC5xWHQxWLrV8cjs2x0HnF4VDFYusXh2NzLHRecThUsdj6xeHYHAudVxwOVSy2fnE4NsdC5xWHQxWLrV8cjs2x0HlPzuF/ijYYTNyxlvUAAAAASUVORK5CYII=');}.aui-flex-box em{ font-style:normal; color:#676767; font-size:0.85rem; width:100%; position:relative; display:block; padding-left:15px;}.aui-flex-box em:before { content: ''; position: absolute; z-index: 0; top: 3px; right: 10px; height: 80%; border-right: 1px solid #D9D9D9; -webkit-transform: scaleX(0.5); transform: scaleX(0.5); -webkit-transform-origin: 100% 0; transform-origin: 100% 0;}.aui-flex-box em .icon{ width:18px; height:18px; background-size:18px;}.aui-flex-box .aui-clear-line:before{ border-right:0;}
</style>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/jquery-3.2.1.min.js"></script>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/tab.js"></script>
</head>
<body>
<section class="aui-flexView">
<header class="aui-navBar aui-navBar-fixed b-line"><a href="javascript:;" class="aui-navBar-item"><i class="icon icon-return"></i></a>
<div class="aui-center"><span class="aui-center-title">内容管理</span></div><a href="javascript:;" class="aui-navBar-item"><i class="icon icon-sys"></i></a></header>
<section class="aui-scrollView">
<div class="aui-tab" data-ydui-tab>
<ul class="tab-nav b-line">
<li class="tab-nav-item tab-active"><a href="javascript:;"><span>全部</span></a></li>
<li class="tab-nav-item"><a href="javascript:;"><span>已发布</span></a></li>
<li class="tab-nav-item"><a href="javascript:;"><span>待发布</span></a></li>
<li class="tab-nav-item"><a href="javascript:;"><span>未通过</span></a></li>
<li class="tab-nav-item"><a href="javascript:;"><span>已撤回</span></a></li>
</ul>
<div class="tab-panel">
<div class="tab-panel-item tab-active">
<a href="javascript:;" class="aui-content-list">
<div class="aui-flex b-line">
<div class="aui-car-img">
<div class="aui-car-release">已发布</div>
<div class="aui-icon-play"><i class="icon icon-play"></i></div>
<!--<div class="aui-icon-img">-->
<!--<i class="icon icon-img"></i>-->
<!--</div>--><img src="//repo.bfw.wiki/bfwrepo/image/60923544703a2.png" alt=""></div>
<div class="aui-flex-box">
<h2>一台可以带你飞的车又可以下厨房，你觉得奥迪RS怎么样呐你觉得奥迪RS怎么样呐</h2><span>已推荐</span>
<p>03-15 11:01 推荐 233 浏览 32</p>
</div>
</div>
<div class="aui-flex">
<div class="aui-flex-box"><em><i class="icon icon-share"></i>分享</em></div>
<div class="aui-flex-box"><em><i class="icon icon-comment"></i>评论</em></div>
<div class="aui-flex-box"><em><i class="icon icon-data"></i>数据</em></div>
<div class="aui-flex-box"><em class="aui-clear-line"><i class="icon icon-more"></i>更多</em></div>
</div>
</a>
<a href="javascript:;" class="aui-content-list">
<div class="aui-flex b-line">
<div class="aui-car-img">
<div class="aui-car-release">已发布</div>
<div class="aui-icon-img"><i class="icon icon-img"></i></div><img src="//repo.bfw.wiki/bfwrepo/image/60923544703a2.png" alt=""></div>
<div class="aui-flex-box">
<h2>向经典致敬!曾经的王者 2019款林肯大陆80周年纪念版,限量80台</h2><span>已推荐</span>
<p>03-15 11:01 推荐 233 浏览 32</p>
</div>
</div>
<div class="aui-flex">
<div class="aui-flex-box"><em><i class="icon icon-share"></i>分享</em></div>
<div class="aui-flex-box"><em><i class="icon icon-comment"></i>评论</em></div>
<div class="aui-flex-box"><em><i class="icon icon-data"></i>数据</em></div>
<div class="aui-flex-box"><em class="aui-clear-line"><i class="icon icon-more"></i>更多</em></div>
</div>
</a>
<a href="javascript:;" class="aui-content-list">
<div class="aui-flex b-line">
<div class="aui-car-img">
<div class="aui-car-release">已发布</div>
<div class="aui-icon-img"><i class="icon icon-img"></i></div><img src="//repo.bfw.wiki/bfwrepo/image/60923544703a2.png" alt=""></div>
<div class="aui-flex-box">
<h2>一台可以带你飞的车又可以下厨房，你觉得奥迪RS怎么样呐你觉得奥迪RS怎么样呐</h2><span>已推荐</span>
<p>03-15 11:01 推荐 233 浏览 32</p>
</div>
</div>
<div class="aui-flex">
<div class="aui-flex-box"><em><i class="icon icon-share"></i>分享</em></div>
<div class="aui-flex-box"><em><i class="icon icon-comment"></i>评论</em></div>
<div class="aui-flex-box"><em><i class="icon icon-data"></i>数据</em></div>
<div class="aui-flex-box"><em class="aui-clear-line"><i class="icon icon-more"></i>更多</em></div>
</div>
</a>
<a href="javascript:;" class="aui-content-list">
<div class="aui-flex b-line">
<div class="aui-car-img">
<div class="aui-car-release">已发布</div>
<div class="aui-icon-img"><i class="icon icon-img"></i></div><img src="//repo.bfw.wiki/bfwrepo/image/60923544703a2.png" alt=""></div>
<div class="aui-flex-box">
<h2>斯柯达明锐改款 前脸是美还是丑 给你不一样的体验感觉觉得奥迪RS怎么样呐</h2><span>已推荐</span>
<p>03-15 11:01 推荐 233 浏览 32</p>
</div>
</div>
<div class="aui-flex">
<div class="aui-flex-box"><em><i class="icon icon-share"></i>分享</em></div>
<div class="aui-flex-box"><em><i class="icon icon-comment"></i>评论</em></div>
<div class="aui-flex-box"><em><i class="icon icon-data"></i>数据</em></div>
<div class="aui-flex-box"><em class="aui-clear-line"><i class="icon icon-more"></i>更多</em></div>
</div>
</a>
<a href="javascript:;" class="aui-content-list">
<div class="aui-flex b-line">
<div class="aui-car-img">
<div class="aui-car-release">已发布</div>
<div class="aui-icon-img"><i class="icon icon-img"></i></div><img src="//repo.bfw.wiki/bfwrepo/image/60923544703a2.png" alt=""></div>
<div class="aui-flex-box">
<h2>豪华标杆 2019款保时捷Macan 性能提升,外表更迷人,入门级也豪华S怎么样呐</h2><span>已推荐</span>
<p>03-15 11:01 推荐 233 浏览 32</p>
</div>
</div>
<div class="aui-flex">
<div class="aui-flex-box"><em><i class="icon icon-share"></i>分享</em></div>
<div class="aui-flex-box"><em><i class="icon icon-comment"></i>评论</em></div>
<div class="aui-flex-box"><em><i class="icon icon-data"></i>数据</em></div>
<div class="aui-flex-box"><em class="aui-clear-line"><i class="icon icon-more"></i>更多</em></div>
</div>
</a>
<a href="javascript:;" class="aui-content-list">
<div class="aui-flex b-line">
<div class="aui-car-img">
<div class="aui-car-release">已发布</div>
<div class="aui-icon-img"><i class="icon icon-img"></i></div><img src="//repo.bfw.wiki/bfwrepo/image/60923544703a2.png" alt=""></div>
<div class="aui-flex-box">
<h2>奔驰AMG GT 63S 实力来袭 百公里加速3.1秒 这轮圈你能接受吗？奔驰AMG GT 63S 实力来袭 百公里加速3.1秒 这轮圈你能接受吗？</h2><span>已推荐</span>
<p>03-15 11:01 推荐 233 浏览 32</p>
</div>
</div>
<div class="aui-flex">
<div class="aui-flex-box"><em><i class="icon icon-share"></i>分享</em></div>
<div class="aui-flex-box"><em><i class="icon icon-comment"></i>评论</em></div>
<div class="aui-flex-box"><em><i class="icon icon-data"></i>数据</em></div>
<div class="aui-flex-box"><em class="aui-clear-line"><i class="icon icon-more"></i>更多</em></div>
</div>
</a>
<a href="javascript:;" class="aui-content-list">
<div class="aui-flex b-line">
<div class="aui-car-img">
<div class="aui-car-release">已发布</div>
<div class="aui-icon-img"><i class="icon icon-img"></i></div><img src="//repo.bfw.wiki/bfwrepo/image/60923544703a2.png" alt=""></div>
<div class="aui-flex-box">
<h2>奥迪RS4 Avant 高性能“瓦罐”车奥迪RS4 Avant,为什么只有Avant</h2><span>已推荐</span>
<p>03-15 11:01 推荐 233 浏览 32</p>
</div>
</div>
<div class="aui-flex">
<div class="aui-flex-box"><em><i class="icon icon-share"></i>分享</em></div>
<div class="aui-flex-box"><em><i class="icon icon-comment"></i>评论</em></div>
<div class="aui-flex-box"><em><i class="icon icon-data"></i>数据</em></div>
<div class="aui-flex-box"><em class="aui-clear-line"><i class="icon icon-more"></i>更多</em></div>
</div>
</a>
</div>
<div class="tab-panel-item">
<a href="javascript:;" class="aui-content-list">
<div class="aui-flex b-line">
<div class="aui-car-img">
<div class="aui-car-release">已发布</div>
<div class="aui-icon-play"><i class="icon icon-play"></i></div>
<!--<div class="aui-icon-img">-->
<!--<i class="icon icon-img"></i>-->
<!--</div>--><img src="//repo.bfw.wiki/bfwrepo/image/60923544703a2.png" alt=""></div>
<div class="aui-flex-box">
<h2>一台可以带你飞的车又可以下厨房，你觉得奥迪RS怎么样呐你觉得奥迪RS怎么样呐</h2><span>已推荐</span>
<p>03-15 11:01 推荐 233 浏览 32</p>
</div>
</div>
<div class="aui-flex">
<div class="aui-flex-box"><em><i class="icon icon-share"></i>分享</em></div>
<div class="aui-flex-box"><em><i class="icon icon-comment"></i>评论</em></div>
<div class="aui-flex-box"><em><i class="icon icon-data"></i>数据</em></div>
<div class="aui-flex-box"><em class="aui-clear-line"><i class="icon icon-more"></i>更多</em></div>
</div>
</a>
<a href="javascript:;" class="aui-content-list">
<div class="aui-flex b-line">
<div class="aui-car-img">
<div class="aui-car-release">已发布</div>
<div class="aui-icon-img"><i class="icon icon-img"></i></div><img src="//repo.bfw.wiki/bfwrepo/image/60923544703a2.png" alt=""></div>
<div class="aui-flex-box">
<h2>向经典致敬!曾经的王者 2019款林肯大陆80周年纪念版,限量80台</h2><span>已推荐</span>
<p>03-15 11:01 推荐 233 浏览 32</p>
</div>
</div>
<div class="aui-flex">
<div class="aui-flex-box"><em><i class="icon icon-share"></i>分享</em></div>
<div class="aui-flex-box"><em><i class="icon icon-comment"></i>评论</em></div>
<div class="aui-flex-box"><em><i class="icon icon-data"></i>数据</em></div>
<div class="aui-flex-box"><em class="aui-clear-line"><i class="icon icon-more"></i>更多</em></div>
</div>
</a>
<a href="javascript:;" class="aui-content-list">
<div class="aui-flex b-line">
<div class="aui-car-img">
<div class="aui-car-release">已发布</div>
<div class="aui-icon-img"><i class="icon icon-img"></i></div><img src="//repo.bfw.wiki/bfwrepo/image/60923544703a2.png" alt=""></div>
<div class="aui-flex-box">
<h2>一台可以带你飞的车又可以下厨房，你觉得奥迪RS怎么样呐你觉得奥迪RS怎么样呐</h2><span>已推荐</span>
<p>03-15 11:01 推荐 233 浏览 32</p>
</div>
</div>
<div class="aui-flex">
<div class="aui-flex-box"><em><i class="icon icon-share"></i>分享</em></div>
<div class="aui-flex-box"><em><i class="icon icon-comment"></i>评论</em></div>
<div class="aui-flex-box"><em><i class="icon icon-data"></i>数据</em></div>
<div class="aui-flex-box"><em class="aui-clear-line"><i class="icon icon-more"></i>更多</em></div>
</div>
</a>
<a href="javascript:;" class="aui-content-list">
<div class="aui-flex b-line">
<div class="aui-car-img">
<div class="aui-car-release">已发布</div>
<div class="aui-icon-img"><i class="icon icon-img"></i></div><img src="//repo.bfw.wiki/bfwrepo/image/60923544703a2.png" alt=""></div>
<div class="aui-flex-box">
<h2>斯柯达明锐改款 前脸是美还是丑 给你不一样的体验感觉觉得奥迪RS怎么样呐</h2><span>已推荐</span>
<p>03-15 11:01 推荐 233 浏览 32</p>
</div>
</div>
<div class="aui-flex">
<div class="aui-flex-box"><em><i class="icon icon-share"></i>分享</em></div>
<div class="aui-flex-box"><em><i class="icon icon-comment"></i>评论</em></div>
<div class="aui-flex-box"><em><i class="icon icon-data"></i>数据</em></div>
<div class="aui-flex-box"><em class="aui-clear-line"><i class="icon icon-more"></i>更多</em></div>
</div>
</a>
<a href="javascript:;" class="aui-content-list">
<div class="aui-flex b-line">
<div class="aui-car-img">
<div class="aui-car-release">已发布</div>
<div class="aui-icon-img"><i class="icon icon-img"></i></div><img src="//repo.bfw.wiki/bfwrepo/image/60923544703a2.png" alt=""></div>
<div class="aui-flex-box">
<h2>豪华标杆 2019款保时捷Macan 性能提升,外表更迷人,入门级也豪华S怎么样呐</h2><span>已推荐</span>
<p>03-15 11:01 推荐 233 浏览 32</p>
</div>
</div>
<div class="aui-flex">
<div class="aui-flex-box"><em><i class="icon icon-share"></i>分享</em></div>
<div class="aui-flex-box"><em><i class="icon icon-comment"></i>评论</em></div>
<div class="aui-flex-box"><em><i class="icon icon-data"></i>数据</em></div>
<div class="aui-flex-box"><em class="aui-clear-line"><i class="icon icon-more"></i>更多</em></div>
</div>
</a>
<a href="javascript:;" class="aui-content-list">
<div class="aui-flex b-line">
<div class="aui-car-img">
<div class="aui-car-release">已发布</div>
.........完整代码请登录后点击上方下载按钮下载查看
热门代码搜索
其他语言代码库
Html代码库
Python代码库
Java代码库
Php代码库
Phpcli代码库
Golang代码库
C#代码库
Nodejs代码库
C代码库
C++代码库
Sql代码库
R代码库
Rust代码库
Ruby代码库
Dart代码库
Vb代码库
D代码库
F#代码库
Typescript代码库
Coffeescript代码库
Julia代码库
Kotlin代码库
Perl代码库
Groovy代码库
Lua代码库
Vala代码库
Ocaml代码库
Assembly代码库
Objectc代码库
Scala代码库
Erlang代码库
Pascal代码库
Swift代码库
Fortran代码库
Bash代码库
Clojure代码库
Ada代码库
Elixir代码库
Cobol代码库
Haskell代码库
Nim代码库
Racket代码库
Lisp代码库
网友评论0