单页wordpress模板。(Single page wordpress template. How to create new section in css)

单页wordpress模板。(Single page wordpress template. How to create new section in css)

我只是好奇这是如何完成的，因为最终我想开发自己的单页wordpress主题。

我已经看到所有主题都在一个页面上但只是向下滚动，当你添加一个新的菜单项（或页面）时，它会向页面添加一个新的css部分。 在此模板演示中可以看到一个示例： Wordpress In-Motion主题如您所见，您单击菜单链接，它会将您带到该部分。 在CSS中它添加了＃news或＃about-us

在设计wordpress主题时，有人可以向我解释这是如何创建的吗？ 山姆

I'm just curious about how this is done as eventually I want to develop my own single page wordpress theme.

I've seen themes that are all on one page but just scroll down, and as you add a new menu item (or page) it adds a new css section to the page. An example can be seen on this template demo: Wordpress In-Motion theme As you can see, you click the menu links and it takes you down to that section. In the css it adds #news or #about-us

Can someone explain to me how this is created as a function when designing a wordpress theme? Sam

最满意答案

这与Wordpess无关。 它只是使用锚点将您带到页面或向上。

如果页面上的元素具有唯一ID，则可以创建一个锚标记以链接到该ID（并且它会将您带到页面上）

例如

<div id="anchor">...</div> <div id="something-else>...</div> <a href="#anchor">Click here to go to id=anchor div</a> <a href="#something-else">Clicker to go to something-else id div</a>

你给出了一个例子的Wordpress主题也有Javascript或jQuery平滑 - 所以它会很好地滚动到锚点，而不是像普通的HTML那样立即将你带到​​那里。

That has nothing to do with Wordpess. It simply is using anchors to take you down or up the page.

If an element on the page has a unique id, you can create an anchor tag to link to that id (and it will take you there on the page)

e.g.

<div id="anchor">...</div> <div id="something-else>...</div> <a href="#anchor">Click here to go to id=anchor div</a> <a href="#something-else">Clicker to go to something-else id div</a>

The Wordpress theme you gave an example of also had Javascript or jQuery smoothing - so it would scroll nicely to the anchor, instead of instantly taking you there like plain HTML would do.