span چیست؟

[kh1387]

با سلام
وب سایتی رو دیدم که در قسمت masterPage برای ایجاد منو (menu) از span استفاده کرده بود.
کسی از دوستان می دونه این چیه و چطوری از اون می تونیم استفاده کنیم؟
با تشکر

[sedamorde]

دوست عزیز برای منو نمیدونم دقیقا چطوری span استفاده میشه. اما span معمولا برای تایین یک کلاس برای جز کوچک استفاده میشه (حداقل من باهاش اینکار رو میکنم) مثلا برای تایین رنگ یک کلمه در یک جمله :

This <span class="red">is</span> html

[kh1387]

اگه ممکنه می شه یه مثال بنویسید برای نوشتن span?

[sedamorde]

دوست عزیز من برات مثال نوشتم :

This <span class="small">is</span> html

یا


This <span style="color:#F00;">is</span> html

[kh1387]

معذرت می خوام این کد ها رو باید در کدوم قسمت نوشت؟

[salehbagheri]

معذرت می خوام این کد ها رو باید در کدوم قسمت نوشت؟

شما كدهاتون رو كجا مينويسيد؟ اين رو هم همون جا (برحسب نياز) بنويسيد!

اين هم خروجي كدهاي دوست عزيز SedaMorde :

This is Html
This is Html

[kh1387]

شما كدهاتون رو كجا مينويسيد؟ اين رو هم همون جا (برحسب نياز) بنويسيد!

اين هم خروجي كدهاي دوست عزيز SedaMorde :

This is Html
This is Html
به عنوان یک style بنویسم؟
در تگهای مختلف بنویسم؟

[rostamiani]

Span تگی هست که خودش هیچ کاری انجام نمی ده.فقط یک قسمت از صفحه رو از بقیه جدا می کنه تا بتونیم به اون قسمت ویژگی هایی رو نسبت بدیم. مشابه div:
اینم کاربرد Span در سایت مرجع sitepoint.com

http://reference.sitepoint.com/html/span

[rostamiani]

به عنوان یک style بنویسم؟
در تگهای مختلف بنویسم؟

شما می تونید هر متن یا تگ دیگه ای رو داخل span بزارین
هر Style یا نام کلاسی هم که خواستین ،می تونید بهش بدید :لبخند:

مثلا :

<span class="highlight" style="color=#FF0000"><a href="http://yahoo.com">Click here :D</a></span>

[امید امرایی]

و در تکمیل صحبت دوستان :
معنای Span در واقع یعنی یک محدوده خاص. به نوعی span یک محدوده خاص از یک سورس HTML رو شامل می شه که می تونه به صورت مستقل عمل کنه .

[__ziXet__]

خود span نمیتونه تبدیل به یه منوی جذاب بشه! برنامه نویس از span به عنوان دو تا تگ برای ذخیره کردن استفاده کرده و جاوااسکریپت هست که عناصر و ویژگی های دیگه رو به span اضافه میکنه و اونو به صورت یه منو درمیاره!

[reza10wert]

دوست عزیز من برات مثال نوشتم :

This <span class="small">is</span> html

یا


This <span style="color:#F00;">is</span> html

خوب مثلا فرقش با این کد چیه ؟

This <h1 style="color:red;">IS</h1> Html

[MMSHFE]

دوست عزیز، span و سایر تگهای مشابه مثل div و... برای متمایزکردن یک بخش از صفحه و قراردادن اون در یک محدوده بکار میرن تا بعداً با استفاده از CSS و Javascript بتونیم کارهای دلخواه رو با اون بخش انجام بدیم. حالا بعضی از این تگهای ایجاد محدوده مثل div بصورت بلوکی هستن یعنی متن قبل و بعدش شکسته میشه. برخی هم مثل span از نوع in-line هستن و وقتی توی یک سطر، بخشی از اون رو داخل span بگذاریم، متن قبل و بعدش شکسته نمیشه. برخلاف تگهایی مثل h1 و...، این تگها (div و span) ظاهر محتوای خودشون رو تغییر نمیدن و فقط اون رو متمایز میکنن (ازنظر کد، نه ازنظر ظاهری) تا بعداً همونطور که گفتم، درصورت تمایل بتونیم با CSS و JS کارهای دلخواه رو با اون بخش انجام بدیم. البته برای اینکه بتونیم روی این بخشها کار کنیم باید به اونها خصوصیاتی مثل class یا id بدیم (که البته استفاده از id در جاوا اسکریپت مرسوم تره). موفق باشید.

[boy24iran]

سلام
چه طور می شه چند کلمه رو پشته سر هم نوشت مثلاً
پشت پشت پشت پشت
لطفاً بگید که با چه تگهایی می شه نوشت و کدوم مرسوم تر است

[tamafi6]

اینجارانگاه کن


<section class="rw-wrapper">
<h2 class="rw-sentence">
<div class="rw-words rw-words-1">
<span>HTML5&amp;CSS3</span>
<span>ارایه برنامه های جالب</span>
<span>تاثیرگذاری بالا</span>
<span>شناورسازی طرح ها</span>
<span>ابزارباورنکردنی</span>
<span>هوشمندی کدها</span>
</div>
</h2>
</section>

واینجا


.rw-words span:nth-child(1) {
-webkit-animation-delay: 10s;
-moz-animation-delay: 10s;
animation-delay: 10s;
}
.rw-words span:nth-child(2) {
-webkit-animation-delay: 15s;
-moz-animation-delay: 15s;
animation-delay: 15s;
}
.rw-words span:nth-child(3) {
-webkit-animation-delay: 20s;
-moz-animation-delay: 20s;
animation-delay: 20s;
}
.rw-words span:nth-child(4) {
-webkit-animation-delay: 25s;
-moz-animation-delay: 25s;
animation-delay: 25s;
}
.rw-words span:nth-child(5) {
-webkit-animation-delay: 30s;
-moz-animation-delay: 30s;
animation-delay: 30s;
}
.rw-words span:nth-child(6) {
-webkit-animation-delay: 35s;
-moz-animation-delay: 35s;
animation-delay: 35s;
}

نمونه هدربالامیتونی ببینی بعداز10ثانیه فعال میشه
http://pacifist.site88.net/form/form.html