PHP8.1.21版本已发布
vue8.1.21版本已发布
jquery8.1.21版本已发布

模仿某网站招聘列表_html/css_WEB-ITnose

原创
2016-06-24 11:50:22 1005浏览

引言

       关注到一朋友所在公司的网站,看到招聘信息部分,突然觉的这个效果简单并且可复用,然后自己就练习了一把。

缺点

      点击标题展开内容后,文字有点抖动,还没排查出来问题所在。

页面

 1 
2

高级Java软件工程师

3 21
22
23

高级C#软件工程师

24 42

 

CSS

body    {        margin:0px;        padding:0px;        font-size:10px;    }        .jobs_box    {        width:590px;        margin:20px 0 0 10px;        border-bottom:1px dashed #e7eaec;    }        .jobs_box ul     {        list-style-type:decimal;    }        .jobs_box ul li     {        margin-left:15px;    }        .jobs_box .up, .jobs_box .down    {        width:16px;        height:16px;            }            .jobs_box .up {background:url(images/plus.png) no-repeat;}    .jobs_box .down{background:url(images/minus.png) no-repeat;}        .jobs_box h2    {       font-size:14px;       line-height:24px;       cursor:pointer;    }        .jobs_box h2 b     {        float:left;        width:560px;        margin:-3px 0 0 30px;            }        .jobs_box h3    {       padding-top:30px;           }        .jobs_box .hp_cont    {        padding:0 15px 0 25px;            }

 

jQuery代码

 

效果图

 

声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn核实处理。