小编mrw*_*web的帖子

侧边栏的最佳HTML5标记

我正在为HTML5主题设置我的WordPress侧边栏,并且真的想要使用before_widgetafter_widget正确.

所以我的问题是:两种标记模式中哪一种更合适?以下代码完全在<article>元素之外.

选项1:除了部分

<aside id="sidebar">
    <section id="widget_1"></section>
    <section id="widget_2"></section>
    <section id="widget_3"></section>
</aside>
Run Code Online (Sandbox Code Playgroud)

选项2:Div with Asides

<div id="sidebar">
    <aside id="widget_1"></aside>
    <aside id="widget_1"></aside >
    <aside id="widget_1"></aside >
</div>
Run Code Online (Sandbox Code Playgroud)

我想辅助问题是每个小部件标题使用的标题.如果我将每个小部件包装在一个<section>那么<h1>似乎是最合适的.如果我使用<aside>,我不确定.

欢迎所有意见.魔鬼的拥护者鼓励.

html5 semantic-markup

62
推荐指数
4
解决办法
12万
查看次数

"未指定输入文件"WordPress中出错

我在这个网站上工作后端工作正常.在前端,除索引页面外,不显示其他页面.错误来了"没有指定输入文件"

谢谢你的帮助

wordpress

8
推荐指数
2
解决办法
3万
查看次数

当达到 50% 视口高度时,使用 IntersectionObserver 和 rootMargin 进行更改

我完全被交叉点观察者的rootMargin属性弄糊涂了。

我的目标是在元素的一半高度穿过视口的垂直中心时向元素添加一个类。

期望结果图

在我当前的项目中,我所做的一切似乎都不会影响“根交叉矩形”,并且总是立即添加该类。我已经在最新的 Chrome 和 Firefox 中进行了测试。

这是简化的测试用例:

// https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API

const options = {
  root: null, // default, use viewport
  rootMargin: '0px 0px -50% 0px',
  threshold: 0.5 // half of item height
}

const circle = document.getElementById('circle');

const observerCallback = function(entries, observer) {
  console.log('intersected');
  circle.classList.add('intersected');
}

window.addEventListener('load', function(event) {

  const observer = new IntersectionObserver(observerCallback, options);

  observer.observe(circle);

}, false);
Run Code Online (Sandbox Code Playgroud)
.circle {
  margin: 100vh auto;
  width: 200px;
  height: 200px;
  background-color: tomato;
  border-radius: 50%;
  transition: background-color 2s ease-in-out;
}

.circle.intersected …
Run Code Online (Sandbox Code Playgroud)

intersection-observer

5
推荐指数
1
解决办法
8142
查看次数