网站设计的小心得
一般整个页面的设计要细化, 精细化, 不要太过于粗放.
对一般的尺寸要有概念: 多个菜单条 的高度 div 在30-40px之间. 而小的广告条区域div 的高度可以控制在100-130px之间.
重要的是, 可以使用大量的, 灵活的使用 bootstrap设计元素/组件/js插件等. 而且这些元素的布局, 不是粗放型的占满一个全屏宽度的div, 而是可以在一行的全屏的div中, 分成多个col, 多个小部件位置, 灵活的使用这些小的个性化的组件...
导航nav 和 导航条navbar 和 tabs标签页 的区别:
-
注意两者都是nav, 不是navi, 即nav和navbar
-
nav有3种样式, 一种是默认型的,(注意默认的就是纵向排列的, "堆叠"形式的, 只是没有tabs和pills的样式) 然后是 两种扩展型的: 即: 标签页形式的nav-tabs和 胶囊形式的nav-pills
-
nav可以放在任何地方的,只是起导航作用的, 只有通过导航上面的文字进行链接...,它下面是没有内容的! 要有内容必须使用 标签页!
-
nav 是可以使用在任何地方的. 而navbar是导航条, 是作为页面级别来使用的.
-
标签页主要是用来 通过标签进行 展示内容的, 当然标签中的内容也可以是导航列表...
星号有了bs, amazeui, 不然那么多的前端组件自己去做好麻烦!
工具提示tooltip 和弹出框popover , 主要是用作显示 比较简单的, 少量的文字 , 非重要信息, (注意只是提示/ 提醒), 不是需要操作的内容, 比如通常不是 链接什么的....
-
最顶端的布局:
用两个向左 和向右浮动的ul来实现:
ul中的li样式都设为none:ul, ol, li{list-style:none;}
-
下拉菜单的子菜单
<ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
...
<li class="dropdown-submenu">
<a tabindex="-1" href="#">More options</a>
<ul class="dropdown-menu">
...
</ul>
</li>
</ul>