آموزش کامل ساختار یک فایل HTML

ساختار یک فایل HTML طرح و شکل و یا ساختار یک صفحه ی وب یا یک فایل HTML می باشد. تمامی سایت های اینترنتی از ساختار کلی تشکیل شده اند، یعنی برای مثال اگر به انتهای تمامی صفحات سایت های اینترنتی توجه نمایید شما دستور را مشاهده خواهید کرد. خب در ادامه میخواهیم با دستورات موجود آشنا شویم، اینکه این دستورات چه هستند و چکار میتونن بکنند!؟ دستور توضیح یک دستورالعمل که می گوید این صفحه اچ تی ام ال نسخه ۵ می باشد ریشه و ستون اصلی یک صفحه اچ تی ام ال هد یا سره یک صفحه اچ تی ام ال که اطلاعاتی درباره صفحه به مرورگر ارائه میدهد با استفاده از این تگ میتوان عنوان صفحه را در مرورگر مشخص کرد. <body> بدنه یا بدن اصلی یک صفحه اچ تی ام ال هرچیزی که در این بدن قرار بگیرد در مرورگر نمایش داده می شود <p> اینو بهش میگیم تگ پاراگراف که یکی از تگ های HTML می باشد. تگی که باز شده است در پایان و با توجه به اولویت باز شدنش بسته شده است، برای مثال دستور <html> اولین تگی است که باز شده و در آخر نیز با <html/> بسته شده است. پس لطفا همیشه در نظر داشته باشید که هر تگی که در HTML باز می شود در صورتی که تگ بسته داشته باشد باید بسته شود تا مشکلی برای صفحه وب ما پیش نیاید. دانلود از وبسایت www.heilton.com</p> <div class="videodes"></div> <style>.collapsible{background-color:#3e115d;color:white;cursor:pointer;padding:18px;width:100%;border:0;outline:0;font-size:15px;display:flex;justify-content:space-between;margin-right:10px;margin-left:10px;margin-right:auto;margin-left:auto}.active,.collapsible:hover{background-color:#160423}.collapsible::after{content:'\002B';color:white;font-weight:bold;float:right!important;margin-left:5px;text-align:left}.collapsible.active::after{content:"\2212"}.contentt{display:none;overflow:hidden}</style> <script>/*<![CDATA[*/var coll=document.getElementsByClassName("collapsible");var i;for(i=0;i<coll.length;i++){coll[i].addEventListener("click",function(){this.classList.toggle("active");var content=this.nextElementSibling;if(content.style.display==="block"){content.style.display="none";}else{content.style.display="block";}});}/*]]>*/</script> <style>#parent{margin:15px}#parent div{display:contents}#first{text-align:right}#second{text-align:center}#third{text-align:left}</style> </div> <div class="vinfo-meta"> <div class="vinfo-date"> <i class="icon-calendar"></i> 4 سال پیش </div> <div class="vinfo-tags"><a href="https://www.namavid.com/search/کامل+ساختار" title="کامل ساختار" class="vinfo-tag"><i class="icon-hashtag"></i> کامل ساختار</a><a href="https://www.namavid.com/search/آموزش+کامل" title="آموزش کامل" class="vinfo-tag"><i class="icon-hashtag"></i> آموزش کامل</a><a href="https://www.namavid.com/search/ساختار+" title="ساختار " class="vinfo-tag"><i class="icon-hashtag"></i> ساختار </a><a href="https://www.namavid.com/search/ساختار" title="ساختار" class="vinfo-tag"><i class="icon-hashtag"></i> ساختار</a></div> </div> <div class="vinfo-categories"><div class="vinfo-categories-container"><div class="vinfo-categories-right"><span class="vinfo-category-title"><ul style="list-style:none" itemscope="" itemtype="http://schema.org/BreadcrumbList" class="breadcrumb"><li itemprop="itemListElement" itemscope="" itemtype="http://schema.org/ListItem"><a class="vinfo-category-item" itemprop="item" href="/plist/educational" title="آموزش"><span itemprop="name"><i class="icon-folder-open"></i> آموزش</span></a><meta itemprop="position" content="1"></li></ul></span></div></div></div> </div> <style>.comment-container{margin:0 auto;background-color:white;border-radius:8px;box-shadow:0 4px 6px rgba(0,0,0,0.1);padding:20px;margin-top:30px}.comment{position:relative;margin-bottom:15px}.comment-header{display:flex;align-items:center;margin-bottom:10px}.user-avatar{width:40px;height:40px;border-radius:50%;margin-left:10px;background-color:#e1e1e1;display:flex;align-items:center;justify-content:center;color:#666}.comment-user{display:flex;align-items:center;gap:5px;font-weight:bold}.comment-user a{color:#515151;text-decoration:none}.verified-badge{color:#1da1f2;font-size:14px}.comment-body{margin-right:50px;line-height:200%;margin-bottom:20px}.comment-actions{position:absolute;left:0;top:0;height:100%}.reply-btn{color:#65676b;cursor:pointer;transition:color .3s;margin-left:10px;font-size:90%;text-decoration:none}.reply-btn:hover{color:#1da1f2}.nested-comments{margin-right:30px;border-right:2px solid #e1e1e1;padding-right:15px;background:whitesmoke;padding:10px;padding-bottom:10px;padding-bottom:0}.reply-form{background-color:#f0f2f5;border-radius:8px;padding:15px;margin-top:10px}.reply-form textarea{width:100%;border:1px solid #ddd;border-radius:4px;padding:10px;resize:vertical}.submit-btn{background-color:#1da1f2;color:white;border:0;padding:10px 15px;border-radius:4px;cursor:pointer;margin-top:10px}.login-prompt{background-color:#dc3545;color:white;text-align:center;padding:10px;border-radius:4px}.login-prompt a{color:white;text-decoration:none;border:1px solid #cfaaaa;border-radius:8px;padding:4px}.new-comment-form{background-color:#f0f2f5;border-radius:8px;padding:15px;margin-top:20px}.new-comment-form textarea{width:100%;border:1px solid #ddd;border-radius:4px;padding:10px;resize:vertical}.cmmodal{display:none;position:fixed;z-index:19000;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:rgba(0,0,0,0.6)}.cmmodal-content{background-color:#fefefe;margin:15% auto;padding:0;border-radius:8px;width:80%;max-width:500px;box-shadow:0 4px 8px rgba(0,0,0,0.2)}.cmmodal-header{display:flex;justify-content:space-between;align-items:center;background-color:#f0f2f5;padding:15px;border-top-left-radius:8px;border-top-right-radius:8px}.cmmodal-header h2{margin:0;font-size:1.1em}.cmclose-btn{color:#aaa;font-size:24px;font-weight:bold;cursor:pointer}.cmmodal-body{padding:20px}.cmmodal-body textarea{width:100%;border:1px solid #ddd;border-radius:4px;padding:10px;resize:vertical;min-height:100px}</style> <div class="comment-container"> <div class="login-prompt"><i class="icon-commenting-o"></i> برای ارسال نظر وارد حساب کاربری خود شوید <a href="/newlogin"><i class="icon-login"></i> ورود/عضویت</a> </div> </div> <div id="replyModal" class="cmmodal"> <div class="cmmodal-content"> <div class="cmmodal-header"> <h2 id="replyModalTitle">پاسخ به</h2> <span class="cmclose-btn" onclick="closeReplyModal()">×</span> </div> <div class="cmmodal-body"> <form method="POST" action=""> <input type="hidden" id="parentCommentId" name="parent" value=""> <textarea placeholder="پاسخ خود را بنویسید..." name="matn" required></textarea> <button type="submit" name="reply" class="submit-btn"> <i class="icon-paper-plane"></i> ارسال پاسخ </button> </form> </div> </div> </div> <script>function openReplyModal(commentId,username){const modal=document.getElementById('replyModal');const modalTitle=document.getElementById('replyModalTitle');const parentInput=document.getElementById('parentCommentId');modalTitle.textContent=`پاسخ به:${username}`;parentInput.value=commentId;modal.style.display='block';} function closeReplyModal(){const modal=document.getElementById('replyModal');modal.style.display='none';} window.onclick=function(event){const modal=document.getElementById('replyModal');if(event.target==modal){modal.style.display='none';}}</script> </div> <style>.related-videos-rtl{max-width:800px;margin:0 auto}.video-item-rtl{display:flex;background-color:white;margin-bottom:15px;box-shadow:0 2px 5px rgba(0,0,0,0.1);overflow:hidden;height:140px}.video-thumbnail-rtl{width:186px;height:100%;position:relative}.video-thumbnail-rtl img{height:100%;object-fit:cover}.video-time-rtl{position:absolute;bottom:5px;left:5px;background-color:rgba(0,0,0,0.7);color:white;padding:2px 5px;border-radius:3px;font-size:12px}.video-details-rtl{padding:10px;display:flex;flex-direction:column;justify-content:space-between;flex-grow:1;overflow:hidden}.video-title-rtl{font-weight:bold;line-height:1.4em;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical}.video-title-rtl a{color:black;text-decoration:none;font-size:64%;line-height:200%!important}.video-upload-time-rtl{font-size:.8em;align-self:flex-end}@media screen and (max-width:400px){.video-thumbnail-rtl img{width:100%!important;object-fit:cover}.video-item-rtl{flex-direction:column;height:auto}.video-thumbnail-rtl{width:100%!important;height:200px}.video-details-rtl{padding:10px;text-align:center}.video-upload-time-rtl{align-self:center}}</style> <div class="col-lg-4"> <div class="related-videos-rtl"> <div class="video-item-rtl"> <a href="/video/2770578/Mirror-blind-spot-car" title="آینه نقطه کور خودرو"> <div class="video-thumbnail-rtl lazyarea"> <img id="lazy" loading="lazy" width="186" height="140" alt="آینه نقطه کور خودرو" data-src="https://asset.namavid.com/vt/2026/01/29/17696871662907.jpg"> <div class="video-time-rtl">00:10</div> </div> </a> <div class="video-details-rtl"> <div class="video-title-rtl"><h2 class="vt"><a href="/video/2770578/Mirror-blind-spot-car" title="آینه نقطه کور خودرو">آینه نقطه کور خودرو</a></h2></div> <div class="video-upload-time-rtl"><i class="icon-clock"></i> 39 ثانیه پیش</div> </div> </div> <div class="video-item-rtl"> <a href="/video/2770577/Test-Tehran-electric-tram-with-traffic-police-esco" title="آزمایش تراموای برقی تهران با اسکورت پلیس راهور"> <div class="video-thumbnail-rtl lazyarea"> <img id="lazy" loading="lazy" width="186" height="140" alt="آزمایش تراموای برقی تهران با اسکورت پلیس راهور" data-src="https://asset.namavid.com/vt/2026/01/29/1769687047775.jpg"> <div class="video-time-rtl">04:06</div> </div> </a> <div class="video-details-rtl"> <div class="video-title-rtl"><h2 class="vt"><a href="/video/2770577/Test-Tehran-electric-tram-with-traffic-police-esco" title="آزمایش تراموای برقی تهران با اسکورت پلیس راهور">آزمایش تراموای برقی تهران با اسکورت پلیس راهور</a></h2></div> <div class="video-upload-time-rtl"><i class="icon-clock"></i> 2 دقیقه پیش</div> </div> </div> <div class="video-item-rtl"> <a href="/video/2770576/Beautiful-spacious-car-for-the-North" title="ماشی جادار قشنگ برای شمال"> <div class="video-thumbnail-rtl lazyarea"> <img id="lazy" loading="lazy" width="186" height="140" alt="ماشی جادار قشنگ برای شمال" data-src="https://asset.namavid.com/vt/2026/01/29/17696869278578.jpg"> <div class="video-time-rtl">01:26</div> </div> </a> <div class="video-details-rtl"> <div class="video-title-rtl"><h2 class="vt"><a href="/video/2770576/Beautiful-spacious-car-for-the-North" title="ماشی جادار قشنگ برای شمال">ماشی جادار قشنگ برای شمال</a></h2></div> <div class="video-upload-time-rtl"><i class="icon-clock"></i> 4 دقیقه پیش</div> </div> </div> <div class="video-item-rtl"> <a href="/video/2770575/The-world-of-very-cool-cars" title="دنیای ماشین ها ..... خیلی باحال"> <div class="video-thumbnail-rtl lazyarea"> <img id="lazy" loading="lazy" width="186" height="140" alt="دنیای ماشین ها ..... خیلی باحال" data-src="https://asset.namavid.com/vt/2026/01/29/17696868068852.jpg"> <div class="video-time-rtl">00:19</div> </div> </a> <div class="video-details-rtl"> <div class="video-title-rtl"><h2 class="vt"><a href="/video/2770575/The-world-of-very-cool-cars" title="دنیای ماشین ها ..... خیلی باحال">دنیای ماشین ها ..... خیلی باحال</a></h2></div> <div class="video-upload-time-rtl"><i class="icon-clock"></i> 6 دقیقه پیش</div> </div> </div> <div class="video-item-rtl"> <a href="/video/2770574/We-had-intelligent-arrow-when-artificial-intellige" title="پیکان هوشمند داشتیم وقتی هوش مصنوعی مد نبود"> <div class="video-thumbnail-rtl lazyarea"> <img id="lazy" loading="lazy" width="186" height="140" alt="پیکان هوشمند داشتیم وقتی هوش مصنوعی مد نبود" data-src="https://asset.namavid.com/vt/2026/01/29/17696866861962.jpg"> <div class="video-time-rtl">02:41</div> </div> </a> <div class="video-details-rtl"> <div class="video-title-rtl"><h2 class="vt"><a href="/video/2770574/We-had-intelligent-arrow-when-artificial-intellige" title="پیکان هوشمند داشتیم وقتی هوش مصنوعی مد نبود">پیکان هوشمند داشتیم وقتی هوش مصنوعی مد نبود</a></h2></div> <div class="video-upload-time-rtl"><i class="icon-clock"></i> 8 دقیقه پیش</div> </div> </div> <div class="video-item-rtl"> <a href="/video/2770573/Bus-Volvo-9600s-forty-eight-beds" title="اتوبوس ولوو ۹۶۰۰s چهل و هشت تخت خوابه️"> <div class="video-thumbnail-rtl lazyarea"> <img id="lazy" loading="lazy" width="186" height="140" alt="اتوبوس ولوو ۹۶۰۰s چهل و هشت تخت خوابه️" data-src="https://asset.namavid.com/vt/2026/01/29/17696865677057.jpg"> <div class="video-time-rtl">00:57</div> </div> </a> <div class="video-details-rtl"> <div class="video-title-rtl"><h2 class="vt"><a href="/video/2770573/Bus-Volvo-9600s-forty-eight-beds" title="اتوبوس ولوو ۹۶۰۰s چهل و هشت تخت خوابه️">اتوبوس ولوو ۹۶۰۰s چهل و هشت تخت خوابه️</a></h2></div> <div class="video-upload-time-rtl"><i class="icon-clock"></i> 10 دقیقه پیش</div> </div> </div> <div class="video-item-rtl"> <a href="/video/2770572/2025-bentley-mulsanne-a-masterpiece-of-the-art-of-" title="‏2025 Bentley Mulsanne‏: شاهکاری از هنر، تجمل و قدرت"> <div class="video-thumbnail-rtl lazyarea"> <img id="lazy" loading="lazy" width="186" height="140" alt="‏2025 Bentley Mulsanne‏: شاهکاری از هنر، تجمل و قدرت" data-src="https://asset.namavid.com/vt/2026/01/29/17696864487524.jpg"> <div class="video-time-rtl">04:32</div> </div> </a> <div class="video-details-rtl"> <div class="video-title-rtl"><h2 class="vt"><a href="/video/2770572/2025-bentley-mulsanne-a-masterpiece-of-the-art-of-" title="‏2025 Bentley Mulsanne‏: شاهکاری از هنر، تجمل و قدرت">‏2025 Bentley Mulsanne‏: شاهکاری از هنر، تجمل و قدرت</a></h2></div> <div class="video-upload-time-rtl"><i class="icon-clock"></i> 12 دقیقه پیش</div> </div> </div> <div class="video-item-rtl"> <a href="/video/2770571/What-is-the-volume-of-the-car-engine-and-how-is-it" title="حجم موتور خودرو ینی چی؟ چگونه به دست میاد"> <div class="video-thumbnail-rtl lazyarea"> <img id="lazy" loading="lazy" width="186" height="140" alt="حجم موتور خودرو ینی چی؟ چگونه به دست میاد" data-src="https://asset.namavid.com/vt/2026/01/29/17696863363307.jpg"> <div class="video-time-rtl">00:54</div> </div> </a> <div class="video-details-rtl"> <div class="video-title-rtl"><h2 class="vt"><a href="/video/2770571/What-is-the-volume-of-the-car-engine-and-how-is-it" title="حجم موتور خودرو ینی چی؟ چگونه به دست میاد">حجم موتور خودرو ینی چی؟ چگونه به دست میاد</a></h2></div> <div class="video-upload-time-rtl"><i class="icon-clock"></i> 14 دقیقه پیش</div> </div> </div> <div class="video-item-rtl"> <a href="/video/2770570/Watchdog-dogs-attractive-and-spectacular-cartoon" title="کارتون جذاب و دیدنی سگ های نگهبان -"> <div class="video-thumbnail-rtl lazyarea"> <img id="lazy" loading="lazy" width="186" height="140" alt="کارتون جذاب و دیدنی سگ های نگهبان -" data-src="https://asset.namavid.com/vt/2026/01/29/17696862082749.jpg"> <div class="video-time-rtl">01:51</div> </div> </a> <div class="video-details-rtl"> <div class="video-title-rtl"><h2 class="vt"><a href="/video/2770570/Watchdog-dogs-attractive-and-spectacular-cartoon" title="کارتون جذاب و دیدنی سگ های نگهبان -">کارتون جذاب و دیدنی سگ های نگهبان -</a></h2></div> <div class="video-upload-time-rtl"><i class="icon-clock"></i> 16 دقیقه پیش</div> </div> </div> <div class="video-item-rtl"> <a href="/video/2770569/Driver-taxi-internet" title="راننده تاکسی اینترنتی"> <div class="video-thumbnail-rtl lazyarea"> <img id="lazy" loading="lazy" width="186" height="140" alt="راننده تاکسی اینترنتی" data-src="https://asset.namavid.com/vt/2026/01/29/17696860861758.jpg"> <div class="video-time-rtl">01:18</div> </div> </a> <div class="video-details-rtl"> <div class="video-title-rtl"><h2 class="vt"><a href="/video/2770569/Driver-taxi-internet" title="راننده تاکسی اینترنتی">راننده تاکسی اینترنتی</a></h2></div> <div class="video-upload-time-rtl"><i class="icon-clock"></i> 18 دقیقه پیش</div> </div> </div> <div class="video-item-rtl"> <a href="/video/2770568/The-quality-of-old-and-new-Benz-cars" title="کیفیت خودرو های بنز قدیمی و جدید"> <div class="video-thumbnail-rtl lazyarea"> <img id="lazy" loading="lazy" width="186" height="140" alt="کیفیت خودرو های بنز قدیمی و جدید" data-src="https://asset.namavid.com/vt/2026/01/29/1769685966597.jpg"> <div class="video-time-rtl">00:06</div> </div> </a> <div class="video-details-rtl"> <div class="video-title-rtl"><h2 class="vt"><a href="/video/2770568/The-quality-of-old-and-new-Benz-cars" title="کیفیت خودرو های بنز قدیمی و جدید">کیفیت خودرو های بنز قدیمی و جدید</a></h2></div> <div class="video-upload-time-rtl"><i class="icon-clock"></i> 20 دقیقه پیش</div> </div> </div> <div class="video-item-rtl"> <a href="/video/2770567/The-new-idea-of-​​seven-scenes" title="ایده ی هفت سین جدید"> <div class="video-thumbnail-rtl lazyarea"> <img id="lazy" loading="lazy" width="186" height="140" alt="ایده ی هفت سین جدید" data-src="https://asset.namavid.com/vt/2026/01/29/17696858463951.jpg"> <div class="video-time-rtl">00:40</div> </div> </a> <div class="video-details-rtl"> <div class="video-title-rtl"><h2 class="vt"><a href="/video/2770567/The-new-idea-of-​​seven-scenes" title="ایده ی هفت سین جدید">ایده ی هفت سین جدید</a></h2></div> <div class="video-upload-time-rtl"><i class="icon-clock"></i> 22 دقیقه پیش</div> </div> </div> <div class="video-item-rtl"> <a href="/video/2770566/The-idea-of-​​seven-scenes" title="ایده ی هفت سین"> <div class="video-thumbnail-rtl lazyarea"> <img id="lazy" loading="lazy" width="186" height="140" alt="ایده ی هفت سین" data-src="https://asset.namavid.com/vt/2026/01/29/17696857269614.jpg"> <div class="video-time-rtl">00:35</div> </div> </a> <div class="video-details-rtl"> <div class="video-title-rtl"><h2 class="vt"><a href="/video/2770566/The-idea-of-​​seven-scenes" title="ایده ی هفت سین">ایده ی هفت سین</a></h2></div> <div class="video-upload-time-rtl"><i class="icon-clock"></i> 24 دقیقه پیش</div> </div> </div> <div class="video-item-rtl"> <a href="/video/2770565/Unbreakable-optical-fiber-drone-Ukraine" title="پهپاد فیبر نوری شکست ناپذیر اوکراین"> <div class="video-thumbnail-rtl lazyarea"> <img id="lazy" loading="lazy" width="186" height="140" alt="پهپاد فیبر نوری شکست ناپذیر اوکراین" data-src="https://asset.namavid.com/vt/2026/01/29/17696856072864.jpg"> <div class="video-time-rtl">00:57</div> </div> </a> <div class="video-details-rtl"> <div class="video-title-rtl"><h2 class="vt"><a href="/video/2770565/Unbreakable-optical-fiber-drone-Ukraine" title="پهپاد فیبر نوری شکست ناپذیر اوکراین">پهپاد فیبر نوری شکست ناپذیر اوکراین</a></h2></div> <div class="video-upload-time-rtl"><i class="icon-clock"></i> 26 دقیقه پیش</div> </div> </div> <div class="video-item-rtl"> <a href="/video/2770564/Clip-candle-with-colored-flames-when-chemistry-and" title="کلیپ شمع با شعله های رنگی وقتی شیمی وهنر در هم آمیخته می شود"> <div class="video-thumbnail-rtl lazyarea"> <img id="lazy" loading="lazy" width="186" height="140" alt="کلیپ شمع با شعله های رنگی وقتی شیمی وهنر در هم آمیخته می شود" data-src="https://asset.namavid.com/vt/2026/01/29/17696854879284.jpg"> <div class="video-time-rtl">00:26</div> </div> </a> <div class="video-details-rtl"> <div class="video-title-rtl"><h2 class="vt"><a href="/video/2770564/Clip-candle-with-colored-flames-when-chemistry-and" title="کلیپ شمع با شعله های رنگی وقتی شیمی وهنر در هم آمیخته می شود">کلیپ شمع با شعله های رنگی وقتی شیمی وهنر در هم آمیخته می شود</a></h2></div> <div class="video-upload-time-rtl"><i class="icon-clock"></i> 28 دقیقه پیش</div> </div> </div> </div> </div> </div> </div> <div class="overlay" id="modal-overlay"> <div class="modal"> <div class="modal-header"> <span><i class="icon-share"></i> اشتراک‌گذاری</span> <button class="close-btn" id="close-modal">×</button> </div> <div class="modal-content"> <div class="share-buttons"> <a rel="nofollow noreferrer" href="whatsapp://send?text=https://www.namavid.com/video/1012985" target="_blank" title="ارسال به واتس اپ" class="share-whatsapp" title="WhatsApp"><i class="icon-whatsapp"></i></a> <a rel="nofollow noreferrer" target="_blank" href="https://telegram.me/share/url?url=https://www.namavid.com/video/1012985&text=" title="ارسال به تلگرام" class="share-telegram" title="Telegram"><i class="icon-telegram"></i></a> <a rel="nofollow noreferrer" href="https://www.twitter.com/intent/tweet?url=https://www.namavid.com/video/1012985&text=آموزش+کامل+ساختار+یک+فایل+HTML+" target="_blank" class="share-twitter" title="Twitter"><i class="icon-twitter"></i></a> <a rel="nofollow noreferrer" target="_blank" href="https://www.linkedin.com/shareArticle?mini=true&url=https://www.namavid.com/video/1012985&title=آموزش+کامل+ساختار+یک+فایل+HTML+" class="share-linkedin" title="LinkedIn"><i class="icon-linkedin"></i></a> </div> </div> </div> </div> <script>const modalOverlay=document.getElementById('modal-overlay');const openModal=document.getElementById('open-modal');const closeModal=document.getElementById('close-modal');openModal.addEventListener('click',()=>{modalOverlay.style.display='flex';});closeModal.addEventListener('click',()=>{modalOverlay.style.display='none';});modalOverlay.addEventListener('click',(e)=>{if(e.target===modalOverlay){modalOverlay.style.display='none';}});</script> <div class="rprt-overlay" id="rprt-report-modal-overlay"> <div class="rprt-modal"> <div class="rprt-modal-header"> <button class="rprt-close-btn" id="rprt-close-report-modal"><i class="icon-cancel"></i></button> <span><i class="icon-flag"></i> گزارش تخلف</span> </div> <div class="rprt-modal-content"> <p><i class="icon-info"></i> لطفاً دلیل گزارش خود را بنویسید:</p> <form action="" method="POST"> <textarea name="des" required="" placeholder="توضیحات خود را اینجا بنویسید..."></textarea> <button name="report" type="submit"><i class="icon-ok"></i> ارسال گزارش</button> </form> </div> </div> </div> <script>const rprtReportModalOverlay=document.getElementById('rprt-report-modal-overlay');const rprtOpenReportModal=document.getElementById('rprt-open-report-modal');const rprtCloseReportModal=document.getElementById('rprt-close-report-modal');rprtOpenReportModal.addEventListener('click',()=>{rprtReportModalOverlay.style.display='flex';});rprtCloseReportModal.addEventListener('click',()=>{rprtReportModalOverlay.style.display='none';});rprtReportModalOverlay.addEventListener('click',(e)=>{if(e.target===rprtReportModalOverlay){rprtReportModalOverlay.style.display='none';}});</script> <script>const moreOptionsBtn=document.getElementById('vinfo-more-options');const dropdownMenu=document.querySelector('.vinfo-dropdown-menu');moreOptionsBtn.addEventListener('click',function(e){e.stopPropagation();dropdownMenu.style.display=dropdownMenu.style.display==='none'||dropdownMenu.style.display===''?'block':'none';});document.addEventListener('click',function(){dropdownMenu.style.display='none';});</script> <div class="frm-modal" id="frmModal"> <div class="frm-modal-content"> <button class="frm-close" id="frmCloseModal">×</button> <span><i class="icon-code"></i> کد پخش ویدیو در سایت شما</span> <label for="frmSelSize">اندازه آیفریم:</label> <select id="frmSelSize"> <option value="640,360">640x360</option> <option value="570,320">570x320</option> <option value="480,270">480x270</option> <option value="240,135">240x135</option> <option value="responsive" selected>واکنشگرا (responsive)</option> </select> <label>کد آیفریم:</label> <textarea id="frmIframeCode" readonly></textarea> <div> <button class="frm-copy-btn" id="frmCopyCode"><i class="icon-docs"></i> کپی</button> <span class="frm-copy-msg" id="frmCopyMsg">کپی شد!</span> </div> </div> </div> <script>/*<![CDATA[*/const frmOpenModal=document.getElementById('frmOpenModal');const frmCloseModal=document.getElementById('frmCloseModal');const frmModal=document.getElementById('frmModal');const frmSelSize=document.getElementById('frmSelSize');const frmIframeCode=document.getElementById('frmIframeCode');const frmCopyCode=document.getElementById('frmCopyCode');const frmCopyMsg=document.getElementById('frmCopyMsg');const defaultResponsiveCode=`<style>.iframe-filo iframe{width:100%;aspect-ratio:16/9;}</style><div class="iframe-filo"><iframe src="https://www.namavid.com/embed/1012985"allowFullScreen="true"webkitallowfullscreen="true"mozallowfullscreen="true"scrolling="no"></iframe></div>`;frmIframeCode.value=defaultResponsiveCode;frmOpenModal.addEventListener('click',()=>{frmModal.style.display='flex';});frmCloseModal.addEventListener('click',()=>{frmModal.style.display='none';});frmSelSize.addEventListener('change',()=>{const value=frmSelSize.value;let iframe='';if(value==='responsive'){iframe=defaultResponsiveCode;}else{const[width,height]=value.split(',');iframe=`<iframe src="https://www.namavid.com/embed/1012985"allowFullScreen="true"width="${width}"height="${height}"webkitallowfullscreen="true"mozallowfullscreen="true"scrolling="no"></iframe>`;} frmIframeCode.value=iframe;});frmCopyCode.addEventListener('click',()=>{frmIframeCode.select();document.execCommand('copy');frmCopyMsg.style.display='inline';setTimeout(()=>{frmCopyMsg.style.display='none';},2000);});window.addEventListener('click',(e)=>{if(e.target===frmModal){frmModal.style.display='none';}});/*]]>*/</script> <footer class="ftr-container"> <div class="ftr-wrapper"> <div class="ftr-logo"> <img width="169" height="40" src="/asset/logo-white-small.png" alt="نماوید"> </div> <div><a target="_blank" href="https://zgig.ir/free-host.php" style="text-decoration: none;background-color: #dc3545;color: white;text-align: center;padding: 6px;border-radius: 4px;font-size: 13px;">هاست رایگان</a> <a target="_blank" href=" https://adertavan.com/%d8%ae%d8%af%d9%85%d8%a7%d8%aa/%d8%aa%d8%ac%d9%87%db%8c%d8%b2%d8%a7%d8%aa-%d8%a2%d8%aa%d8%b4-%d9%86%d8%b4%d8%a7%d9%86%db%8c/%d8%ac%d8%b9%d8%a8%d9%87-%d8%a2%d8%aa%d8%b4-%d9%86%d8%b4%d8%a7%d9%86%db%8c/" style="text-decoration: none;background-color: #dc3545;color: white;text-align: center;padding: 6px;border-radius: 4px;font-size: 13px;"> جعبه آتش نشانی و تجهیزات آتش نشانی </a> <a target="_blank" href="https://hamedanservice.com/%d9%86%d9%85%d8%a7%db%8c%d9%86%d8%af%da%af%db%8c-%d9%85%d8%ac%d8%a7%d8%b2-%d8%aa%d8%b9%d9%85%db%8c%d8%b1%d8%a7%d8%aa-%d8%a7%d9%84-%d8%ac%db%8c-%d8%af%d8%b1-%d9%87%d9%85%d8%af%d8%a7%d9%86/" style="text-decoration: none;background-color: #dc3545;color: white;text-align: center;padding: 6px;border-radius: 4px;font-size: 13px;">نمایندگی مجاز تعمیرات ال جی</a> <a target="_blank" href="https://www.namavid.com/post/2767062/Futures-El-Banks-training-guide-for-Persian-langua" style="text-decoration: none;background-color: #dc3545;color: white;text-align: center;padding: 6px;border-radius: 4px;font-size: 13px;"> راهنمای آموزش فیوچرز ال بانک </a> </div> <div class="ftr-links"> <a href="https://www.namavid.com/contact" class="ftr-contact"> <i class="icon-mail"></i> تماس با ما </a> <a href="https://www.namavid.com/dmca" class="ftr-dmca"> <i class="icon-shield"></i> DMCA </a> </div> </div> <div class="ftr-description"> ویدیوها توسط کاربران منتشر شده و نماوید صرفا آن را به اشتراک گذاشته است. </div> </footer> <script>document.addEventListener('DOMContentLoaded',function(){const savedMode=localStorage.getItem('theme');const icon=document.querySelector('#dark-mode-toggle i');if(savedMode==='dark'){document.body.classList.add('dark-mode');icon.classList.add('icon-sun-inv','yellow');icon.classList.remove('icon-cloud-moon','blk');}else{document.body.classList.remove('dark-mode');icon.classList.add('icon-cloud-moon','blk');icon.classList.remove('icon-sun-inv','yellow');}});const darkModeToggle=document.getElementById('dark-mode-toggle');darkModeToggle?.addEventListener('click',function(){document.body.classList.toggle('dark-mode');const icon=this.querySelector('i');if(document.body.classList.contains('dark-mode')){icon.classList.remove('icon-cloud-moon','blk');icon.classList.add('icon-sun-inv','yellow');localStorage.setItem('theme','dark');}else{icon.classList.remove('icon-sun-inv','yellow');icon.classList.add('icon-cloud-moon','blk');localStorage.setItem('theme','light');}});const mobileSearchIcon=document.querySelector('.mobile-search-icon');const mobileSearchPopup=document.querySelector('.mobile-search-popup');mobileSearchIcon?.addEventListener('click',function(){mobileSearchPopup.style.display=mobileSearchPopup.style.display==='block'?'none':'block';}); const mobileMenuIcon = document.querySelector('.mobile-menu-icon'); const sidebar = document.querySelector('.sidebar'); const mainContent = document.querySelectorAll('.main-content'); const separators = document.querySelectorAll('.separator'); const upera = document.querySelectorAll('.upera-slider-container'); const uperaSliderPrev = document.querySelectorAll('.upera-slider-prev'); function toggleSidebar() { if (sidebar.style.display === 'block') { sidebar.style.display = 'none'; sidebar.style.transform = 'translateX(100%)'; if (window.innerWidth >= 700) { mainContent.forEach(mainContent => mainContent.style.marginRight = '0px'); separators.forEach(separator => separator.style.marginRight = '0px'); upera.forEach(upera => upera.style.marginRight = '0px'); uperaSliderPrev.forEach(uperaSliderPrev => uperaSliderPrev.classList.remove('wide-screen')); } } else { sidebar.style.display = 'block'; sidebar.style.transform = 'translateX(0)'; if (window.innerWidth >= 700) { mainContent.forEach(mainContent => mainContent.style.marginRight = '250px'); separators.forEach(separator => separator.style.marginRight = '250px'); upera.forEach(upera => upera.style.marginRight = '250px'); uperaSliderPrev.forEach(uperaSliderPrev => uperaSliderPrev.classList.add('wide-screen')); } } } mobileMenuIcon?.addEventListener('click', toggleSidebar); window.addEventListener('resize', function () { mobileMenuIcon.style.display = 'block'; if (window.innerWidth >= 700) { sidebar.style.display = 'block'; sidebar.style.transform = 'translateX(0)'; mainContent.forEach(mainContent => mainContent.style.marginRight = '250px'); separators.forEach(separator => separator.style.marginRight = '250px'); upera.forEach(upera => upera.style.marginRight = '250px'); uperaSliderPrev.forEach(uperaSliderPrev => uperaSliderPrev.classList.add('wide-screen')); } else { sidebar.style.display = 'none'; sidebar.style.transform = 'translateX(100%)'; mainContent.forEach(mainContent => mainContent.style.marginRight = ''); separators.forEach(separator => separator.style.marginRight = ''); upera.forEach(upera => upera.style.marginRight = ''); uperaSliderPrev.forEach(uperaSliderPrev => uperaSliderPrev.classList.remove('wide-screen')); } }); window.dispatchEvent(new Event('resize')); </script> <script>/*<![CDATA[*/function updateLoginText(){const userLogin=document.querySelector("#user-login .text");if(userLogin){if(window.innerWidth<=420){userLogin.textContent="ورود";}else{userLogin.textContent="ورود یا ثبت‌نام";}}} window.addEventListener("resize",updateLoginText);document.addEventListener("DOMContentLoaded",updateLoginText);/*]]>*/</script> <script>document.addEventListener("DOMContentLoaded",()=>{const lazyAreas=document.querySelectorAll('.lazyarea');const loadImage=(img)=>{const src=img.getAttribute('data-src');if(!src)return;img.src=src;img.onload=()=>{img.classList.add('loaded');img.parentElement.classList.add('loaded');};img.removeAttribute('data-src');};const observer=new IntersectionObserver((entries,observer)=>{entries.forEach(entry=>{if(entry.isIntersecting){const img=entry.target.querySelector('img[data-src]');if(img){loadImage(img);observer.unobserve(entry.target);}}});});lazyAreas.forEach(area=>observer.observe(area));});</script> <div id="g_id_onload" data-client_id="51598650401-t2p64rqf2a3rmkmatcjtosgi2c466qvu.apps.googleusercontent.com" data-context="use" data-login_uri="https://www.namavid.com/google" data-close_on_tap_outside="false" data-itp_support="true" data-prompt_parent_id="g_id_onload" style="position: absolute; top: 0px; left: 420px; width: 0; height: 0; z-index: 9999;"> </div> <script src="https://accounts.google.com/gsi/client" async defer></script> <script>!function(e,t,n){e.yektanetAnalyticsObject=n,e[n]=e[n]||function(){e[n].q.push(arguments)},e[n].q=e[n].q||[];var a=t.getElementsByTagName("head")[0],r=new Date,c="https://cdn.yektanet.com/superscript/XU4AdUHK/native-namavid.com-27464/yn_pub.js?v="+r.getFullYear().toString()+"0"+r.getMonth()+"0"+r.getDate()+"0"+r.getHours(),s=t.createElement("link");s.rel="preload",s.as="script",s.href=c,a.appendChild(s);var l=t.createElement("script");l.async=!0,l.src=c,a.appendChild(l)}(window,document,"yektanet");</script> <script type="text/javascript"> now = new Date(); var head = document.getElementsByTagName('head')[0]; var script = document.createElement('script'); script.async = true; script.type = 'text/javascript'; var script_address = 'https://cdn.yektanet.com/template/bnrs/yn_bnr.min.js'; script.src = script_address + '?v=' + now.getFullYear().toString() + '0' + now.getMonth() + '0' + now.getDate() + '0' + now.getHours(); head.appendChild(script); </script> <script>var s=document.createElement("script");s.src="https://van.najva.com/static/js/main-script.js";s.defer=!0;s.id="najva-mini-script";s.setAttribute("data-najva-id","ab2dab01-55fb-440a-8abb-e49152981a33");document.head.appendChild(s);</script> </body> </html>