شنبه ۲۲ شهریور ۱۴۰۴

Saturday, September 13, 2025 GMT +3:30

مخفی کردن عناصر وب با CSS

css-display-none

گاهی مواقع در طراحی صفحات وب و کدنویسی HTML و CSS ممکن است بنا به دلایل مختلف نیاز به این داشته باشیم که مواردی را از چشم کاربران عادی پنهان و مخفی کنیم، به طور مثال شرایطی پیش می آید که بخواهیم بین کاربران عادی و ربات ها تفکیک قائل شویم، یعنی به طور مثال یک فیلد را فقط به ربات ها نشان دهیم، در چنین شرایطی برخی ترجیح می دهند از برنامه نویسی سمت سرور مانند PHP یا ASP در این گونه موارد استفاده کنند و برخی نیز به جاوا اسکریپت متوصل می شوند، اما در کنار همه این روش ها که در جای خود کاربرد دارند، شاید یکی از بهترین و کاربردی ترین راه ها، استفاده از قابلیت های CSS باشد که در ادامه آموزش به آنها اشاره می کنیم.

چرا عناصر را در صفحه وب پنهان می کنیم؟


شاید این سوال در ذهنتان باشد که چه نیازی است عناصر را در صفحات وب مخفی و پنهان کنیم؟
البته این کار همیشه هم ضرورت ندارد، بلکه استفاده از این قابلیت در صفحات وب بستگی به شرایط و نیاز شما دارد، به طور مثال فرض کنید یک سیستم ضد ارسال هرزنامه یا اسپم ایجاد کرده اید که متکی بر پر شدن یا نشدن یک فیلد در یک فرم HTML است، به این صورت که اگر فیلد مورد نظر پر شود یعنی کاربر یک ربات است و اگر خالی باشد یعنی کاربر یک انسان است، همان طور که می دانیم ربات ها صفحات وب را معمولا بدون پردازش CSS و به صورت کد HTML دریافت می کنند، لذا آن فیلد مخفی برای آنها قابل رویت است و بنابراین به همراه سایر فیلدهای موجود در فرم، آن را هم به احتمال خیلی زیاد با عباراتی پر می کنند، اما با مخفی کردن فیلد برای کاربران عادی آنها نمی توانند در شرایط معمولی فیلد را مشاهده کنند و لذا نباید اطلاعاتی در آن وارد نمایند، حتی می توان با درج عبارتی مانند "در این فیلد چیزی ننویسید" کاربرانی که استایل CSS در مرورگرشان غیر فعال است را نیز راهنمایی کرد، یا به طور مثال اگر بخواهیم یک ابزار یا یک عبارت، بنا به دلایل مختلف فقط برای ربات ها قابل رویت باشد، نیاز به استفاده از CSS است.

استفاده از display:none


ابتدایی ترین روشی مخفی کردن عناصر در صفحات وب با CSS استفاده از خاصیت display و با مقادیر none است، به این صورت لایه یا بلاک مورد نظر با وجود اینکه در صفحه وجود دارد، ولی از چشم کاربران عادی (در شرایط معمول و با فعال بودن استایل CSS) پنهان است، برای استفاده از این خاصیت کافی است آن را به صورت یک کلاس یا آی دی و یا به صورت استایل خطی به عنصر مورد نظر نسبت دهیم.
<style type="text/css">
.hidden{
    display:none;
}
</style>
نکته: بعضا مشاهده می شود که برای مخفی کردن لینک ها یا به اصطلاح فریب دادن ربات های جستجوگر مانند ربات گوگل، از این خاصیت استفاده می شود،  به یاد داشته باشیم ربات ها و از جمله ربات گوگل بر اساس الگوریتم های خود این گونه موارد را شناسایی کرده و در صورت تکرار ممکن است سایت یا وبلاگ ما را در لیست سیاه خود قرار داده یا حداقل رتبه آن را کاهش دهند، لذا استفاده از display:none باید با دقت و به تعداد خیلی کم انجام شود.

