顶部菜单和左侧菜单的写法是相似的,
都是选项卡
每个菜单选项都对应一个新的盒子,每个盒子的内容就是该选项卡需要展示的内容。
展示效果的实现是通过点击菜单选项之后,将其他菜单选项所对应的展示内容的盒子隐藏,只显示当前选项的内容盒子。display: none | block
其他都类似,你可以通过框架来实现,就不用自己写了。
用PS做的是效果图,需要前端开发人员编写代码才可以在网站上展示出来。简单来说,在PS里做好之后,需要切图。把图片切割成适合在网站上浏览。
切图时需要把文字分离出图片的要处理好。
切好图片之后,需要用html结合JavaScript等知识编写代码。
这样写出的页面还只是静态的网站。
如果想要做成动态的效果,还需要搭建后台,连接数据库等。
jquery 中的siblings方法你一行的每一列都是同一层的
<ul class="第三行">
<li class="1">查看列</li>
<li class="2">添加列</li>
<li class="3">修改列</li>
<li class="4">完全控制列</li>
</ul>
$(function(){
if("li.4").html()!="")
{
$(function(){
$(this).siblings("li").addClass("打勾样式")
})
}
})