css - 一个元素与内容对齐的程式化导航栏

标签 css layout

我有一个独特的布局,我想构建,但我对 CSS 的经验还远远不够,无法独自完成它。也许有人可以帮助我?

我想要一个在大约 700 像素宽的居中垂直框中显示内容的页面。内容将是垂直列出的单个帖子(想想 Tumblr)。这并不费力,但困难的部分是导航栏。

该栏将包含指向年份的链接,中间选择当前年份,左侧为前几年,右侧为后年份,整个 shebang 占据页面宽度的 100%。我希望当前选择的年份与内容栏一样宽。当用户点击不同的年份时,会显示该年份,其他年份会相应变化(这部分我可以处理)。

这是一个插图,可以让您更好地理解我在说什么。

enter image description here

这有可能吗?关于如何实现这一目标的任何想法? (忽略右边每一年都是2010年,应该是2012年,2013年,2014年)

最佳答案

我认为 jQuery Tabs 可以解决问题:http://jqueryui.com/demos/tabs/

关于css - 一个元素与内容对齐的程式化导航栏,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8584575/

相关文章:

html - 使用 CSS Hover 指定特定位置的静态图像位置

html - 将 margin 放入 Div

html - 在再次调整窗口大小之前不会触发 masonry 布局

Android:横向模式的备用布局xml

java - 将 GroupLayout 更改为 GridBagLayout

html - 正确对齐图片说明

html - 我的导航栏不会自行居中

html - ie9 svg渐变不起作用

jquery - bootstrap 选项卡中的 highcharts 图表显示不正确

layout - Flutter 中的基本对齐文本和虚线