استفاده از visibility:hidden


یکی دیگر از خاصیت های CSS که در مخفی کردن عناصر در صفحات وب کاربرد دارد، خاصیت visibility:hidden است، البته عملکرد visibility:hidden تا حدود زیادی مشابه display:none است، با این تفاوت که visibility:hidden اگرچه عنصر را در صفحه مخفی می کند، اما بر خلاف display:none اثر آن را به طور کامل از بین نمی برد، به عنوان مثال اگر یک بلاک با ارتفاع 200 پیکسل را با display:none مخفی کنیم، فضای 200 پیکسلی اشغال شده نیز از بین می رود، اما اگر همین کار را با visibility:hidden انجام دهیم، بلاک مخفی می شود، بدون اینکه 200 پیکسل فضای اشغال شده از بین برود.
<style type="text/css">
#visibility{
    visibility:hidden;
}
</style>

استفاده از position:absolute و left


تکنیک هایی که در بالا اشاره شد اگرچه روش هایی استاندارد و در جای خود قابل استفاده هستند، اما کاربرد زیاد آنها در یک صفحه به لحاظ سئو (SEO) یا بهینه سازی موتورهای جستجو (Search Engine Optimization) توصیه نمی شود، از این رو طراحان و برنامه نویسان از روش دیگری برای مخفی نمودن عناصر HTML در صفحات وب استفاده می کنند، در این روش ابتدا با استفاده از خاصیت position:absolute عنصر را به حالت شناور در آورده و سپس با کمک left و در نظر گرفتن یک مقدار منفی برای آن، عنصر را از دید کاربران مخفی می کنند بدون اینکه تاثیری در ظاهر صفحه ایجاد شود.
<style type="text/css">
.accessible{
    position:absolute;
    left:-9999px;
    top:auto;
    width:5px;
    height:5px;
    overflow:hidden;
}
</style>
توضیح:
- مقادیر absolute برای خاصیت position باعث شناور شدن بلاک یا عنصر مورد نظر می شود.
- مقدار منفی برای left، عنصر را به بیرون از دید کاربر و خارج از صفحه نمایش هدایت می کند.
- مقادیر width و height می توانند صفر در نظر گرفته شوند، اما برای اطمینان از اینکه ربات هایی مانند ربات گوگل محتوای بلاک را پردازش کنند، بهتر است مقداری بیش از صفر یا 1 برای ارتفاع و عرض در نظر گرفته شود.
- خاصیت overflow با مقادیر hidden باعث می شود که محتوای مازاد بر فضای بلاک، مخفی شود.
نکته: وقتی از مقادیر منفی برای خاصیت left استفاده می کنیم، باید در نظر داشته باشیم که چینش (direction) صفحه در تگ body به صورت پیش فرض یا چپ به راست (ltr) باشد، در غیر این صورت (یعنی اگر تگ body چینش rtl یا راست به چپ داشته باشد) در صفحه اسکرول افقی خواهیم داشت، در این گونه موارد به جای left باید از right و مقادیر منفی برای کلاس مخفی استفاده کنیم یا اینکه چینش را در تگ body به حالت ltr تغییر دهیم و یا اگر ناچار به استفاده از چینش rtl هستیم، آن را به بلاک های زیرمجموعه نسبت دهیم نه به تگ body.
دسته بندی: آموزش کاربردی » CSS
related مطالب بیشتر:
ساخت بلاک شناور عمودی با CSS
ایجاد منو برای سایت یا وبلاگ با استفاده از CSS
چسبیدن فوتر قالب به پائین صفحه با CSS
ایجاد بلاک و تصویر شفاف (Transparent) با استفاده از CSS3
آموزش استفاده از فونت فارسی در وب با CSS
دیدگاه
more ۵۷ دیدگاه برای این مطلب ارسال شده است.
more چینش دیدگاه ها به ترتیب از جدیدترین به قدیمی ترین است.
hossein
۱۲:۴۲ ۱۴۰۲/۰۶/۰۹
سلام مجدد، ممنون از پاسخگویی شما
از وردپرس استفاده میکنم و قالب وودمارت، هدر هم با هدر ساز قالب ساخته شده با اینکه دانش برنامه نویسی ندارم، ولی ویرایش کدهای css برای تغییر فونت و رنگ و کلا استایل رو بلدم، اگه ممکنه شما بفرمایید از چه تگ و کدی باید استفاده کرد تا بدم یکی از دوستان طبق توضیحات شما تکمیل کنه
بازم لطف کردید ممنونم
در این صورت از قسمت مدیریت، بخش نمایش -> ویرایشگر پوسته می توانید فایل header.php قالب سایتتان را ویرایش کنید (این فایل ممکن است با توجه به ساختار قالب شما اسم دیگری داشته باشد)، در وردپرس برای بررسی ورود کاربر تابع is_user_logged_in کاربرد دارد، مثال:
<?php
if(is_user_logged_in()){
echo 'شما وارد سایت شده اید';
} else {
echo 'شما لاگین نکرده اید';
}
?>
نکته: لطفا قبل از هر گونه تغییری حتما از اطلاعات موجود پشتیبان داشته باشید.
hossein
۰۷:۲۶ ۱۴۰۲/۰۶/۰۹
سلام وقت شما بخیر باشه
ابتدا جا داره از شما تشکر کنم
میخوام یک آیکن لینک دار توی هدر سایتم را از دید مشتری و کاربران لاگین نکرده پنهان کنم و فقط برای فروشنده نمایش داده شود، یا اینکه هر وقت کاربر با نقش فروشنده لاگین کرد این آیکن ظاهر شود، هر کدام که بنظر شما ساده هست را اگه ممکنه راهنمایی بفرمایید در ضمن بنده دانش برنامه نویسی ندارم، اگه ممکنه ساده‌تر توضیح بدید ممنون میشم
خواهش، در مورد سوال قبل از هرچیز باید ببینیم از چه برنامه ای برای مدیریت سایتتان استفاده می کنید، چون بررسی اینکه کاربری وارد سیستم شده یا سطح دسترسی آن "فروشنده" است بین برنامه هایی مانند وردپرس، جوملا و... متفاوت است، در کل متاسفانه ایجاد این نوع تغییرات بدون آشنایی با برنامه نویسی PHP و نحوه ویرایش سورس کدها کار را سخت می کند.
علی رستگار
۲۰:۲۸ ۱۴۰۱/۱۱/۱۱
سلام خسته نباشید با تشکر از سایت خوبتون.
من میخوام منوی سایت رو به صورت کامل از دید گوگل مخفی کنم، در حال حاضر با دستورات CSS مثل:
display:none;
visibility: hidden;
clear: both;
position:absolute;
right:-9999px;
با اینها سعی کردم مخفیشون کنم ولی متاسفانه همچنان جواب نمیده و تو google search engine console تو قسمت test live page همون اول، نوشته های صفحه منو رو به صورت کاملا متنی میاره و همین مورد باعث شده که امتیاز سایت به خصوص تو mobile view شدیدا پایین بیاد.
چه پیشنهادی میدین برای این مشکل؟
برای مخفی کردن خروجی متنی از دید ربات گوگل روش CSS کاربردی ندارد چون ربات قبل از هر چیزی متن صفحه را صرف نظر از استایل آن پردازش می کند، برای عدم نمایش محتوا به موتورهای جستجو شیوه متداول بررسی اطلاعات واسط کاربری (User-Agent) با برنامه نویسی PHP است، به فرض:
<?php
if(!preg_match('/googlebot|-google/i', $_SERVER['HTTP_USER_AGENT'])) {
echo 'محتوایی که باید از دید ربات گوکل مخفی باشد';
}
?>
قاعدتا برای اعمال این شیوه باید سورس قسمت ایجاد محتوای برنامه CMS را ویرایش کنید که نیاز به آشنایی قبلی با PHP دارد.
نکته مهم: در تئوری گوگل ممکن است الگوریتم های خود را توسعه داده و با واسط کاربری دیگری به محتوای سایت دسترسی پیدا کند و در این حالت مخفی کردن خروجی برای ربات گوگل مخصوصا در مواردی که قسمت زیادی از محتوا پنهان می شود می تواند منجر به دریافت اخطار تقلب و در نهایت حذف سایت از لیست نتایج جستجو شود، در کل توصیه می شود بخش زیادی از محتوای سایت را با این شیوه از دید ربات مخفی نکنید و به اخطارهای احتمالی گوگل در کنسول وبمستر توجه داشته باشید.
اروین
۱۹:۱۲ ۱۴۰۱/۰۸/۲۶
من یک بلاک html رو از یک بخشی از سایت با روش display:none برداشتم. من میخوام این بخشی که برداشتم توی کامپیوتر و تبلت نمایش داده بشه ولی توی موبایل نمایش داده نشه. راهکارش چیه؟
برای انجام این کار با استایل CSS می توانید از مدیا کوئری استفاده کنید به فرض:
<style>
@media (min-width:640px) {
.class-name {
display:none;
}
}
</style>
این روش مبتنی بر عرض صفحه نمایش (عرض پنجره مرورگر) است و قاعدتا ممکن است کاملا دقیق نباشد.
مسعود مهمدی
۱۴:۰۰ ۱۴۰۱/۰۴/۰۹
سلام . یه سوال .. چجوری یه المان از قالب رو فقط توی حالت موبایل مخفی کنیم کلاس اون المان رو میدونم .. فقط چجوری براش تعریف کنم که تو یه نسخه موبایل مخفی بشه .. یعنی وقتی با موبایل وارد سایت شدیم مخفی باشه
اگر صرفا بخواهیم از CSS استفاده کنیم می توانیم با در نظر گرفتن media screen به صورت زیر المان را در صفحه نمایش های کوچکتر (نه صرفا موبایل) مخفی کنیم:
@media screen and (max-width: 768px) {
.class-name {
display: none;
}
}
این استایل در هر حالتی که عرض صفحه مرورگر از 768 کمتر باشد اعمال می شود، اگر بخواهیم دقیقا موبایل بودن وسیله کاربر را بررسی کنیم راهی جز استفاده از زبان های برنامه نویسی سمت سرور (مانند PHP) وجود ندارد.
آرش
۱۶:۳۴ ۱۴۰۰/۱۰/۲۸
با سلام
من میخام صفحه سایتم را برای دسکتاپ مخفی کنم و فقط برای موبایل قابل نمایش بشه بدون اینکه رو سئو تاثیری بذاره مثلا وقتی کاربر با کامپیوتر وارد سایت شد با ارور 403 مواجه بشه ولی وقتی با موبایل وارد میشه سایت نمایش داده بشه آیا راهی داره و اگر داره از چه کدی میتونم استفاده کنم؟
برای مخفی کردن محتوا در دستگاه های خاص باید ابتدا متد مد نظرتان را مشخص کنید چون شناسایی دستگاه دسکتاپ یا موبایل از طریق عرض صفحه نمایش (Viewport) یا از طریق بررسی واسط کاربری (User-Agent) ممکن است، حالت عرض صفحه نمایش با استفاده از CSS قابل انجام است به فرض اگر کد زیر را داشته باشیم:
<style>
.desktop {
display: block;
}
.mobile {
display: none;
}
@media (max-width: 760px) {
.desktop {
display: none;
}
.mobile {
display: block;
}
}
</style>
<p class="desktop">این متن فقط در دسکتاپ نمایش داده می شود</p>
<p class="mobile">این متن فقط در موبایل نمایش داده می شود</p>
در این روش که مبتنی بر عرض پنجره مرورگر است امکان تنظیم خطای 403 به صورت واقعی ممکن نیست و فقط می توانیم حالت نمایشی آن را داشته باشیم، اما در روش واسط کاربری کار حساس است و ممکن است به اشتباه ربات موتورهای جستجو یا دستگاه موبایلی را بلاک کنیم به همین دلیل توصیه می کنیم از کلاس های آماده یا کدهای تست شده استفاده کنید، نمونه ساده با برنامه نویسی PHP:
<?php
//تابع بررسی واسط کاربری و تشخیص موبایل از دسکتاپ
function isMobile() {
return preg_match("/(android|avantgo|blackberry|bolt|boost|cricket|docomo|fone|hiptop|mini|mobi|palm|phone|pie|tablet|up\.browser|up\.link|webos|wos)/i", $_SERVER["HTTP_USER_AGENT"]);
}

