English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
عندما يكون محتوى صفحة الويب HTML طويلاً، قد يجد المستخدمين بعض الإزعاج عند تصفح هذه الصفحة، مثل الرغبة في العودة إلى أعلى الصفحة بعد الوصول إلى أسفل الصفحة، حيث لا يمكن سوى سحب شريط التمرير إلى أعلى (أو تحديث الصفحة، ولكن هذه الطريقة ليست جيدة تجربياً)، والطريقة الجيدة هي إعداد نقطة التثبيت لحل هذه المشكلة، وتحقيق التصفح داخل الصفحة أو بين الصفحات
<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>دليل أساسي(oldtoolbag.com), إعداد النقطة</title></head><body> <a href="#bottom" name="top">إلى الأسفل</a> <div style="height: 5000px; width: 300px; background-color: #123">هذا يوضح كيفية الانتقال إلى أعلى الصفحة وأسفل الصفحة</div> <a href="#top" name="bottom">العودة إلى القمة</a></body></html>اختبار لرؤية <‹/›
(أ) طريقة إعداد الانتقال في الصفحة: الطريقة الأولى
تحديد رابط نقطة <a href="#miao">البحث عن الكواكب المطرقة</a>;(ملاحظة: يجب أن يكون قيمة الخاصية href مسبوقة بـ #)
في الموقع المطلوب في الصفحة، قم بتحديد نقطة <a name="miao"></a>;(ملاحظة: يجب أن تحتوي لصق (a) على خاصية name، قيمة الخاصية يجب أن تكون نفسها مثل قيمة href في [1]، بدون #) واكتب النص المطلوب، عادة لا يكتب محتوى。
(ب) طريقة إعداد الانتقال في الصفحة: الطريقة الثانية
تحديد رابط نقطة <a href="#miao">البحث عن الكواكب المطرقة</a>;(ملاحظة: يجب أن يكون قيمة الخاصية href مسبوقة بـ #)
موقع تحديد النقطة <h4 id="miao">قاعدة الكواكب المطرقة</h4>؛ في العنصر الذي يجب التغلب عليه، أضف خاصية id، قيمة الخاصية يجب أن تكون نفسها مثل قيمة href في [1]، بدون #
ملاحظة: الطريقة الثانية لا تحتاج إلى إضافة لصق (a) خاص لتحديد النقطة المطلوبة، بل يكفي إضافة id في العنصر الذي يحتاجه.
<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>锚演示-基础教程oldtoolbag.com</title> </head> <body> <ul> <li><a href="#miao">去找喵星人</a></li> <li><a href="#wang">去找汪星人</a></li> <li><a href="#meng">其他萌物</a></li> </ul> <a name="miao"></a><!--设置锚点方法1--> <h3 id="miao">喵星人基地</h3><!--设置锚点方法2--> <p>喵喵喵~</p> <p>喵喵喵~</p> <p>喵喵喵~</p> <p>喵喵喵~</p> <p>喵喵喵~</p> <p>喵喵喵~</p> <a name="wang"></a> <p>汪汪汪~</p> <p>汪汪汪~</p> <p>汪汪汪~</p> <p>汪汪汪~</p> <p>汪汪汪~</p> <p>汪汪汪~</p> <a name="meng"></a> <p>مممم~</p> <p>مممم~</p> <p>مممم~</p> <p>مممم~</p> <p>مممم~</p> <p>مممم~</p> </body> </html>اختبار لرؤية <‹/›