4

これは簡単な答えです。私はCSSに精通していないため、これを修正するために何を探すべきかを知ることができません。

私の雇用主は、視覚障害を持っているため、ウェブサイトのすべてのページに[コンテンツにスキップ]リンクを追加することを望んでいます。これにより、アクセシビリティが大幅に向上します。

ここで説明する方法を実装したい：http ：//webaim.org/techniques/skipnav/#focus

私の問題は、リンクにフォーカスが移ると、テキストが突然表示されるため、ページレイアウトの残りの部分が数ピクセル押し下げられることです。ページの下のレイアウトに影響を与えずに、ページの上部にテキストを表示したいと思います。どういうわけかレイアウトの位置を修正できますか？

レイアウト全体はすでにdivコンテナーでラップされているので、そのコンテナーにCSSプロパティを追加して、その位置を修正するだけでよいと思います。

前もって感謝します。

4

1 に答える 1

7

リンクを絶対に配置することで、これを行うことができるはずです。

#skip a:active, #skip a:focus
{
position:absolute;
top: 0px; 
width:100%;
height:auto;
text-align: center;
}

絶対配置された要素は、通常のフローから削除されます。ドキュメントやその他の要素は、絶対配置要素が存在しないかのように動作するため、ページの上部にリンクが追加されますが、残りのページ要素が移動することはありません。

于 2012-06-12T15:57:11.767 に答える