//موبایل
if(isMobile()){
echo 'این محتوا فقط در دستگاه های موبایل نمایش داده می شود';
} else {
//تنظیم خطای 403 برای دسکتاپ
header('HTTP/1.0 403 Forbidden');
}
?>
نکته مهم: استفاده از این موارد باید با دقت زیاد و آزمایش و خطای کافی صورت گیرد، در غیر اینصورت ممکن است مشکلات ناخواسته در ایندکس شدن صفحات سایت در موتورهای جستجو و مواردی از این دست در پی داشته باشد.
سپیده
۰۹:۴۴ ۱۴۰۰/۱۰/۲۳
سلام مجدد
لینک صفحه خدمت شما
https://bahrtahlil.com/my-account/edit-account/
ممنون میشم راهنمایی کنید کدی که توی پیام قبلی ارسال کردین رو کجا باید بگذارم؟
آدرسی که ارسال کرده اید نیاز به حساب کاربری جهت ورود دارد یعنی اگر وارد سایت نشده باشیم نمی توانیم به قسمت ویرایش حساب کاربری دسترسی داشته و تست و بررسی ها را در فیلد تغییر ایمیل انجام دهیم، در صورت تمایل و امکان می توانید اطلاعات یک اکانت موقت و آزمایشی را ارسال کنید تا امکان ورود و بررسی فراهم باشد، اگر هم صرفا یک نمونه کد نیاز دارید می توانیم برای فیلد ایمیل در حالت فعلی و وارد نشده به سایت هم تست ها را انجام دهیم؟
سپیده
۱۸:۱۸ ۱۴۰۰/۱۰/۲۲
سلام و درود
سایتم وردپرس هست و با المنتور طراحی کردم توی صفحه ویرایش حساب کاربران، میخوام فیلد تغییر آدرس ایمیل رو حذف کنم. با استفاده از اطلاعات سایت شما ( در قسمت css اضافی المنتور) کد زیر رو زدم. حذف شد اما اسکرول افقی ایجاد شده..
.woocommerce-Input--email {
position:absolute;
left:-9999px;
top:auto;
width:5px;
height:5px;
overflow:hidden;
}
لطفا منو راهنمایی کنید چطور این مشکل رو حل کنم؟
ممنونم
اگر آدرس URL یک نمونه صفحه را درج می کردید امکان بررسی و راهنمایی دقیق تر میسر می شد، در هر صورت معمولا برای رفع این مشکل باید عناصری که به صورت absolute با مقدار منفی هستند را داخل بلاک والد (به جز تگ body و html) با خاصیت position و مقدار relative داشته باشیم و از overflow با مقدار hidden برای تگ والد استفاده کنیم، به این صورت اسکرول افقی از بین می رود، نمونه ساختار:
<style>
#parent {
position: relative;
overflow: hidden;
}
#child {
position: absolute;
left: -9999px;
}
</style>
<div id="parent">
<div id="child">
</div>
</div>
۱۹:۲۲ ۱۴۰۰/۰۲/۲۹
چطوری یه عنصر رو در نسخه موبایل مخفی کنیم ولی در نسخه پی‌سی نمایش داده بشه؟
ساده ترین کار برای مخفی کردن عناصر در دستگاه های مختلف استفاده از media screen در CSS است، این امکان مبتنی بر اندازه صفحه نمایش است به فرض استایل CSS زیر فقط در دستگاهایی نمایش داده می شود که عرض آنها کمتر از 968 پیکسل باشد:
@media screen and (max-width: 968px) {
استایل ویژه موبایل
}
آرمان
۱۳:۵۴ ۱۳۹۹/۱۱/۲۱
سلام
در وردپرس اگر بخواهیم چیزی را مخفی کنیم می توان از این روش استفاده کرد؟
بله در کل تفاوتی وجود ندارد، منتها باید تغییرات را متناسب با خروجی HTML قالب یا پلاگین های وردپرس تنظیم کنید.
۰۰:۲۸ ۱۳۹۹/۰۶/۲۲
سلام اصلا نمی شه اینکارو انجام داد
برای مخفی کردن عنصر باید تگ مورد نظر کلاس یا آی دی داشته باشد، مثال:
<div class="hidden"></div>

<div id="visibility"></div>
در اینصورت استایل CSS بر روی آنها اعمال می شود، برای بررسی بیشتر در صورت تمایل می توانید مشکل را با جزئیات بیشتر مطرح کنید.
محمد
۱۲:۰۰ ۱۳۹۹/۰۵/۱۸
سلام اگر بخواهیم هدر سایت در گوشی های موبایل مخفی بشه از چه کدی باید استفاده کرد. کد زیر کلا مخفی میکنه در صورتیکه من فقط می خوام هدر گوشه های موبایل مخفی بشه
#header {
display:none;
}
#nav {
display:none;
}
ابتدا باید دو مبنای نمایشی برای قالبتان مد نظر داشته باشید:
- حالت دسکتاپ (صفحه نمایش های با عرض بزرگتر از یک مقدار ثابت به فرض 600 پیکسل)
- حالت موبایل (صفحه نمایش های با عرض کمتر از این مقدار)
سازگار کردن قالب برای این دو نسخه معمولا با خاصیت هایی مانند media screen قابل تنظیم است، به فرض می توانیم عرض 600 پیکسل را مبنای حالت موبایل قرار دهیم:
@media screen and (max-width: 600px) {
#header {
display:none;
}
#nav {
display:none;
}
}
این کدها فقط در مرورگرهایی اجرا می شوند که اندازه نمایش (Viewport) آنها به عرض 600 پیکسل یا کمتر باشد.
الهام
۱۵:۵۵ ۱۳۹۹/۰۵/۰۶
سلام یه سوال داشتم که هرچی سرچ کردم جوابش پیدا نشد
چجوری ادامه مطلب رو با کلیک روی کلمه مثلا بیشتر... ببینیم؟
یعنی اول نباشد بعد با کليک روی بیشتر نشان داده شود؟
برای این کار معمولا دو قسمت برای درج خلاصه محتوا و ادامه آن در برنامه های WYSIWYG در نظر می گیرند (این دو قسمت می توانند در یک ویرایشگر باشند و به فرض با یک تگ اختصاصی از هم تفکیک شوند یا اینکه در دو ویرایشگر مجزا درج شوند)، به این صورت در دیتابیس دو قسمت مجزا برای خلاصه و ادامه مطلب در دسترس است و می توانیم به نحو دلخواه شکل نمایش آن در سمت کاربر را طراحی کنیم، به فرض خلاصه محتوا در یک بلاک به صورت display با مقادیر block باشد و قسمت دیگر به صورت مخفی، با استفاده از جاوا اسکریپت و CSS دکمه ای به شکل نمونه زیر طراحی می کنیم:
<style>
#content {
display: none;
}
</style>
<script>
function toggleShowHide(id) {
var elm = document.getElementById(id);

if(elm.style.display !== 'block'){
elm.style.display = 'block';
} else{
elm.style.display = 'none';
}
}
</script>
<input type="button" value="Show/Hide More..." onclick="toggleShowHide('content');">
<div id="brief">خلاصه مطلب</div>
<div id="content">ادامه مطلب</div>
در صورت آشنایی با Ajax همین روش را می توان به سبک دیگری طراحی کرد.
ali
۱۸:۴۷ ۱۳۹۹/۰۴/۰۳
با سلام
من یک پروژه طراحی کردم میخوام که وقتی کاربر روی ادامه مطلب کلیک کرد در خود صفحه بقیه مطالب را ببینه باید چه دستوری را بنویسم؟
برای این منظور در کل دو راه حل وجود دارد، یا باید از جاوا اسکریپت استفاده و تابعی داشته باشیم که ادامه مطلب را که در یک بلاک div مخفی وجود دارد نمایش دهد، مثال:
<style>
#test {
display: none;
width: 50%;
padding: 8px;
text-align: center;
border: 1px solid #E5E5E5;
}
</style>
<script>
function readMore() {
var elm = document.getElementById('test');

if(elm.style.display === '' || elm.style.display === 'none') {
elm.style.display = 'block';
} else if(elm.style.display === 'block') {
elm.style.display = 'none';
}
}
</script>
<button onclick="readMore()">ادامه مطلب</button>
<div id="test">
متن مورد نظر
</div>
یا اینکه از تکنیک Ajax استفاده کنیم و با کلیک بر روی دکمه، درخواست به سرور ارسال و نتیجه را در یک بلاک div نمایش دهیم، برای این حالت نیاز است که آموزش های مقدماتی Ajax را مطالعه و با PHP و MySQL نیز آشنا باشیم.
۱۲:۳۹ ۱۳۹۹/۰۲/۲۲
با سلام
بنده میخواستم بدانم که میشود تگ div را با این روش ها پنهان کرد من میخواهم افزونه ی وردپرسی را که فارسی سازی کردم را کاملا بومی کنم. به این صورت که تگ div که rss سایت سازنده افزونه در آن نمایش داده میشود را مخفی کنم.
آیا میتوانم در همان فایل css ایی که برای راستچین کردن افزونه استفاده کردن را استفاده کنم. من تونستم نام تگ رو پیدا کنم ولی نتونستم با ویرایش کدهای افزونه اون رو مخفی کنم (چون جایی رو ندیدم که پاک کنم)
لطفا نمونه سورس برای این کار رو بگذارید
خیلی ممنون
بله در صورتی که تگ اصلی را پیدا کنید با استایل خطی یا نسبت دادن کلاس می توانید عناصر HTML را با CSS مخفی کنید، مثال:
<style>
.hidden{
display: none;
}
</style>
<div class="hidden"></div>
دقت کنید که استایل CSS باید در خروجی HTML صفحه وجود داشته باشد و قوانین آن با استایل دیگری در همان صفحه تداخل نداشته باشد.
more لطفا پیش از ارسال دیدگاه نکات زیر را مد نظر داشته باشید:
- به سوالات کلی، زمانبر، مبهم و مشکلاتی که تلاشی برای رفع آنها نکرده باشید پاسخ مختصر داده شده یا به بخش برنامه نویسی اختصاصی ارجاع داده می شوند.
- کدها و اسکریپت های طولانی را ترجیحا در یک صفحه وب آنلاین یا به صورت حساب موقت و آزمایشی قرار دهید تا امکان بررسی دقیق مشکل و خطایابی میسر باشد.
- تمام دیدگاه های ارسالی خوانده شده و برای هر کاربر مدت زمان لازم جهت پاسخگویی در نظر گرفته می شود، لطفا از طرح سوالات متعدد در بازه زمانی کوتاه خودداری کنید.



 refresh
10 × 10
2 × 4
20 × 20
=