ویکیکتاب
fawikibooks
https://fa.wikibooks.org/wiki/%D8%B5%D9%81%D8%AD%D9%87%D9%94_%D8%A7%D8%B5%D9%84%DB%8C
MediaWiki 1.45.0-wmf.8
first-letter
مدیا
ویژه
بحث
کاربر
بحث کاربر
ویکیکتاب
بحث ویکیکتاب
پرونده
بحث پرونده
مدیاویکی
بحث مدیاویکی
الگو
بحث الگو
راهنما
بحث راهنما
رده
بحث رده
کتابآشپزی
بحث کتابآشپزی
ویکیکودک
بحث ویکیکودک
موضوع
بحث موضوع
TimedText
TimedText talk
پودمان
بحث پودمان
بحث کاربر:Doostdar
3
38851
132016
132002
2025-07-02T19:28:48Z
Fwldom
26269
/* کتاب اچ تی ام ال و سی اس اس */ پاسخ
132016
wikitext
text/x-wiki
{{کاربر:Doostdar/up}}
<div style="float:left;">
{{جعبه بایگانی|
[[/بایگانی۱|بایگانی۱]]{{سخ}}
[[/بایگانی۲|بایگانی۲]]{{سخ}}
[[/بایگانی۳|بایگانی۳]]{{سخ}}
[[/بایگانی۴|بایگانی۴]]{{سخ}}
[[/بایگانی۵|بایگانی۵]]{{سخ}}
[[/بایگانی۶|بایگانی۶]]{{سخ}}
[[/بایگانی۷|بایگانی۷]]{{سخ}}
[[/بایگانی۸|بایگانی۸]]{{سخ}}
[[/بایگانی۹|بایگانی۹]]{{سخ}}
[[/بایگانی۱۰|بایگانی۱۰]]{{سخ}}
[[/بایگانی۱۱|بایگانی۱۱]]{{سخ}}
}}
</div>
== سلام ==
برای ساختن کتابی در مورد ''زبان سیلهتی'' به کمک شما نیاز دارم. ما این کتاب را به تمام زبان های مهم نوشته ایم. چرا به فارسی نه؟ اگر به ما در ایجاد خرد (stub) کمک کنید، کاربران بعدی میتوانند اطلاعات بیشتری اضافه کنند. این زبان پس از اینکه با فارسی مرتبط است، از کلمات فارسی زیادی استفاده می کند. این یک کتاب عالی خواهد بود. ما به کمک شما نیاز.[[d:Q2044560]] --[[کاربر:ꠢꠣꠍꠘ ꠞꠣꠎꠣ|ꠢꠣꠍꠘ ꠞꠣꠎꠣ]] ([[بحث کاربر:ꠢꠣꠍꠘ ꠞꠣꠎꠣ|بحث]]) ۲۲ ژانویهٔ ۲۰۲۴، ساعت ۰۱:۴۴ (UTC)
:{{چپچین}}
Many native speakers consider Sylheti to be a slang or corrupt version of Standard Bengali and not an independent language; and there is a reported language shift to Standard Bengali. Sylheti currently does not have a standardised writing system. Historically in the Sylhet region, the Sylheti Nagri script was used alongside the Bengali script. The New Testament in Sylheti was published in the Sylhet Nagri script along with versions in the Latin and in the Bengali–Assamese script, in 2014. Hence, Sylheti doesn't have a certain script for its texts. Sylheti is related to languages like Bhili, Awadhi, Punjabi, Assamese and Bengali. So it may not be a known language for Persian speakers and doesn't have a stable spelling for words when written causing that we prevent you from making a book on Sylheti in Persian Wikibooks. --[[کاربر:Doostdar|دوستدار ایران بزرگ]] [[بحث کاربر:Doostdar|☎]] دوشنبه،۲ بهمن ۱۴۰۲، ساعت ۲۲:۳۴ (ایران) ۲۲ ژانویهٔ ۲۰۲۴، ساعت ۱۹:۰۴ (UTC)
Thanks for your explanation, but it is not logical, you can discuss this in the Wikipedia article or Wikibooks but because of your "Poin of View" you should not delete it. There are books in many languages including [[b:bn:সিলেটি ভাষা শিক্ষা]], [[b:en:Sylheti]].
From your explanation it seems to me you have misused SysOp tools because of your point of view not because of any Deletion policy. For now, I leave it here but in future I will consult with a steward whether you action was misuse of SysOp tools or not. Thank you. --[[کاربر:ꠢꠣꠍꠘ ꠞꠣꠎꠣ|ꠢꠣꠍꠘ ꠞꠣꠎꠣ]] ([[بحث کاربر:ꠢꠣꠍꠘ ꠞꠣꠎꠣ|بحث]])
{{پایان چپچین}}
== کمک ==
سلام. لطفاً توضیحی جامع در مورد ویکیکتاب بدهید. باتشکر. [[کاربر:W7070|W7070]] ([[بحث کاربر:W7070|بحث]]) ۱۶ فوریهٔ ۲۰۲۴، ساعت ۲۲:۰۸ (UTC)
== پرسش ==
چگونه می توان در اینجا مدیر شد ؟ [[کاربر:Artin karimian|Artin karimian]] ([[بحث کاربر:Artin karimian|بحث]]) ۱۷ فوریهٔ ۲۰۲۴، ساعت ۱۵:۵۲ (UTC)
:با ویرایش بیشتر و ایجاد کتاب های مفید. پس از گذشت زمانی بیش از یک سال از حضور شما در این وبگاه، با نظر کاربران برای مدیر شدن درخواست بدید. [[کاربر:Doostdar|دوستدار ایران بزرگ]] [[بحث کاربر:Doostdar|☎]] چهارشنبه،۲ اسفند ۱۴۰۲، ساعت ۰۰:۵۷ (ایران) ۲۰ فوریهٔ ۲۰۲۴، ساعت ۲۱:۲۷ (UTC)
== تشکر از اعطای دسترسی ==
اینجانب ([[کاربر:Fwldom|Fwldom]]) از مدیر ویکی نسک [[کاربر:Doostdar|(دوستدار]]) بابت اعطای دسترسی "گشت خودکار" در ویکی نسک از بنیاد ویکی مدیا سپاسگزارم.
همواره تلاش خود را برای گسترش ویکی نسک ادامه خواهم داد. [[کاربر:Fwldom|Fwldom]] ([[بحث کاربر:Fwldom|بحث]]) ۲۴ فوریهٔ ۲۰۲۴، ساعت ۱۹:۱۰ (UTC)
== پرسش ==
درود. چرا بحث را واگردانی میکنید؟ [[کاربر:W7070|W7070]] ([[بحث کاربر:W7070|بحث]]) ۲۹ فوریهٔ ۲۰۲۴، ساعت ۰۹:۲۶ (UTC)
:بحث ها را باید در میز تحریر انجام دهید کما اینکه در ویکیپدیا هم چند قهوهخانه مختلف وجود دارد. هر بحثی رو در یک قهوهخانه انجام میدن مثل گوناگون، فنی، ... [[کاربر:Doostdar|دوستدار ایران بزرگ]] [[بحث کاربر:Doostdar|☎]] پنجشنبه،۱۰ اسفند ۱۴۰۲، ساعت ۱۳:۰۲ (ایران) ۲۹ فوریهٔ ۲۰۲۴، ساعت ۰۹:۳۲ (UTC)
::نه. چون بحث مربوط به میز تحریر بود در آنجا مطرح نمودم. [[کاربر:W7070|W7070]] ([[بحث کاربر:W7070|بحث]]) ۲۹ فوریهٔ ۲۰۲۴، ساعت ۰۹:۳۴ (UTC)
:::جالبه بدونید در ویکیپدیای انگلیسی چیزی به نام قهوهخانه نداریم و این یک ابتکار در ویکیپدیای فارسی بوده! در ویکیپدیا village pump داریم. در ویکیکتاب انگلیسی هم با عناوین دیگری برای مکان بحث جامعه کاربری رو به رو هستیم. Bulletin Board یا تابلوی اعلانات! در کنارش یک reading room هم دارند. در ویکیکتاب فارسی هم میز تحریر داریم. --[[کاربر:Doostdar|دوستدار ایران بزرگ]] [[بحث کاربر:Doostdar|☎]] پنجشنبه،۱۰ اسفند ۱۴۰۲، ساعت ۱۳:۱۳ (ایران) ۲۹ فوریهٔ ۲۰۲۴، ساعت ۰۹:۴۳ (UTC)
::::ممنون از توضیحات. اما بهتر بود پیامم را واگردانی نمیکردید چون مصداقی از [[ویکیکتاب:واگردانان#چه هنگامی میتوان دسترسی واگردانی را بهکار برد؟|این]] نبود. [[کاربر:W7070|W7070]] ([[بحث کاربر:W7070|بحث]]) ۲۹ فوریهٔ ۲۰۲۴، ساعت ۰۹:۴۵ (UTC)
== ویرایشگر دیداری ==
درود. چرا اینجا ویرایشگر دیداری ندارد؟ آیا شما میتوانید آنرا فعال کنید؟ [[کاربر:W7070|W7070]] ([[بحث کاربر:W7070|بحث]]) ۲۹ فوریهٔ ۲۰۲۴، ساعت ۱۰:۳۶ (UTC)
:از ترجیحات فعال کنید. اینجا همه چیز دارد. [[کاربر:Doostdar|دوستدار ایران بزرگ]] [[بحث کاربر:Doostdar|☎]] پنجشنبه،۱۰ اسفند ۱۴۰۲، ساعت ۱۴:۰۸ (ایران) ۲۹ فوریهٔ ۲۰۲۴، ساعت ۱۰:۳۸ (UTC)
== پرسش ==
درود جناب دوستدار ایران بزرگ. آیا باید برای مطالبی که مینویسیم منبع بیاوریم؟ خیلی از کتابها را میبینم منبع ندارند. [[کاربر:W7070|W7070]] ([[بحث کاربر:W7070|بحث]]) ۲۲ مارس ۲۰۲۴، ساعت ۲۲:۳۴ (UTC)
:درود. در بیشتر موارد نیاز به منبع هست. کمکاری کاربران هست تقصیر من نیست. [[کاربر:Doostdar|دوستدار ایران بزرگ]] [[بحث کاربر:Doostdar|☎]] شنبه،۴ فروردین ۱۴۰۳، ساعت ۲۳:۳۸ (ایران) ۲۳ مارس ۲۰۲۴، ساعت ۱۹:۰۸ (UTC)
== کامل شدن کتاب آموزش کامل خط فرمان ویندوز ==
درود بر شما دوستدار ایران بزرگ
کتاب [[آموزش کامل خط فرمان ویندوز]] تکمیل شده است و آخرین بروزرسانی انتشار پیدا کرده است.
خواهشمندم کتاب را از لیست کتاب های در دست ویرایش و کتاب های سخت در دست ویرایش و ... بردارید.
لازم به ذکر است کتاب [[مبانی شبکههای کامپیوتری و سختافزار|مبانی شبکههای کامپیوتری و سخت افزار]] هم به زودی تکمیل میشود.
با سپاس بدرود. [[کاربر:Fwldom|Fwldom]] ([[بحث کاربر:Fwldom|بحث]]) ۳ آوریل ۲۰۲۴، ساعت ۱۹:۴۹ (UTC)
:درود. کتاب آموزش خط فرمان رو خوندم. به نظرم ارتباط مسائل رو با هم خوب توضیح نداده و خواننده رو میتونه به راحتی گیج کنه! ارتباط با پاورشل با سی ام دی چیست؟ در [[آموزش کامل خط فرمان ویندوز/شخصی سازی محیط خط فرمان|این صفحه]] مراحل تغییر فون هنوز کامل نیست و [[آموزش کامل خط فرمان ویندوز/آشنایی با خط فرمان و دستورات پایه آن|در این صفحه]] بخش «پیوستهای اضافه» خالی است! [[کاربر:Doostdar|دوستدار ایران بزرگ]] [[بحث کاربر:Doostdar|☎]] پنجشنبه،۱۶ فروردین ۱۴۰۳، ساعت ۱۱:۰۴ (ایران) ۴ آوریل ۲۰۲۴، ساعت ۰۶:۳۴ (UTC)
::ببخشید حواسم نبود این ها را هم بزودی کامل میکنم
::با سپاس [[کاربر:Fwldom|Fwldom]] ([[بحث کاربر:Fwldom|بحث]]) ۴ آوریل ۲۰۲۴، ساعت ۱۲:۱۸ (UTC)
::هر دو رابط خط فرمان (CLI) هستند که برای تعامل با سیستم عامل ویندوز استفاده می شوند.
::هر دو می توانند برای اجرای دستورات، اسکریپت ها و برنامه ها استفاده شوند.
::هر دو از دستورات مشابهی برای کار با فایل ها، پوشه ها، فرآیندها و رجیستری ویندوز استفاده می کنند.
::با سپاس از شما [[کاربر:Fwldom|Fwldom]] ([[بحث کاربر:Fwldom|بحث]]) ۴ آوریل ۲۰۲۴، ساعت ۱۲:۳۸ (UTC)
== در مورد کتاب آموزش کامل خط فرمان ویندوز ==
درود
میخواستم ببینم میشه نام کاربری خودم را در اول [[آموزش کامل خط فرمان ویندوز|کتاب]] اضافه سپس
از انتخابتون و برگزیدن کتاب برای صفحه اصلی سپاسگزارم و اینکه در توضیحات کلمه آموزش را به اشتباه آموزسش نوشتید لطفا اصلاح بفرمایید.
با سپاس بیکران. [[کاربر:Fwldom|Fwldom]] ([[بحث کاربر:Fwldom|بحث]]) ۵ آوریل ۲۰۲۴، ساعت ۲۲:۴۶ (UTC)
:هنوز تصمیمی گرفته نشده ممکن هست تمام کتاب ها دارای نام نویسنده بشوند یا همه نام های نویسندها حذف شود. [[کاربر:Doostdar|دوستدار ایران بزرگ]] [[بحث کاربر:Doostdar|☎]] شنبه،۱۸ فروردین ۱۴۰۳، ساعت ۰۳:۲۱ (ایران) ۵ آوریل ۲۰۲۴، ساعت ۲۲:۵۱ (UTC)
== الگوهای کاربر ==
سلام. لطفاً بگزارید کاربران خودشان به صفحه کاربریشان الگوهای کاربر را اضافه کنند. [[کاربر:W7070|W7070]] ([[بحث کاربر:W7070|بحث]]) ۸ مهٔ ۲۰۲۴، ساعت ۱۰:۲۵ (UTC)
:کاربری که [https://fa.wikibooks.org/w/index.php?title=%DA%A9%D8%A7%D8%B1%D8%A8%D8%B1%3AFaezeh_javadi&diff=127391&oldid=127385 این متن های بی سر و ته کپیبرداری شده از ویکیپدیای فارسی] رو در صفحه کاربریش مینویسه ([https://fa.wikibooks.org/w/index.php?title=%DA%A9%D8%A7%D8%B1%D8%A8%D8%B1%3AMh.rreli&diff=127383&oldid=127382 این هم یک نمونه دیگر]) چه الگویی ممکنه به صفحه کاربری خودش اضافه کنه؟ صفحه کاربری برای تبلیغ کالا و خدمات نیست و حتی در بسیاری از موارد باید نام های کاربری نامناسب رو حذف کنیم ولی به دلیل کوچک بودن ویکیکتاب در حال حاضر فرصت چندانی برای حذف کاربران خرابکاری که معمولا ویرایش در صفحه های فضای نام اصلی ندارند نداریم. حداقل کاری که میتونیم براشون انجام بدیم همین اضافه کردن یک الگوی کاربری هست تا همه متوجه شوند دارند یک صفحه کاربری میخوانند. [[کاربر:Doostdar|دوستدار ایران بزرگ]] [[بحث کاربر:Doostdar|☎]] پنجشنبه،۲۰ اردیبهشت ۱۴۰۳، ساعت ۰۱:۴۵ (ایران) ۸ مهٔ ۲۰۲۴، ساعت ۲۱:۱۵ (UTC)
== We tried to reach you... ==
Hi Doostdar, my apologies for posting in english.
You registered interest in participating in a research interview with us, the [[m:WIT|Wikidata Integrations Team]]. We tried emailing you to schedule an interview but sadly the email bounced due to an incorrect email address. We just wanted to get in touch to see if you would still like to speak with us, sadly we cannot offer compensation for your time and we completely understand if you decide not to based on these new circumstances, however if you would like to donate your time, please feel free to reply to me on my [[m:User_Talk:Danny_Benjafield_(WMDE)|User Talk]] page to discuss how to receive the invitation link privately. Kind regards, -[[کاربر:Danny Benjafield (WMDE)|Danny Benjafield (WMDE)]] ([[بحث کاربر:Danny Benjafield (WMDE)|بحث]]) ۱۳ مهٔ ۲۰۲۴، ساعت ۱۳:۵۳ (UTC)
== درخواست دسترسی معافیت از قطع دسترسی آیپی ==
درود
بنده درخواست معافیت از قطع دسترسی آیپی دارم به دلیل فیلترنت در ایران و استفاده از سرویس های دور زدن سانسور.
با سپاس [[کاربر:Fwldom|Fwldom]] ([[بحث کاربر:Fwldom|بحث]]) ۱۴ مهٔ ۲۰۲۴، ساعت ۰۸:۲۷ (UTC)
:درود. از [[کاربر:Huji]] درخواست کنید. [[کاربر:Doostdar|دوستدار ایران بزرگ]] [[بحث کاربر:Doostdar|☎]] سهشنبه،۲۵ اردیبهشت ۱۴۰۳، ساعت ۱۶:۱۱ (ایران) ۱۴ مهٔ ۲۰۲۴، ساعت ۱۱:۴۱ (UTC)
::درود. کاربر:Huji در اینجا دسترسی مدیریتی ندارد؛ بنابراین نمیتواند به کاربر دسترسی «دسترسی معافیت از قطع دسترسی آیپی» را بدهد. [[کاربر:W7070|W7070]] ([[بحث کاربر:W7070|بحث]]) ۱۸ مهٔ ۲۰۲۴، ساعت ۱۴:۲۱ (UTC)
:::در این مورد اطلاع ندارم. [[کاربر:Doostdar|دوستدار ایران بزرگ]] [[بحث کاربر:Doostdar|☎]] یکشنبه،۳۰ اردیبهشت ۱۴۰۳، ساعت ۰۰:۳۳ (ایران) ۱۸ مهٔ ۲۰۲۴، ساعت ۲۰:۰۳ (UTC)
== نام این وبگاه ==
درود. نام اینجا ویکینسک است یا ویکیکتاب؟ اگر ویکینسک است و سابقاً ویکیکتاب بوده، چه زمان این اجماع صورت گرفته؟ اگر «ویکینسک» نام درستش است؛ مایلم تا سایر بخشها را به نام درستشان برگردانم. [[کاربر:Amiria703|Amiria703]] ([[بحث کاربر:Amiria703|بحث]]) ۱۸ مهٔ ۲۰۲۴، ساعت ۰۲:۱۳ (UTC)
:درود. بررسی کردم شما هیچ ویرایشی تا کنون در این وبگاه نداشتهاید. از کی با این وبگاه آشنا شدید؟ [[کاربر:Doostdar|دوستدار ایران بزرگ]] [[بحث کاربر:Doostdar|☎]] یکشنبه،۳۰ اردیبهشت ۱۴۰۳، ساعت ۰۰:۴۳ (ایران) ۱۸ مهٔ ۲۰۲۴، ساعت ۲۰:۱۳ (UTC)
== GFDL ==
Hi! Why did you remove my message [[Special:Diff/128093]]? --[[کاربر:MGA73|MGA73]] ([[بحث کاربر:MGA73|بحث]]) ۲۷ ژوئن ۲۰۲۴، ساعت ۱۸:۴۹ (UTC)
:Hi dear. Reading room is for users of this Wiki. English messages are all spams and not useful for our local community. [[کاربر:Doostdar|دوستدار ایران بزرگ]] [[بحث کاربر:Doostdar|☎]] جمعه،۸ تیر ۱۴۰۳، ساعت ۱۰:۰۳ (ایران) ۲۸ ژوئن ۲۰۲۴، ساعت ۰۵:۳۳ (UTC)
Well okay. So here is a little more "spam" about update of [[مدیاویکی:Licenses]]. The latest version of Creative Commons is 4.0 so I suggest to update the page to use that. Also GFDL is not a good license for media files so it should be removed. I hope you will concider that suggestion even if it is in English. --[[کاربر:MGA73|MGA73]] ([[بحث کاربر:MGA73|بحث]]) ۲۸ ژوئیهٔ ۲۰۲۴، ساعت ۱۵:۴۳ (UTC)
:{{شد}} [[کاربر:Doostdar|دوستدار ایران بزرگ]] [[بحث کاربر:Doostdar|☎]] یکشنبه،۷ مرداد ۱۴۰۳، ساعت ۲۱:۵۴ (ایران) ۲۸ ژوئیهٔ ۲۰۲۴، ساعت ۱۷:۲۴ (UTC)
Hello!
[[مدیاویکی:Licenses]] include these 2 lines:
** مجوز گنو-خود|پرونده خلقشده توسط بارگذار و انتشار تحت GFDL
** مجوز گنو|انتشار تحت GFDL (منبع حتماً ذکر شود)
GFDL is not a good license for media files per [[:File:BD-propagande colour en.jpg]]. So the best would be to remove them. It will not affect files already uploaded.
The second best would be to make it a dual license with both GFDL and Cc-by-sa-4.0.
[[Template:مجوز گنو-خود]] also include cc-by-sa-3.0. I do not think it is a good idea to do it like that because the uploader specifically agree to GFDL. If it is meant to include both licenses then it should be written at [[مدیاویکی:Licenses]] and the template should be named “Dual license” or another suitable name.
If it is meant like [[:w:الگو:GFDL-self]] then it should be made clear that it is a part of the [[:w:en:Wikipedia:Image license migration]].
There are only 90 files in [[:رده:تصویرهای_تحت_گنو]] so I can help fix it. But it would be easier if you delete all the unused files first ([[Special:UnusedFiles]]).
I can also help set up [[:mw:Help:Extension:FileImporter]] so it is easy to move the good files to Commons. The easiest way is to copy [[:mw:Extension:FileImporter/Data/fa.wikipedia]] and modify that. --[[کاربر:MGA73|MGA73]] ([[بحث کاربر:MGA73|بحث]]) ۳۱ اوت ۲۰۲۴، ساعت ۱۲:۵۰ (UTC)
Hello again!
It will also help if files that are also on Commons are deleted. But the files on [[ویکیکتاب:امکانات ویراستاری]] and similar may be used in scripts that needs to be changed before deletion. Example [[کاربر:Komeil 4life/BMonobook.js]] that mention [[:پرونده:Button insert table.png]].
You can see the files in [[:رده:همه پروندههای ویکیپدیا با نام مشابه در انبار ویکیمدیا]] and [[:رده:همه پروندههای ویکیپدیا با نام متفاوت در انبار ویکیمدیا]]. I copied the names from fa.wikipedia but you are of course very welcome to change them if they are not good.
--[[کاربر:MGA73|MGA73]] ([[بحث کاربر:MGA73|بحث]]) ۵ سپتامبر ۲۰۲۴، ساعت ۱۵:۱۷ (UTC)
== رای دادن به درخواست مدیریت جدید ==
درود،
از شما تقاضا دارم موافق بودن یا موافق نبودن با درخواست مدیریت بنده رو در صفحه [https://fa.wikibooks.org/w/index.php?oldid=128713#%D8%AF%D8%B1%D8%AE%D9%88%D8%A7%D8%B3%D8%AA_%D9%85%D8%AF%DB%8C%D8%B1_%D8%B4%D8%AF%D9%86%D8%8C_Fwldom ویکیکتاب:درخواستهای مدیر شدن - ویکیکتاب (wikibooks.org)] اعلام کنید.
با سپاس [[کاربر:Fwldom|Fwldom]] ([[بحث کاربر:Fwldom|بحث]]) ۱۲ اوت ۲۰۲۴، ساعت ۲۲:۳۵ (UTC)
== کتاب مبانی شبکههای کامپیوتری و سخت افزار ==
درود بر جناب دوستدار ایران بزرگ.
کتاب [[مبانی شبکههای کامپیوتری و سختافزار|مبانی شبکههای کامپیوتری و سخت افزار]] تقریبا تکمیل شد.
لطف کنید این کتاب رو یک بررسی بکنید و اشکلات آن را رفع کنید و آن را در نظرسنجی برای برگزیده و خوبیده شدن بگذارید.
همچنین صفحه بحث من خیلی شلوغ شده چگونه میتوانم تعدادی از آن ها را بایگانی کنم؟
باسپاس بيکران [[کاربر:Fwldom|Fwldom]] ([[بحث کاربر:Fwldom|بحث]]) ۲۱ اوت ۲۰۲۴، ساعت ۲۲:۳۲ (UTC)
:درود. برای بایگانی از ابتدا از گزینه انتقال استفاده کنیذ کهدر بالای صفحه و حود دار د.
== نظر خواهی نویسنده کتاب و کامل شدن کتاب پی اچ پی و برنامه نویسی psp ==
درود بر جناب دوستدار ایران بزرگ.
نخست:
کتاب های [[پیاچپی|پی اچ پی]] و [[برنامه نویسی PSP|آموزش برنامه نویسی psp]] را تکمیل کردم لطفا کار های تکمیلی را انجام دهید.
دوم:
چرا در مورد نظرسنجی [[ویکیکتاب:نظرخواهی/نویسنده کتاب]] تصمیم گیری نمیکنید؟
گویا بیشتر کاربران نظر موافق رو دادند و این طرح میتونه کمک زیادی به ویکی کتاب بکنه.
باسپاس بیکران [[کاربر:Fwldom|Fwldom]] ([[بحث کاربر:Fwldom|بحث]]) ۲۴ اوت ۲۰۲۴، ساعت ۱۰:۵۳ (UTC)
:بنظرم بهتر است این نظرسنجی رو برای چند روز در صفحه اصلی قرار دهیم و بعد ورداریم [[کاربر:Fwldom|Fwldom]] ([[بحث کاربر:Fwldom|بحث]]) ۲۴ اوت ۲۰۲۴، ساعت ۱۳:۰۹ (UTC)
::{{شد}} --[[کاربر:Doostdar|دوستدار ایران بزرگ]] [[بحث کاربر:Doostdar|☎]] یکشنبه،۴ شهریور ۱۴۰۳، ساعت ۰۴:۰۴ (ایران) ۲۴ اوت ۲۰۲۴، ساعت ۲۳:۳۴ (UTC)
== بیستمین سالگرد ویکی کتاب ==
درود امروز 3 شهریور سالگرد ویکی کتاب است آیا برنامهای برای آن دارید؟
میتوانیم محتوای صفحه اصلی را برای سالگرد 20 سالگی به مدت چند روز تغییر دهیم یا نماد ویکی کتاب را برای چند روز تغییر دهیم.
بیستمین سالگرد ویکی کتاب مبارک. [[کاربر:Fwldom|Fwldom]] ([[بحث کاربر:Fwldom|بحث]]) ۲۴ اوت ۲۰۲۴، ساعت ۱۴:۰۳ (UTC)
:درود. برنامهای ندارم تنها صفحهای برای بزرگداشت بیست سالگی ویکیکتاب آماده کردهام. چون کاربرها زیاد نیستند نمیتونیم کاری کنیم و نشانواره هم کسی آماده نکرد. [[کاربر:Doostdar|دوستدار ایران بزرگ]] [[بحث کاربر:Doostdar|☎]] یکشنبه،۴ شهریور ۱۴۰۳، ساعت ۰۳:۵۳ (ایران) ۲۴ اوت ۲۰۲۴، ساعت ۲۳:۲۳ (UTC)
::👍 [[کاربر:Fwldom|Fwldom]] ([[بحث کاربر:Fwldom|بحث]]) ۲۵ اوت ۲۰۲۴، ساعت ۱۰:۴۱ (UTC)
== پیشنهاد نشانواره ==
درود من در این صفحه [[ویکیکتاب:ستاد برگزاری بیستمین سالگرد ویکیکتاب]] یک نشانواره پیشنهاد دادم.
لطفا بررسی کنید. [[کاربر:Fwldom|Fwldom]] ([[بحث کاربر:Fwldom|بحث]]) ۲۵ اوت ۲۰۲۴، ساعت ۱۱:۵۰ (UTC)
:درود. بسیار زیبا هستند نگاره های پیشنهادی شما اما لوگو (نشانواره) نیستند و زمان به پایان رسیده است. [[کاربر:Doostdar|دوستدار ایران بزرگ]] [[بحث کاربر:Doostdar|☎]] دوشنبه،۵ شهریور ۱۴۰۳، ساعت ۰۰:۴۹ (ایران) ۲۵ اوت ۲۰۲۴، ساعت ۲۰:۱۹ (UTC)
::👍 [[کاربر:Fwldom|Fwldom]] ([[بحث کاربر:Fwldom|بحث]]) ۲۶ اوت ۲۰۲۴، ساعت ۱۰:۳۳ (UTC)
== حذف سریع یک صفحه اضافی از کتاب psp ==
درود
صفحه ''برنامه نویسی PSP/فهرست راهنمای تکراری'' از کتاب psp اضافی است و آن را از فهرست حذف کردم لطفاً صفحه را حذف کنید.
باسپاس بیکران [[کاربر:Fwldom|Fwldom]] ([[بحث کاربر:Fwldom|بحث]]) ۳۱ اوت ۲۰۲۴، ساعت ۱۲:۳۶ (UTC)
:در [[ویکیکتاب:پیشنهادهای حذف]] درخواست کنید. [[کاربر:Doostdar|دوستدار ایران بزرگ]] [[بحث کاربر:Doostdar|☎]] چهارشنبه،۱۴ شهریور ۱۴۰۳، ساعت ۱۳:۴۹ (ایران) ۴ سپتامبر ۲۰۲۴، ساعت ۰۹:۱۹ (UTC)
== پیشنهاد رویداد ==
درود بر جناب دوستدار ایران زمین
این روز ها ویکی پدیا یک رویداد با نام ویکی دوستدار ورزش داره.
که هم باعث جذب کاربر شده و نزدیک به بیش 324 مقاله به واسطه همین رویداد در ویکی پدیا ایجاد شده است.
سئوالم این است آیا تا حالا ویکی کتاب همچین رویدادی داشته؟
ما میتونیم برای ویکی کتاب رویدادی ایجاد کنیم برای کامل کردن کتاب ها:
کاربران، صفحات کتاب هایی که فهرست دارن اما صفحه هاشون ایجاد نشده، ایجاد کنن و مطلب ش را کامل کند.
و بر اساس اون امتیاز به کاربران تعلق بگیره و به نفرات اول جوایزی هم اهدا بشه.
جوایز میتوانند مثلا نشان دادن کاربر در صفحه اصلی بعنوان شرکت کنندگان فعال ویکی کتاب یا هر چیز دیگهای باشه.
میتوانند جوایزی هم نداشته باشد یا تقدیری باشد.
میتوانید از https://fountain.toolforge.org/editathons/new/config برای ایجاد رویداد استفاده کنید.
بنظرم هر چقدر کم ولی باعث پیشرفت ویکی کتاب میشود.
باسپاس بیکران و بدرود [[کاربر:Fwldom|Fwldom]] ([[بحث کاربر:Fwldom|بحث]]) ۲ سپتامبر ۲۰۲۴، ساعت ۱۸:۱۱ (UTC)
:درود. سپاس از پیشنهاد خوب شما. [[کاربر:Doostdar|دوستدار ایران بزرگ]] [[بحث کاربر:Doostdar|☎]] جمعه،۱۶ شهریور ۱۴۰۳، ساعت ۰۲:۴۷ (ایران) ۵ سپتامبر ۲۰۲۴، ساعت ۲۲:۱۷ (UTC)
::اگر قصد داشتید یک رویداد بگذارید.
::خوشحال میشم من هم سهیم باشم.
::بدرود [[کاربر:Fwldom|Fwldom]] ([[بحث کاربر:Fwldom|بحث]]) ۶ سپتامبر ۲۰۲۴، ساعت ۰۸:۲۱ (UTC)
== کتاب اچ تی ام ال ==
درود من وقتی جستجو میکنم اچ تی ام ال زیر کتاب نوشته میشه "زبان برنامهنویسی".
من نتونستم(نمیدونم) تغییر بدم.
لطفا آن را تغییر بدید به زبان نشانه گذاری چون اچ تی ام ال زبان برنامه نویسی نیست. [[کاربر:Fwldom|Fwldom]] ([[بحث کاربر:Fwldom|بحث]]) ۶ سپتامبر ۲۰۲۴، ساعت ۱۲:۴۸ (UTC)
:درود. من چیزی ندیدم. دقیقا کجا نوشته شده؟ [[کاربر:Doostdar|دوستدار ایران بزرگ]] [[بحث کاربر:Doostdar|☎]] شنبه،۱۷ شهریور ۱۴۰۳، ساعت ۱۲:۵۷ (ایران) ۷ سپتامبر ۲۰۲۴، ساعت ۰۸:۲۷ (UTC)
::[[پرونده:سرچ ویکی کتاب اچ تی ام ال.png|بندانگشتی]]
::توضیحات کوتاه صفحه وقتی سرچ میکنید پایین نام کتاب میاد. [[کاربر:Fwldom|Fwldom]] ([[بحث کاربر:Fwldom|بحث]]) ۷ سپتامبر ۲۰۲۴، ساعت ۱۰:۱۷ (UTC)
:::فکر میکنم یک نوع زبان برنامهنویسی باشد. [[کاربر:Doostdar|دوستدار ایران بزرگ]] [[بحث کاربر:Doostdar|☎]] یکشنبه،۱۸ شهریور ۱۴۰۳، ساعت ۰۲:۱۶ (ایران) ۷ سپتامبر ۲۰۲۴، ساعت ۲۱:۴۶ (UTC)
::::درود
::::[[پرونده:Html search in wikipedia english.png|بندانگشتی]]
::::اگر در عکس زیر ویکی پدیای انگلیسی ببینی میبینید نوشته شده زبان نشانه گذاری ابر متن.
::::اینکه به اچ تی ام ال زبان برنامه نویسی میگن اشتباه است.
::::میتونید این [https://www.geeksforgeeks.org/difference-between-programming-scripting-and-markup-languages/ مقاله] رو بخونید تا متوجه بشید.
::::زبان های برنامه نویسی مجموعه ای از الگوریتم هارو توصیف و سپس نتیجه را نمایش میدهند اما اچ تی ام ال فقط نتیجه را نمایش میدهد.
::::ویکی پدیای فارسی هم همین اشتباه رو کرده من اونجا هم یک بحث باز میکنم تا عوض شود.
::::باسپاس [[کاربر:Fwldom|Fwldom]] ([[بحث کاربر:Fwldom|بحث]]) ۸ سپتامبر ۲۰۲۴، ساعت ۱۳:۵۰ (UTC)
:::::درسته معلومه شما خیلی HTML رو خوب میدونید. تو ویکیپدیا اشتباه نوشته اند شاید ولی من به همشون میگم زبان برنامه نویسی. [[کاربر:Doostdar|دوستدار ایران بزرگ]] [[بحث کاربر:Doostdar|☎]] دوشنبه،۱۹ شهریور ۱۴۰۳، ساعت ۱۶:۴۰ (ایران) ۹ سپتامبر ۲۰۲۴، ساعت ۱۲:۱۰ (UTC)
:::::[[برنامهنویسی دلفی]] هم اشتباه است؟ [[کاربر:Doostdar|دوستدار ایران بزرگ]] [[بحث کاربر:Doostdar|☎]] دوشنبه،۱۹ شهریور ۱۴۰۳، ساعت ۱۸:۰۳ (ایران) ۹ سپتامبر ۲۰۲۴، ساعت ۱۳:۳۳ (UTC)
:::::[[سیشارپ]] چطور؟ زبان برنامهنویسی نیست؟ [[کاربر:Doostdar|دوستدار ایران بزرگ]] [[بحث کاربر:Doostdar|☎]] دوشنبه،۱۹ شهریور ۱۴۰۳، ساعت ۱۸:۰۶ (ایران) ۹ سپتامبر ۲۰۲۴، ساعت ۱۳:۳۶ (UTC)
::::::سی شارپ، جاوا اسکریپت زبان برنامه نویسی هستند، چون میتوان الگوریتم در آن پیاده کرد.
::::::شما خیلی راحت میتونید زبان های برنامه نویسی را تشخیص بدهید '''زبان هایی که میتوان شرط، حلقه، تابع، ... در آن نوشت زبان برنامه نویسی است.'''
::::::دلفی هم یک زبان برنامه نویسی است که به IDE (محیط توسعه یکپارچه) اش هم دلفی میگویند. [[کاربر:Fwldom|Fwldom]] ([[بحث کاربر:Fwldom|بحث]]) ۹ سپتامبر ۲۰۲۴، ساعت ۱۴:۲۲ (UTC)
:::::::خب در html هم یک سری کد مینویسیم که به صورت شرط عمل میکنند. برنامهنویسی نیست؟ [[کاربر:Doostdar|دوستدار ایران بزرگ]] [[بحث کاربر:Doostdar|☎]] دوشنبه،۱۹ شهریور ۱۴۰۳، ساعت ۱۸:۵۵ (ایران) ۹ سپتامبر ۲۰۲۴، ساعت ۱۴:۲۵ (UTC)
::::::::فکر نکنم در html همچین چیزی وجود داشته باشد.
::::::::برای مثال الان شما میتونید با فقط html بدون جاوا اسکریپت و css یک برنامه بنویسید که شعر های رندوم را از بین لیست ها انتخاب و نمایش دهد؟
::::::::خب طبیعتاً نه، شما فقط میتونید یک چیز را نمایش بدهید. [[کاربر:Fwldom|Fwldom]] ([[بحث کاربر:Fwldom|بحث]]) ۹ سپتامبر ۲۰۲۴، ساعت ۱۴:۲۷ (UTC)
:::::[[جاوا اسکریپت]] چطور؟ [[کاربر:Doostdar|دوستدار ایران بزرگ]] [[بحث کاربر:Doostdar|☎]] دوشنبه،۱۹ شهریور ۱۴۰۳، ساعت ۱۸:۴۳ (ایران) ۹ سپتامبر ۲۰۲۴، ساعت ۱۴:۱۳ (UTC)
::::::بله جاوا اسکریپت زبان برنامه نویسی است. [[کاربر:Fwldom|Fwldom]] ([[بحث کاربر:Fwldom|بحث]]) ۹ سپتامبر ۲۰۲۴، ساعت ۱۴:۲۳ (UTC)
:::::::من اطلاعاتی درین باره ندارم در ویکیپدیا کمک بگیرید. [[کاربر:Doostdar|دوستدار ایران بزرگ]] [[بحث کاربر:Doostdar|☎]] دوشنبه،۱۹ شهریور ۱۴۰۳، ساعت ۱۸:۵۶ (ایران) ۹ سپتامبر ۲۰۲۴، ساعت ۱۴:۲۶ (UTC)
::::::::من متوجه نشدم، چرا باید از ویکی پدیا کمک بگیرم؟
::::::::اچ تی ام ال یک زبان برنامه نویسی نیست بلکه یک زبان نشانه گذاری است.
::::::::اگر یک جستجو در وب کنید، متوجه میشوید، برای همین گفتم توضیحات صفحه اچ تی ام ال رو به زبان نشانه گذاری ابر متن تغییر بدهیم. [[کاربر:Fwldom|Fwldom]] ([[بحث کاربر:Fwldom|بحث]]) ۹ سپتامبر ۲۰۲۴، ساعت ۱۴:۳۰ (UTC)
:::::::::اینها ربطی به ویکیکتاب نداره شما ابزاری رو برای فیلد جستجو فعال کردید که از پروژههای برادر ویکیمدیا مثل ویکیداده و ویکیپدیا فیلدها رو پر میکنه. برای تغییر دادهها باید در ویکیداده ویرایش کنید. ویکیداده در سایر پروژهها یک سری اطلاعات کمکی رو وارد میکنه. برای اطلاعات بیشتر [[ویکیکتاب:همکاری با ویکیداده]] رو بخونید. [[کاربر:Doostdar|دوستدار ایران بزرگ]] [[بحث کاربر:Doostdar|☎]] دوشنبه،۱۹ شهریور ۱۴۰۳، ساعت ۱۹:۰۴ (ایران) ۹ سپتامبر ۲۰۲۴، ساعت ۱۴:۳۴ (UTC)
::::::::::👍 [[کاربر:Fwldom|Fwldom]] ([[بحث کاربر:Fwldom|بحث]]) ۹ سپتامبر ۲۰۲۴، ساعت ۱۴:۳۶ (UTC)
== بهبود [[مدیاویکی:Licenses]]! ==
سلام! ما قبلاً در مورد [[مدیاویکی:Licenses]] صحبت کردیم (به انگلیسی). GFDL مجوز خوبی برای فایلهای رسانهای نیست زیرا هر کسی که بخواهد از فایل استفاده کند باید تمام شرایط مجوز را شامل شود.
بنابراین، بهترین گزینه این است که 2 خط زیر را حذف کنید:
** مجوز گنو-خود|پرونده خلقشده توسط بارگذار و انتشار تحت GFDL
** مجوز گنو|انتشار تحت GFDL (منبع حتماً ذکر شود)
گزینه دوم بهترین این است که آن را به یک مجوز دوگانه با هر دو GFDL و Cc-by-sa-4.0 تبدیل کنید، مانند ویکیپدیا ([[:w:مدیاویکی:Licenses]]).
[[Template:مجوز گنو-خود]] همچنین شامل cc-by-sa-3.0 است. من فکر نمیکنم این ایده خوبی باشد زیرا بارگذار به طور خاص با GFDL موافقت کرده است. اگر قرار است هر دو مجوز را شامل شود، باید در [[مدیاویکی:Licenses]] نوشته شود.
برخی از فایلها مجوز ندارند و این طبق [[:wmf:Resolution:Licensing_policy]] مجاز نیست. اگر فایلهای استفاده نشده را در [[Special:UnusedFiles]] حذف کنید، کمک خواهد کرد.
امیدوارم ترجمه خیلی بد نباشد. اگر سوالی دارید لطفاً بپرسید و من سعی خواهم کرد آن را بهتر کنم. [[کاربر:MGA73|MGA73]] ([[بحث کاربر:MGA73|بحث]]) ۱۷ اکتبر ۲۰۲۴، ساعت ۱۴:۴۰ (UTC)
:درود. سپاس از شما برای کار بزرگی که انجام میدهید. من از کاربران این ویکی درخواست کردم هنگام بارگزاری فایلهای رسانهای، دیگر از مجوز گنو (GFDL) استفاده نکنند و به زودی فایلهای استفاده نشده در [[:ویژه:تصاویر استفاده نشده]] را حذف خواهم کرد. [[کاربر:Doostdar|دوستدار ایران بزرگ]] [[بحث کاربر:Doostdar|☎]] جمعه،۲۷ مهر ۱۴۰۳، ساعت ۲۳:۳۵ (ایران) ۱۸ اکتبر ۲۰۲۴، ساعت ۲۰:۰۵ (UTC)
::سپاس از شما برای سخنان محبتآمیز و تغییراتی که انجام دادهاید. --[[کاربر:MGA73|MGA73]] ([[بحث کاربر:MGA73|بحث]]) ۱۹ اکتبر ۲۰۲۴، ساعت ۱۸:۳۲ (UTC)
:::سلام! امیدوارم همه چیز در جای شما خوب باشد. متوجه شدم که اگر کمی وقت دارید، هنوز فایلهایی در [[ویژه:تصاویر_استفاده_نشده]] وجود دارد. --[[کاربر:MGA73|MGA73]] ([[بحث کاربر:MGA73|بحث]]) ۲۸ دسامبر ۲۰۲۴، ساعت ۱۸:۵۸ (UTC)
::::حدود صد تصویر باقی ماندهاند که ممکن است مفید باشند. از چه مجوزی برای این تصاویر میتوان استفاده کرد؟ آیا مجوز Cc-by-sa-4.0 برای این تصاویر مناسب است؟ [[کاربر:Doostdar|دوستدار ایران بزرگ]] [[بحث کاربر:Doostdar|☎]] سهشنبه،۱۱ دی ۱۴۰۳، ساعت ۱۱:۲۹ (ایران) ۳۱ دسامبر ۲۰۲۴، ساعت ۰۷:۵۹ (UTC)
سلام! فقط دارنده حق نسخهبرداری میتواند مجوز اضافه کند. یک استثنا وجود دارد: اگر فایل بسیار ساده باشد، میتوان مجوزی مانند "PD-shape" اضافه کرد. --[[کاربر:MGA73|MGA73]] ([[بحث کاربر:MGA73|بحث]]) ۳۱ دسامبر ۲۰۲۴، ساعت ۱۱:۰۹ (UTC)
سلام! حال شما چطور است؟ هنوز تعدادی [[Special:UnusedFiles]] وجود دارد. بسیاری از آنها مجوز ندارند بنابراین پیشنهاد می کنم همه آنها را حذف کنید. می توانید نگاهی بیندازید؟ اگر آسانتر است، میتوانم از Global Sysop بخواهم که فایلها را با یک اسکریپت حذف کند. سپس فقط چند ثانیه طول می کشد.--[[کاربر:MGA73|MGA73]] ([[بحث کاربر:MGA73|بحث]]) ۳ آوریل ۲۰۲۵، ساعت ۱۵:۰۲ (UTC)
:درود. من در حال بررسی این تصاویر هستم و کمتر از صد تصویر باقی مانده است. بیشتر آنها دارای مجوز "PD-shape" هستند و دلیلی برای حذف آنها وجود ندارد. [[کاربر:Doostdar|دوستدار ایران بزرگ]] [[بحث کاربر:Doostdar|☎]] شنبه،۱۶ فروردین ۱۴۰۴، ساعت ۱۶:۵۹ (ایران) ۵ آوریل ۲۰۲۵، ساعت ۱۲:۲۹ (UTC)
== لطفاً بخش کتاب کلاغ از خوشحالی در پوست خود نمیگنجشک را حذف کنید. ==
سلام وقت بخیر..
لطفاً بخش کتاب کلاغ از خوشحالی در پوست خود نمیگنجشک را از صفحه [[ویکیکتاب:گزیدن کتابهای برگزیده]] حذف کنید چون فردی بدون اجازه از نویسنده و ناشر این کتاب آنرا در ویکی کتاب نامزد کرده بود و این حق را نداشت. خواهش میکنم هرچه سریعتر مطالب مذکور را حذف کنید. باتشکر [[کاربر:Armita kiyani|Armita kiyani]] ([[بحث کاربر:Armita kiyani|بحث]]) ۱ نوامبر ۲۰۲۴، ساعت ۰۸:۰۶ (UTC)
:درود. برای نظرخواهی در ویکیکتاب نیازی به اجازه از ناشر نداریم. درخواست نظرخواهی را هم حذف نمیکنم تا سابقه فعالیت های کاربر در این وبگاه باقی بماند. [[کاربر:Doostdar|دوستدار ایران بزرگ]] [[بحث کاربر:Doostdar|☎]] جمعه،۱۱ آبان ۱۴۰۳، ساعت ۲۳:۰۱ (ایران) ۱ نوامبر ۲۰۲۴، ساعت ۱۹:۳۱ (UTC)
== پرسش ==
@[[کاربر:Doostdar|Doostdar]]
درود بر شما مدیر گرامی خداقوت امیدوارم بی نهایت عالی باشید.
من یه کتاب در حوزه فناوری نوشتم و به تازگی چاپ کردم آیا میتوان بخش های مفید کتابم در ویکی کتاب قرار بگیرد؟
یا تعارض منافع است و یا باید فرد دیگری به غیر از من اینکار را انجام دهد؟
با احترام [[کاربر:مبین خجسته برومند|مبین خجسته برومند]] ([[بحث کاربر:مبین خجسته برومند|بحث]]) ۲۶ آوریل ۲۰۲۵، ساعت ۲۰:۵۶ (UTC)
:درود جناب مبین. از شما سپاسگزارم که این وبگاه رو برای ویرایش انتخاب کرده اید. در یک ماه گذشته فقط ۱۶ کاربر در این ویکی ویرایش کردهاند و این میزان مشارکت حتی از زبان های دیگر ویکیکتاب مثل ویتنامی، مجاری، ژاپنی، پرتغالی، کرهای، ... هم کمتر بوده است. جای بسی شرمساری است که تا این اندازه مشارکت کاربران فارسیزبان پایین بوده است.
:شما نیز یک کاربر تازهوارد هستید که هنوز کمتر از ۱۰۰ ویرایش دارید. در شرایط کنونی حتی ویرایش های کاربران در این وبگاه به شدت باید مورد بررسی قرار بگیرد و تا زمانی که کاربر ویکینویسی را یاد نگرفته و تعداد ویرایش به اندازه کافی نداشته باشد تک تک ویرایش های وی مورد بررسی قرار می گیرد و در صورت نیاز واگردانی می شود. با هر گونه کپیبرداری از وبگاههای دیگر و ویکیپدیا به شدت برخورد میشود و حتی ناچاریم کاربر تازهوارد را قطع دسترسی کنیم. شوربختانه در شرایط کنونی به هیچ عنوان اجازه اهدای کتاب داده نمیشود. [[کاربر:Doostdar|دوستدار ایران بزرگ]] [[بحث کاربر:Doostdar|☎]] یکشنبه،۷ اردیبهشت ۱۴۰۴، ساعت ۱۱:۴۰ (ایران) ۲۷ آوریل ۲۰۲۵، ساعت ۰۷:۱۰ (UTC)
== کتاب اچ تی ام ال و سی اس اس ==
درود بر شما
کتاب [[اچتیامال]] کامل شده است لطف کنید کار های نهایی این کتاب را انجام دهید.
کتاب [[سیاساس]] نیز در حال تکمیل است و نیاز به صفحه آرایی دارد.
باسپاس [[کاربر:Fwldom|Fwldom]] ([[بحث کاربر:Fwldom|بحث]]) ۱۲ ژوئن ۲۰۲۵، ساعت ۲۰:۱۰ (UTC)
:همچنین کتاب [[برنامه نویسی PSP]] خیلی وقت است که کامل شده است.
:و کتاب [[آموزش کار با تریدی مکس]] هم کامل هست.
:البته کامل که هنوز قابل تکمیل هست اما فکر نکنم نیازی به رده رو به اتمام باشد. [[کاربر:Fwldom|Fwldom]] ([[بحث کاربر:Fwldom|بحث]]) ۱۲ ژوئن ۲۰۲۵، ساعت ۲۰:۱۹ (UTC)
::سپاس از تلاش شما برای پربار کردن کتاب ها. برنامهنویسی PSP کتابی است که شهریور ۱۴۰۳ نکمیل شده و در [[ویکیکتاب:ایبوکها بر حسب وضعیت تکمیلشدگی]] به عنوان کتاب کامل شده اسمش نوشته شده. [[آموزش کار با تریدی مکس]] کتابی است که نزدیک به کامل است ولی شوربختانه تعداد نویسندگان مشارکتکنندگان کم است، بالای کتاب هم وضعیت ۷۵ درصدی براش مشخص شده، کتاب بعدی یعنی [[سیاساس]] تعداد زیادی صفحه با پیوند سرخ داره پس کامل نمیونه باشه! گذشته از این فقط یک نویسنده داره و برای یک کتاب درباره یک زبان برنامهنویسی معروف کافی نیست. محتوای کتاب باید توسط چند نویسنده دیگر بررسی بشه و ویرایش کافی انجام بگیره. [[کاربر:Doostdar|دوستدار ایران بزرگ]] [[بحث کاربر:Doostdar|☎]] شنبه،۲۴ خرداد ۱۴۰۴، ساعت ۱۴:۳۱ (ایران) ۱۴ ژوئن ۲۰۲۵، ساعت ۱۰:۰۱ (UTC)
:::{{پب|Fwldom}} درود. چرا پیدا نیستید؟ این چند روزه به دلیل جنگ اسرائیل، اینترنت ضعیف شده بود اما دوباره همه چیز به وضع عادی برگشته. منتظر هستم بیایید و کتاب CSS رو کامل کنید. --[[کاربر:Doostdar|دوستدار ایران بزرگ]] [[بحث کاربر:Doostdar|☎]] دوشنبه،۹ تیر ۱۴۰۴، ساعت ۱۲:۰۵ (ایران) ۳۰ ژوئن ۲۰۲۵، ساعت ۰۷:۳۵ (UTC)
::::درود بر شما
::::کار روی این کتاب را دوباره شروع میکنم.
::::باسپاس بیکران [[کاربر:Fwldom|Fwldom]] ([[بحث کاربر:Fwldom|بحث]]) ۲ ژوئیهٔ ۲۰۲۵، ساعت ۱۹:۲۸ (UTC)
gxo3zxzzrpg2tgibznmylfubtczsdsq
سیاساس
0
40883
132011
131994
2025-07-02T19:20:04Z
Fwldom
26269
/* فهرست کتاب */منابع
132011
wikitext
text/x-wiki
== مقدمه ==
برای یادگیری کامل CSS (Cascading Style Sheets)، مطالعهٔ این کتاب بهعنوان یک منبع جامع توصیه میشود. این کتاب تمامی مفاهیم پایه و پیشرفتهٔ CSS را پوشش میدهد و به شما کمک میکند تا بهصورت گامبهگام با این زبان طراحی آشنا شوید.
'''نکته:''' پیش از شروع مطالعهٔ این کتاب، بهتر است ابتدا با مفاهیم HTML آشنا باشید. پیشنهاد میشود ابتدا کتاب [[اچتیامال]] را مطالعه نمایید، چرا که CSS برای طراحی و استایلدهی به عناصر HTML بهکار میرود و درک صحیح از ساختار HTML برای فهم بهتر CSS ضروری است.
== فهرست کتاب ==
=== مقدمه و مفاهیم پایه ===
* [[سیاساس/شروع به کار|شروع به کار با سیاساس]]
* [[سیاساس/نحو|نحو نگارش CSS]]
* [[سیاساس/کامنتها|کامنتگذاری در CSS]]
* [[سیاساس/واحدها|واحدهای اندازهگیری]]
=== انتخابگرها (Selectors) ===
* [[سیاساس/انتخابگر|مقدمه بر انتخابگرها]]
=== رنگ و پسزمینه ===
* [[سیاساس/رنگ|استفاده از رنگها در CSS]]
* [[سیاساس/پسزمینه|تنظیم پسزمینهها]]
* [[سیاساس/گرادیان|گرادیانها (Gradients)]]
=== متن و فونت ===
* [[سیاساس/فونت|فونتها]]
* [[سیاساس/اندازه متن|اندازه و وزن متن]]
* [[سیاساس/تراز متن|تراز، فاصله و فاصله خطوط]]
* [[سیاساس/دگرگونی متن|دگرگونی و افکتهای متنی]]
=== باکس و اندازه ===
* [[سیاساس/عرض و ارتفاع|عرض و ارتفاع عناصر]]
* [[سیاساس/margin|margin (فاصله بیرونی)]]
* [[سیاساس/فاصله درونی|padding (فاصله درونی)]]
* [[سیاساس/حاشیه|border (حاشیه)]]
* [[سیاساس/outline|خط دور (outline)]]
* [[سیاساس/box-model|مدل جعبهای (Box Model)]]
=== چیدمان (Layout) ===
* [[سیاساس/display|ویژگی display]]
* [[سیاساس/position|موقعیتدهی position]]
* [[سیاساس/z-index|z-index و ترتیب لایهها]]
* [[سیاساس/float|ویژگی float و clear]]
* [[سیاساس/flexbox|چیدمان با Flexbox]]
* [[سیاساس/grid|چیدمان با CSS Grid]]
=== ریسپانسیو و رسانهها ===
* [[سیاساس/media|media queries]]
* [[سیاساس/واکنشگرایی|طراحی واکنشگرا]]
* [[سیاساس/واحدهای نسبی|واحدهای نسبی: %, em, rem, vw, vh]]
=== افکتها و انیمیشن ===
* [[سیاساس/transition|ترنزیشنها (Transitions)]]
* [[سیاساس/transform|تبدیلها (Transform)]]
* [[سیاساس/animation|انیمیشن در CSS]]
=== شبهکلاسها و شبهعناصر ===
* [[سیاساس/پسودوسلکتورها|شبهکلاسها و شبهعناصر]]
=== متفرقه و نکات پیشرفته ===
* [[سیاساس/سفارشیسازی اسکرول|استایلدهی به Scrollbar]]
* [[سیاساس/متغیرها|متغیرهای CSS]]
* [[سیاساس/import|وارد کردن فایل CSS با @import]]
* [[سیاساس/ملاحظات سئو|نکات مهم سئو در CSS]]
* [[سیاساس/ریست و نرمالایز|ریست کردن استایل مرورگرها]]
* [[سیاساس/shorthand|استفاده از shorthand در CSS]]
== منابع کتاب ==
[[https://www.w3schools.com/css/default.asp]]
[[https://developer.mozilla.org/en-US/docs/Web/CSS]]
[[رده:سیاساس]]
rofwa49mxvwkd3jrj3qag2yul7e40br
سیاساس/نحو
0
41262
132021
131874
2025-07-02T20:51:29Z
Doostdar
6290
added [[Category:سیاساس]] با استفاده از ردهساز
132021
wikitext
text/x-wiki
== سینتکس CSS ==
'''CSS''' (مخفف ''Cascading Style Sheets'') زبانی برای توصیف استایل و ظاهر عناصر در صفحات HTML است. هر قانون در CSS شامل یک '''selector''' (انتخابگر) و یک '''declaration block''' (بلوک اعلان) میباشد.
=== ساختار کلی یک قانون CSS ===
یک قانون CSS از دو بخش اصلی تشکیل شدهاست:
* '''Selector''' یا انتخابگر: عنصری را مشخص میکند که میخواهیم روی آن استایل اعمال کنیم.
* '''Declaration block''' یا بلوک اعلان: شامل یک یا چند اعلان است که به وسیلهٔ نقطهویرگول (;) از هم جدا میشوند. هر اعلان شامل یک '''property''' (ویژگی) و یک '''value''' (مقدار) است که با دونقطه (:) از هم جدا میشوند.
بهطور خلاصه سینتکس CSS به صورت زیر است:
<syntaxhighlight lang="css">
selector {
property: value;
property: value;
}
</syntaxhighlight>
=== مثال ===
در مثال زیر، تمام عناصر <code><p></code> (پاراگرافها) با رنگ قرمز و متن وسطچین نمایش داده خواهند شد:
<syntaxhighlight lang="css">
p {
color: red;
text-align: center;
}
</syntaxhighlight>
=== توضیح مثال ===
* <code>p</code> یک '''selector''' است (انتخابگر)، که به عنصر HTML <code><p></code> اشاره دارد.
* <code>color</code> یک '''property''' است و مقدار آن <code>red</code> (قرمز) میباشد.
* <code>text-align</code> نیز یک property دیگر است که مقدار آن <code>center</code> (وسطچین) است.
=== نکته ===
هر بلوک اعلان باید داخل آکولاد <code>{ }</code> قرار بگیرد. اگر چند ویژگی را مشخص میکنید، آنها را با نقطهویرگول <code>;</code> از هم جدا کنید.
در فصلهای بعدی با انواع بیشتری از '''CSS selectors''' (انتخابگرها) و '''CSS properties''' (ویژگیها) آشنا خواهید شد.
[[رده:سیاساس]]
100dk66lp50xsawawb1yyhy0y9dyggw
سیاساس/انتخابگر
0
41263
132024
131876
2025-07-02T20:53:00Z
Doostdar
6290
added [[Category:سیاساس]] با استفاده از ردهساز
132024
wikitext
text/x-wiki
== انتخابگرهای CSS ==
'''CSS selectors''' برای انتخاب عنصر یا عناصر HTML استفاده میشوند که میخواهیم روی آنها استایل (Style) اعمال کنیم.
میتوان انتخابگرهای CSS را به پنج دسته تقسیم کرد:
* '''Simple selectors''' (ساده): انتخاب عنصرها بر اساس نام، شناسه (id) یا کلاس (class)
* '''Combinator selectors''' (ترکیبی): انتخاب عناصر بر اساس رابطهٔ خاص بین آنها
* '''Pseudo-class selectors''' (کلاسهای مجازی): انتخاب عناصر بر اساس یک وضعیت خاص
* '''Pseudo-elements selectors''' (عناصر مجازی): انتخاب و استایلدهی بخشی از یک عنصر
* '''Attribute selectors''' (ویژگیمحور): انتخاب عناصر بر اساس ویژگی یا مقدار ویژگی
در این صفحه، با ابتداییترین انتخابگرهای CSS آشنا میشوید.
=== انتخابگر نوع عنصر (Element Selector) ===
این انتخابگر عناصر HTML را بر اساس '''نام''' عنصر انتخاب میکند.
<syntaxhighlight lang="css">
p {
text-align: center;
color: red;
}
</syntaxhighlight>
در این مثال، تمام عناصر <code><p></code> (پاراگرافها) وسطچین و قرمز میشوند.
=== انتخابگر ID در CSS ===
این انتخابگر، از ویژگی <code>id</code> یک عنصر HTML برای هدفگیری '''یک''' عنصر خاص استفاده میکند.
شناسه (id) در یک صفحه باید '''منحصربهفرد''' باشد.
برای انتخاب عنصری با شناسهٔ خاص، یک کاراکتر # پیش از نام id مینویسیم.
<syntaxhighlight lang="css">
#para1 {
text-align: center;
color: red;
}
</syntaxhighlight>
'''نکته:''' نام یک id نمیتواند با عدد شروع شود!
=== انتخابگر class در CSS ===
این انتخابگر عناصر HTML را بر اساس مقدار ویژگی <code>class</code> هدف قرار میدهد.
برای این کار، از یک نقطه <code>.</code> پیش از نام کلاس استفاده میکنیم.
<syntaxhighlight lang="css">
.center {
text-align: center;
color: red;
}
</syntaxhighlight>
در این مثال، همه عناصر دارای کلاس <code>center</code> قرمز و وسطچین خواهند بود.
همچنین میتوان فقط '''عناصر خاصی''' را با کلاس مشخص استایل داد:
<syntaxhighlight lang="css">
p.center {
text-align: center;
color: red;
}
</syntaxhighlight>
در اینجا فقط <code><p></code>هایی که کلاس <code>center</code> دارند، استایل میگیرند.
عناصر HTML میتوانند '''چند کلاس''' همزمان داشته باشند:
<syntaxhighlight lang="html">
<p class="center large">This paragraph refers to two classes.</p>
</syntaxhighlight>
در این مثال، عنصر <code><p></code> هم از کلاس <code>center</code> و هم از <code>large</code> استفاده میکند.
'''نکته:''' نام کلاس هم '''نباید''' با عدد شروع شود!
=== انتخابگر جهانی (Universal Selector) ===
انتخابگر <code>*</code> همهٔ عناصر HTML در صفحه را انتخاب میکند.
<syntaxhighlight lang="css">
* {
text-align: center;
color: blue;
}
</syntaxhighlight>
در این مثال، همه عناصر HTML در صفحه وسطچین و آبی میشوند.
=== انتخابگر گروهی (Grouping Selector) ===
برای اعمال استایل یکسان به چند عنصر مختلف، میتوان آنها را '''گروهبندی''' کرد.
مثال بدون گروهبندی:
<syntaxhighlight lang="css">
h1 {
text-align: center;
color: red;
}
h2 {
text-align: center;
color: red;
}
p {
text-align: center;
color: red;
}
</syntaxhighlight>
برای خلاصهکردن کد، انتخابگرها را با '''ویرگول (,)''' از هم جدا میکنیم:
<syntaxhighlight lang="css">
h1, h2, p {
text-align: center;
color: red;
}
</syntaxhighlight>
این کد عملکردی مشابه مثال بالا دارد، ولی کوتاهتر و خواناتر است.
[[رده:سیاساس]]
2w6ndke2ee7xoaidfsgvob8ne9ghgac
سیاساس/کامنتها
0
41264
132022
131878
2025-07-02T20:51:56Z
Doostdar
6290
added [[Category:سیاساس]] با استفاده از ردهساز
132022
wikitext
text/x-wiki
== کامنتها در CSS ==
کامنتها در CSS برای مستندسازی و توضیح کد استفاده میشوند و در مرورگر نمایش داده نمیشوند.
کامنتها میتوانند در زمان ویرایش بعدی کد بسیار مفید باشند، بهویژه زمانی که بخواهید مفهوم بخشهایی از کد را بهتر درک کنید.
مرورگرها کامنتها را '''نادیده''' میگیرند.
=== نحوه نوشتن کامنت در CSS ===
یک کامنت در CSS با <code>/*</code> شروع و با <code>*/</code> پایان مییابد. این کامنتها معمولاً '''داخل تگ <style>''' قرار میگیرند.
==== مثال: کامنت تکخطی ====
<syntaxhighlight lang="css">
/* این یک کامنت تکخطی است */
p {
color: red;
}
</syntaxhighlight>
==== مثال: کامنت درون کد ====
<syntaxhighlight lang="css">
p {
color: red; /* رنگ متن را قرمز تنظیم میکند */
}
</syntaxhighlight>
==== مثال: کامنت وسط یک خط کد ====
<syntaxhighlight lang="css">
p {
color: /*red*/ blue;
}
</syntaxhighlight>
در این حالت، مقدار <code>red</code> کامنت شده و از کد حذف میشود. پس رنگ متن آبی خواهد بود.
==== مثال: کامنت چندخطی ====
<syntaxhighlight lang="css">
/* این یک
کامنت چندخطی
است */
p {
color: red;
}
</syntaxhighlight>
=== کامنتها در HTML و CSS ===
همانطور که در آموزش HTML یاد گرفتید، میتوان از '''<!-- ... -->''' برای کامنتگذاری در HTML استفاده کرد.
در مثال زیر، ترکیبی از کامنتهای CSS و HTML را میبینید:
<syntaxhighlight lang="html">
<!DOCTYPE html>
<html>
<head>
<style>
p {
color: red; /* رنگ متن را قرمز تنظیم میکند */
}
</style>
</head>
<body>
<h2>عنوان من</h2>
<!-- این پاراگرافها قرمز خواهند بود -->
<p>Hello World!</p>
<p>This paragraph is styled with CSS.</p>
<p>کامنتهای HTML و CSS در خروجی نهایی نمایش داده نمیشوند.</p>
</body>
</html>
</syntaxhighlight>
[[رده:سیاساس]]
l7g8zli9vh77gzz96tmasuqqcd965bq
سیاساس/رنگ
0
41265
132023
131880
2025-07-02T20:52:34Z
Doostdar
6290
added [[Category:سیاساس]] با استفاده از ردهساز
132023
wikitext
text/x-wiki
== راهنمای رنگها در CSS ==
در CSS، میتوان رنگها را به روشهای مختلفی تعریف کرد: استفاده از نامهای رنگ، مقادیر RGB، HEX، HSL، و نسخههای شفاف آنها (RGBA و HSLA).
=== ۱. استفاده از نامهای رنگ ===
CSS از ۱۴۰ نام رنگ استاندارد مانند موارد زیر پشتیبانی میکند:
* Tomato
* Orange
* DodgerBlue
* MediumSeaGreen
* Gray
* SlateBlue
* Violet
* LightGray
مثال:
<p style="color:Tomato;">متن با رنگ Tomato</p>
=== ۲. رنگ پسزمینه (Background Color) ===
برای تعیین رنگ پسزمینه یک عنصر:
<div style="background-color:DodgerBlue;">متن داخل کادر</div>
=== ۳. رنگ متن (Text Color) ===
<p style="color:MediumSeaGreen;">متنی با رنگ سبز دریایی</p>
=== ۴. رنگ حاشیه (Border Color) ===
<div style="border: 2px solid Violet;">کادری با حاشیه بنفش</div>
=== ۵. انواع فرمتهای رنگ ===
رنگها را میتوان با روشهای زیر تعیین کرد:
* نام رنگ: Tomato
* RGB:rgb(255, 99, 71)
* HEX: #ff6347
* HSL: hsl(9, 100%, 64%)
* RGBA:rgba(255, 99, 71, 0.5) (با شفافیت)
* HSLA: hsla(9, 100%, 64%, 0.5) (با شفافیت)
مثال:
<div style="background-color:rgba(255, 99, 71, 0.5);">رنگ با شفافیت</div>
=== ۶. RGB در CSS ===
فرمت: rgb(red, green, blue)
* مقادیر بین 0 تا 255
مثالهای کاربردی:
* قرمز: rgb(255, 0, 0)
* آبی: rgb(0, 0, 255)
* خاکستری متوسط: rgb(128, 128, 128)
برای ساخت رنگ خاکستری:
rgb(60, 60, 60)
rgb(120, 120, 120)
=== ۷. RGBA در CSS ===
فرمت: rgba(red, green, blue, alpha)
* alpha از ۰ تا ۱، نشاندهنده شفافیت است.
مثالها:
rgba(255, 99, 71, 0.2)
rgba(255, 99, 71, 0.6)
rgba(255, 99, 71, 1)
=== ۸. HEX در CSS ===
فرمت: #rrggbb
* #ff0000: قرمز
* #000000: سیاه
* #ffffff: سفید
همچنین نسخه کوتاهنویسی مانند #f00 برای قرمز وجود دارد.
=== ۹. HSL در CSS ===
فرمت: hsl(hue, saturation, lightness)
* hue (زاویه رنگ): 0 تا 360 درجه
* 0 = قرمز، 120 = سبز، 240 = آبی
* saturation (اشباع): 0% تا 100%
* lightness (روشنایی): 0% (سیاه) تا 100% (سفید)
مثال:
hsl(200, 100%, 50%)
=== ۱۰. HSLA در CSS ===
فرمت: hsla(hue, saturation, lightness, alpha)
* مشابه HSL، با پارامتر شفافیت (alpha)
مثال:
hsla(200, 100%, 50%, 0.3)
[[رده:سیاساس]]
o2zfr0h4j9p07132ga39w0wyydlza8m
بحث:سیاساس
1
41275
132012
131997
2025-07-02T19:21:29Z
Fwldom
26269
/* تکمیل کتاب */ پاسخ
132012
wikitext
text/x-wiki
== فصل های جدید ==
{{پینگ|Fwldom}} درود. خوش برگشتید. کتاب سی اس اس هم دارید خوب پیش میبرید اما چنتا سوال دارم. از چه منابعی استفاده میکنید؟ سطح کتاب چیست (مقدماتی/متوسط/ پیشرفته)؟ فصل حاشیه با مارجین چه فرقی میکند، آیا همان border است؟ [[کاربر:Doostdar|دوستدار ایران بزرگ]] [[بحث کاربر:Doostdar|☎]] چهارشنبه،۲۱ خرداد ۱۴۰۴، ساعت ۲۳:۳۳ (ایران) ۱۱ ژوئن ۲۰۲۵، ساعت ۱۹:۰۳ (UTC)
:درود بر شما
:باسپاس
:منابع این کتاب مختلف هست اما معمولا w3schools و mdn و geekforgeeks البته این منبع ها فقط برای سر فصل ها هستند.
:در مورد سطح کتاب این کتاب تمام css را در برمیگیرد و فصل های نخست مقدماتی و فصل های بعدی عمیق تر میشود و تمام مفاهیم را در برمیگرد.
:در واقع یک آموزش کامل برای css
:در css مارجین به فاصله بین عنصر ها گفته میشود (البته مفهوم اصلی کمی فرق میکند).
:منظور من از حاشیه همان border است.
:اگر امکانش هست ساختار فصل بندی ها را زیباتر کنید و در صفحات صفحه قبلی/بعدی را قرار دهید.
:باسپاس بیکران [[کاربر:Fwldom|Fwldom]] ([[بحث کاربر:Fwldom|بحث]]) ۱۲ ژوئن ۲۰۲۵، ساعت ۱۸:۲۶ (UTC)
::منابع و هدف کتاب را باید درون کتاب ذکر کنید. مهم این است محتوای کتاب به درد کاربران بخورد وگرنه هیچ ارزشی نخواهد داشت. ظاهر کتاب و تنظیم صفحه ها رو بنده انجام خواهم داد. [[کاربر:Doostdar|دوستدار ایران بزرگ]] [[بحث کاربر:Doostdar|☎]] شنبه،۲۴ خرداد ۱۴۰۴، ساعت ۱۴:۱۰ (ایران) ۱۴ ژوئن ۲۰۲۵، ساعت ۰۹:۴۰ (UTC)
== تکمیل کتاب ==
{{پب|Fwldom}} درود. این کتاب رو تا حد زیادی نوشتید اما بخش های زیادی هنوز ناکامل هستند و نیاز به مشارکت دیگر کاربران داریم. چه راهنماییای برای کامل کردن این کتاب دارید؟ [[کاربر:Doostdar|دوستدار ایران بزرگ]] [[بحث کاربر:Doostdar|☎]] دوشنبه،۹ تیر ۱۴۰۴، ساعت ۱۰:۵۹ (ایران) ۳۰ ژوئن ۲۰۲۵، ساعت ۰۶:۲۹ (UTC)
:درود بر شما، بخش منابع کتاب رو اضافه کردم نویسندگان میتوانند استفاده کنند سر فصل ها شبیه است. [[کاربر:Fwldom|Fwldom]] ([[بحث کاربر:Fwldom|بحث]]) ۲ ژوئیهٔ ۲۰۲۵، ساعت ۱۹:۲۱ (UTC)
== کدام مرورگرهای اینترنت از سی اس اس پشتیبانی میکنند؟ ==
{{پب|Fwldom}} درود. آیا فقط اپرا و گوگل کروم از CSS پشتیبانی میکنند یا همه مرورگرهای اینترنت از آن پشتیبانی میکنند؟ [[کاربر:Doostdar|دوستدار ایران بزرگ]] [[بحث کاربر:Doostdar|☎]] دوشنبه،۹ تیر ۱۴۰۴، ساعت ۱۱:۱۹ (ایران) ۳۰ ژوئن ۲۰۲۵، ساعت ۰۶:۴۹ (UTC)
o44utcduk8pv8ukznksna6rgnqn6p2x
132013
132012
2025-07-02T19:22:33Z
Fwldom
26269
/* کدام مرورگرهای اینترنت از سی اس اس پشتیبانی میکنند؟ */ پاسخ
132013
wikitext
text/x-wiki
== فصل های جدید ==
{{پینگ|Fwldom}} درود. خوش برگشتید. کتاب سی اس اس هم دارید خوب پیش میبرید اما چنتا سوال دارم. از چه منابعی استفاده میکنید؟ سطح کتاب چیست (مقدماتی/متوسط/ پیشرفته)؟ فصل حاشیه با مارجین چه فرقی میکند، آیا همان border است؟ [[کاربر:Doostdar|دوستدار ایران بزرگ]] [[بحث کاربر:Doostdar|☎]] چهارشنبه،۲۱ خرداد ۱۴۰۴، ساعت ۲۳:۳۳ (ایران) ۱۱ ژوئن ۲۰۲۵، ساعت ۱۹:۰۳ (UTC)
:درود بر شما
:باسپاس
:منابع این کتاب مختلف هست اما معمولا w3schools و mdn و geekforgeeks البته این منبع ها فقط برای سر فصل ها هستند.
:در مورد سطح کتاب این کتاب تمام css را در برمیگیرد و فصل های نخست مقدماتی و فصل های بعدی عمیق تر میشود و تمام مفاهیم را در برمیگرد.
:در واقع یک آموزش کامل برای css
:در css مارجین به فاصله بین عنصر ها گفته میشود (البته مفهوم اصلی کمی فرق میکند).
:منظور من از حاشیه همان border است.
:اگر امکانش هست ساختار فصل بندی ها را زیباتر کنید و در صفحات صفحه قبلی/بعدی را قرار دهید.
:باسپاس بیکران [[کاربر:Fwldom|Fwldom]] ([[بحث کاربر:Fwldom|بحث]]) ۱۲ ژوئن ۲۰۲۵، ساعت ۱۸:۲۶ (UTC)
::منابع و هدف کتاب را باید درون کتاب ذکر کنید. مهم این است محتوای کتاب به درد کاربران بخورد وگرنه هیچ ارزشی نخواهد داشت. ظاهر کتاب و تنظیم صفحه ها رو بنده انجام خواهم داد. [[کاربر:Doostdar|دوستدار ایران بزرگ]] [[بحث کاربر:Doostdar|☎]] شنبه،۲۴ خرداد ۱۴۰۴، ساعت ۱۴:۱۰ (ایران) ۱۴ ژوئن ۲۰۲۵، ساعت ۰۹:۴۰ (UTC)
== تکمیل کتاب ==
{{پب|Fwldom}} درود. این کتاب رو تا حد زیادی نوشتید اما بخش های زیادی هنوز ناکامل هستند و نیاز به مشارکت دیگر کاربران داریم. چه راهنماییای برای کامل کردن این کتاب دارید؟ [[کاربر:Doostdar|دوستدار ایران بزرگ]] [[بحث کاربر:Doostdar|☎]] دوشنبه،۹ تیر ۱۴۰۴، ساعت ۱۰:۵۹ (ایران) ۳۰ ژوئن ۲۰۲۵، ساعت ۰۶:۲۹ (UTC)
:درود بر شما، بخش منابع کتاب رو اضافه کردم نویسندگان میتوانند استفاده کنند سر فصل ها شبیه است. [[کاربر:Fwldom|Fwldom]] ([[بحث کاربر:Fwldom|بحث]]) ۲ ژوئیهٔ ۲۰۲۵، ساعت ۱۹:۲۱ (UTC)
== کدام مرورگرهای اینترنت از سی اس اس پشتیبانی میکنند؟ ==
{{پب|Fwldom}} درود. آیا فقط اپرا و گوگل کروم از CSS پشتیبانی میکنند یا همه مرورگرهای اینترنت از آن پشتیبانی میکنند؟ [[کاربر:Doostdar|دوستدار ایران بزرگ]] [[بحث کاربر:Doostdar|☎]] دوشنبه،۹ تیر ۱۴۰۴، ساعت ۱۱:۱۹ (ایران) ۳۰ ژوئن ۲۰۲۵، ساعت ۰۶:۴۹ (UTC)
:درود بر شما، تقریبا مرورگر های در حال توسعه از css پشتیبانی میکنند حتی مرورگر IE هم پشتیبانی میکند. میتوان گفت تمام مرورگر ها. [[کاربر:Fwldom|Fwldom]] ([[بحث کاربر:Fwldom|بحث]]) ۲ ژوئیهٔ ۲۰۲۵، ساعت ۱۹:۲۲ (UTC)
3jgzdgypghvc9mlsrzftkso4fu767k7
سیاساس/حاشیه
0
41278
132026
131912
2025-07-02T20:54:14Z
Doostdar
6290
added [[Category:سیاساس]] با استفاده از ردهساز
132026
wikitext
text/x-wiki
== CSS Border (کادر یا حاشیه در CSS) ==
در CSS، ویژگیهای مربوط به حاشیه (Border) به شما این امکان را میدهند که ظاهر مرزهای اطراف یک عنصر HTML را تعیین کنید. این ویژگیها شامل نوع بوردر، ضخامت، رنگ و شعاع گوشهها میباشند.
=== مروری سریع ===
ویژگیهای اصلی مرز در CSS:
*<code>border</code> – ویژگی خلاصه برای تنظیم نوع، ضخامت و رنگ کادر
*<code>border-style</code> – نوع نمایش کادر
*<code>border-width</code> – ضخامت کادر
*<code>border-color</code> – رنگ کادر
*<code>border-radius</code> – گرد کردن گوشههای کادر
== ویژگی border ==
ویژگی <code>border</code> یک ویژگی shorthand است که سه ویژگی زیر را بهصورت همزمان تنظیم میکند:
*<code>border-width</code>
*<code>border-style</code> (ضروری)
*<code>border-color</code>
مثال:
<syntaxhighlight lang="css">
p {
border: 2px solid red;
}
</syntaxhighlight>
* یک کادر با ضخامت 2px از نوع solid با رنگ red (قرمز)
== ویژگی border-style ==
این ویژگی نوع کادر را تعیین میکند. مقادیر قابل قبول:
*<code>none</code> – بدون کادر
*<code>hidden</code> – کادر مخفی (وجود دارد و فضا اشغال میکند اما مخفی است)
*<code>solid</code> – کادر خطی یکدست
*<code>dashed</code> – کادر خطچین
*<code>dotted</code> – کادر نقطهچین
*<code>double</code> – کادر دوتایی
*<code>groove</code> – کادر برجسته فرورفته (۳D)
*<code>ridge</code> – کادر برجسته بیرونزده (۳D)
*<code>inset</code> – کادر فرورفته
*<code>outset</code> – کادر بیرونزده
استفاده از یک تا چهار مقدار برای جهتهای مختلف:
<syntaxhighlight lang="css">
/* چهار مقدار: بالا، راست، پایین، چپ */
border-style: dotted solid double dashed;
/* دو مقدار: بالا و پایین - راست و چپ */
border-style: solid dashed;
/* یک مقدار برای همه طرفها */
border-style: solid;
</syntaxhighlight>
== ویژگی border-width ==
ضخامت مرز را تعیین میکند. میتوان از واحدهایی مثل <code>px</code>، <code>em</code> یا کلمات کلیدی زیر استفاده کرد:
*<code>thin</code>
*<code>medium</code>
*<code>thick</code>
مثال:
<syntaxhighlight lang="css">
p {
border-style: solid;
border-width: 5px 10px 3px 8px; /* بالا، راست، پایین، چپ */
}
</syntaxhighlight>
== ویژگی border-color ==
این ویژگی رنگ مرزها را تعیین میکند. میتوان از انواع فرمتهای رنگ استفاده کرد:
*نام رنگ: <code>red</code>, <code>blue</code>, ...
*مقدار HEX: <code>#ff0000</code>
*مقدار RGB: <code>rgb(255, 0, 0)</code>
*مقدار HSL: <code>hsl(0, 100%, 50%)</code>
*مقدار <code>transparent</code> برای مرز شفاف
مثال:
<syntaxhighlight lang="css">
p {
border-style: solid;
border-color: red green blue yellow; /* بالا، راست، پایین، چپ */
}
</syntaxhighlight>
== ویژگی border-radius ==
برای گرد کردن گوشههای عنصر استفاده میشود.
مثال:
<syntaxhighlight lang="css">
p {
border: 2px solid red;
border-radius: 10px;
}
</syntaxhighlight>
== کادر جداگانه ==
CSS اجازه میدهد هر طرف کادر را بهصورت جداگانه تنظیم کنید:
*<code>border-top</code>
*<code>border-right</code>
*<code>border-bottom</code>
*<code>border-left</code>
همچنین میتوان هر طرف را بهصورت مجزا با رنگ، ضخامت یا نوع تنظیم کرد:
<syntaxhighlight lang="css">
p {
border-top-style: dotted;
border-right-width: 5px;
border-bottom-color: red;
}
</syntaxhighlight>
== ویژگیهای shorthand برای هر طرف ==
میتوانید برای هر طرف نیز از shorthand استفاده کنید:
<syntaxhighlight lang="css">
div {
border-top: 2px solid blue;
border-left: 3px dotted green;
}
</syntaxhighlight>
== جدول ویژگیهای CSS Border ==
*<code>border</code>
*<code>border-top</code>
*<code>border-right</code>
*<code>border-bottom</code>
*<code>border-left</code>
*<code>border-style</code>
*<code>border-width</code>
*<code>border-color</code>
*<code>border-radius</code>
[[رده:سیاساس]]
nzbf97sws2g1m4qcwyl3lm7n1kaxz2r
سیاساس/margin
0
41284
132025
131927
2025-07-02T20:53:39Z
Doostdar
6290
added [[Category:سیاساس]] با استفاده از ردهساز
132025
wikitext
text/x-wiki
== مقذمه ==
در CSS، ویژگی <code>margin</code> برای تنظیم فاصلهی بیرونی عناصر از یکدیگر استفاده میشود. این ویژگی یکی از مهمترین ابزارها برای چیدمان عناصر در صفحه است و در کنار ویژگیهایی مثل <code>padding</code> و <code>border</code> نقش کلیدی در طراحی رابط کاربری و تجربه کاربری دارد.
== تعریف ==
<code>margin</code> فضای خارجی اطراف یک عنصر را مشخص میکند؛ یعنی فاصلهٔ آن عنصر تا عناصر دیگر یا لبهٔ صفحه.
== نحو (Syntax) ==
<syntaxhighlight lang="css">
margin: [top] [right] [bottom] [left];
</syntaxhighlight>
مثال:
<syntaxhighlight lang="css">
margin: 10px 20px 15px 5px;
</syntaxhighlight>
↑ یعنی:
* بالا: ۱۰px
* راست: ۲۰px
* پایین: ۱۵px
* چپ: ۵px
اگر فقط یک مقدار نوشته شود، برای همهٔ جهات اعمال میشود.
== مقادیر قابل قبول ==
* مقادیر ثابت: <code>px</code>، <code>em</code>، <code>rem</code>، <code>%</code> و ...
* مقدار <code>auto</code>: معمولاً برای مرکزچین کردن عناصر افقی مانند یک <code>div</code> استفاده میشود.
* مقدار <code>inherit</code>: مقدار از عنصر والد به ارث میرسد.
* مقدار <code>initial</code>: مقدار پیشفرض مرورگر
== مثال ساده ==
<syntaxhighlight lang="html">
<div style="margin: 20px;">
سلام دنیا!
</div>
</syntaxhighlight>
== ویژگیهای مرتبط ==
برای کنترل مجزای هر جهت:
<syntaxhighlight lang="css">
margin-top: 20px;
margin-right: 10px;
margin-bottom: 15px;
margin-left: 5px;
</syntaxhighlight>
== مثال: مرکزچین کردن یک div ==
<syntaxhighlight lang="html">
<div style="width: 300px; margin: 0 auto;">
این div به صورت افقی مرکزچین شده است.
</div>
</syntaxhighlight>
== تفاوت margin و padding ==
{| class="wikitable"
! ویژگی !! margin !! padding
|-
| تعریف || فاصلهٔ بیرونی عنصر || فاصلهٔ درونی تا محتوای عنصر
|-
| تاثیر بر پسزمینه || در ناحیهٔ margin رنگ پسزمینه دیده نمیشود || در ناحیهٔ padding رنگ پسزمینه دیده میشود
|-
| امکان استفادهٔ auto || بله، برای مرکزچین || خیر
|}
== نکات کاربردی برای طراحی ==
* استفاده از <code>margin: auto;</code> بسیار مناسب برای مرکزچین کردن عناصر بلاک در عرض مشخص است.
* در طراحی ریسپانسیو، بهتر است از واحدهایی مانند <code>%</code> یا <code>rem</code> به جای <code>px</code> استفاده شود.
* رعایت نظم در استفاده از margin (مثلاً استفاده از فاصلههای ۴، ۸، ۱۲، ۱۶، ...) به طراحی هماهنگتر کمک میکند.
* استفاده زیاد از margin میتواند به مشکلات تداخل فضای خالی (Collapsing Margins) منجر شود.
== نکته مهم: Collapsing Margins ==
در HTML/CSS، زمانی که دو عنصر بلاک پشت سر هم قرار میگیرند و هر دو margin بالا/پایین دارند، مرورگر فقط بزرگترین آنها را اعمال میکند، نه مجموعشان.
<syntaxhighlight lang="html">
<div style="margin-bottom: 20px;"></div>
<div style="margin-top: 30px;"></div>
<!-- فاصله واقعی بین این دو div برابر 30px است نه 50px -->
</syntaxhighlight>
----
== تمرین: فاصله دادن به کارتها ==
<syntaxhighlight lang="html">
<div style="margin: 1rem; padding: 1rem; border: 1px solid #ccc;">
کارت شماره ۱
</div>
<div style="margin: 1rem; padding: 1rem; border: 1px solid #ccc;">
کارت شماره ۲
</div>
</syntaxhighlight>
== جمعبندی ==
ویژگی <code>margin</code> یکی از کلیدیترین ابزارها در طراحی صفحات وب است. استفادهٔ مناسب از آن باعث نظم بصری، خوانایی بهتر، و رابط کاربری حرفهایتر میشود. درک تفاوت آن با <code>padding</code> و آشنایی با ویژگیهای مرتبط مانند <code>auto</code> و <code>collapsing margins</code> برای طراحی حرفهای ضروری است.
----
'''مطالعهٔ بیشتر:'''
*
*
*
[[رده:سیاساس]]
3nmqk2v336bpf4z4g034tceinc3ew6j
سیاساس/فاصله درونی
0
41285
132027
131928
2025-07-02T20:54:39Z
Doostdar
6290
added [[Category:سیاساس]] با استفاده از ردهساز
132027
wikitext
text/x-wiki
= سیاساس/فاصله درونی (padding) =
در CSS، ویژگی <code>padding</code> برای ایجاد فاصلهٔ درونی بین محتوای عنصر و مرز (border) آن استفاده میشود. این فاصله باعث میشود محتوا از لبهها فاصله بگیرد و خوانایی و زیبایی بهتری داشته باشد.
----
== تعریف ==
ویژگی <code>padding</code> فاصلهای بین محتوای عنصر و مرز آن ایجاد میکند. این فاصله در داخل عنصر قرار میگیرد، برعکس <code>margin</code> که بیرون عنصر است.
== نحو (Syntax) ==
<syntaxhighlight lang="css">
padding: [top] [right] [bottom] [left];
</syntaxhighlight>
مثال:
<syntaxhighlight lang="css">
padding: 10px 20px 15px 5px;
</syntaxhighlight>
↑ یعنی:
* بالا: ۱۰px
* راست: ۲۰px
* پایین: ۱۵px
* چپ: ۵px
اگر فقط یک مقدار داده شود، برای همهٔ جهات اعمال میشود.
----
== ویژگیهای مرتبط ==
برای کنترل هر جهت بهصورت مستقل:
<syntaxhighlight lang="css">
padding-top: 20px;
padding-right: 10px;
padding-bottom: 15px;
padding-left: 5px;
</syntaxhighlight>
----
== مثال ساده ==
<syntaxhighlight lang="html">
<div style="padding: 20px; border: 1px solid #000;">
این متن از لبههای div فاصله دارد.
</div>
</syntaxhighlight>
----
== تفاوت padding با margin ==
{| class="wikitable"
! ویژگی || padding || margin
|-
| مکان قرارگیری || داخل عنصر || بیرون عنصر
|-
| رنگ پسزمینه اعمال میشود؟ || بله || نه
|-
| تاثیر بر ابعاد عنصر || باعث افزایش اندازه واقعی عنصر میشود || نه (در حالت معمول)
|}
----
== استفاده از واحدهای نسبی ==
برای طراحی ریسپانسیو بهتر است از <code>em</code>، <code>rem</code> یا <code>%</code> استفاده شود:
<syntaxhighlight lang="css">
padding: 2rem;
</syntaxhighlight>
<syntaxhighlight lang="css">
padding: 5% 10%;
</syntaxhighlight>
----
== مثال: دکمه با فاصله درونی مناسب ==
<syntaxhighlight lang="html">
<button style="padding: 10px 20px;">
کلیک کن
</button>
</syntaxhighlight>
----
== تاثیر در تجربه کاربری (UX) ==
استفاده صحیح از <code>padding</code> باعث افزایش وضوح، خوانایی و تعامل بهتر کاربر با رابط میشود. در طراحی دکمهها، کارتها، فرمها و منوها، این ویژگی نقش مهمی دارد.
----
== تاثیر در سئو ==
اگرچه <code>padding</code> مستقیماً در رتبهبندی سئو تأثیر ندارد، اما رابط کاربری بهتر = تجربه کاربری بهتر = نرخ تعامل بالاتر، که تأثیر غیرمستقیم در سئو دارد.
----
== تمرین: طراحی یک کارت محتوا ==
<syntaxhighlight lang="html">
<div style="padding: 1rem; background-color: #f9f9f9; border: 1px solid #ccc;">
<h2>عنوان</h2>
<p>محتوای این کارت با فاصلهٔ مناسب از لبهها نمایش داده شده است.</p>
</div>
</syntaxhighlight>
----
== جمعبندی ==
ویژگی <code>padding</code> یکی از ابزارهای پایهای و بسیار مؤثر در CSS برای طراحی رابط کاربری زیبا، خوانا و هماهنگ است. درک تفاوت آن با <code>margin</code> و استفاده درست از آن، باعث ایجاد طراحی حرفهایتر و تجربه کاربری بهتر میشود.
'''مطالعه بیشتر:'''
* [[سیاساس/margin]]
* [[سیاساس/عرض و ارتفاع]]
[[رده:سیاساس]]
me1chx7obuaq0ufijwq0r2qe8v2ia0d
سیاساس/عرض و ارتفاع
0
41286
132028
131931
2025-07-02T20:54:59Z
Doostdar
6290
added [[Category:سیاساس]] با استفاده از ردهساز
132028
wikitext
text/x-wiki
= سیاساس/عرض و ارتفاع =
ویژگیهای <code>width</code> (عرض) و <code>height</code> (ارتفاع) در CSS برای تعیین اندازهٔ عناصر HTML استفاده میشوند. این ویژگیها پایهایترین ابزارها برای طراحی دقیق و منظم در صفحات وب هستند و نقش اساسی در ساختار چیدمان، ریسپانسیو بودن، و طراحی سازگار با انواع دستگاهها دارند.
----
== تعریف ==
* <code>width</code>: تعیین عرض عنصر
* <code>height</code>: تعیین ارتفاع عنصر
این ویژگیها میتوانند مقدارهای مختلفی مانند پیکسل (px)، درصد (%)، <code>em</code>، <code>vw</code>، <code>vh</code> و ... بپذیرند.
----
== نحوه استفاده ==
<syntaxhighlight lang="css">
width: 300px;
height: 200px;
</syntaxhighlight>
== مثال ساده ==
<syntaxhighlight lang="html">
<div style="width: 300px; height: 200px; background-color: lightblue;">
یک جعبه با عرض ۳۰۰ و ارتفاع ۲۰۰ پیکسل
</div>
</syntaxhighlight>
----
== واحدهای متداول ==
{| class="wikitable"
! واحد || توضیح
|-
| <code>px</code> || پیکسل – مقدار دقیق و ثابت
|-
| <code>%</code> || درصد نسبت به عنصر والد
|-
| <code>em</code> / <code>rem</code> || وابسته به اندازه فونت – مناسب طراحی مقیاسپذیر
|-
| <code>vw</code> || درصدی از عرض پنجره مرورگر (View Width)
|-
| <code>vh</code> || درصدی از ارتفاع پنجره مرورگر (View Height)
|}
----
== مقدارهای خاص ==
* <code>auto</code> — مقدار پیشفرض، که به محتوای عنصر بستگی دارد.
* <code>inherit</code> — مقدار را از عنصر والد به ارث میبرد.
* <code>max-content</code> — عنصر تا جایی که محتوا نیاز دارد، گسترش مییابد.
* <code>min-content</code> — عنصر تا حداقل فضای ممکن برای محتوا کوچک میشود.
* <code>fit-content</code> — تلاش برای متناسبسازی محتوا با عرض/ارتفاع
----
== ارتفاع خودکار ==
اگر <code>height</code> تعیین نشود، ارتفاع عنصر بلاک به اندازهٔ محتوای آن خواهد بود.
<syntaxhighlight lang="html">
<div style="width: 300px; background: #eee;">
<p>ارتفاع این div با محتوا تغییر میکند.</p>
</div>
</syntaxhighlight>
----
== حداقل و حداکثر اندازه ==
برای کنترل بهتر روی اندازه میتوان از <code>min-width</code>، <code>max-width</code>، <code>min-height</code>، <code>max-height</code> استفاده کرد:
<syntaxhighlight lang="css">
max-width: 100%;
min-height: 100px;
</syntaxhighlight>
----
== مثال: تصویر با عرض واکنشگرا ==
<syntaxhighlight lang="html">
<img src="image.jpg" style="width: 100%; max-width: 500px;" alt="نمونه تصویر">
</syntaxhighlight>
↑ تصویر در صفحههای کوچک، کاملاً واکنشگرا میشود اما از ۵۰۰px بزرگتر نمیشود.
----
== تعامل با Box Model ==
مقدار width و height فقط فضای محتوای عنصر را تعیین میکنند. اگر padding، border یا margin داشته باشیم، اندازه کلی عنصر بزرگتر خواهد بود.
برای تغییر این رفتار میتوان از ویژگی <code>box-sizing</code> استفاده کرد:
<syntaxhighlight lang="css">
box-sizing: border-box;
</syntaxhighlight>
↑ با این تنظیم، padding و border در داخل width و height حساب میشوند.
----
== نمایش flex و grid ==
در layoutهای مدرن مانند Flexbox و Grid، رفتار width و height وابسته به تنظیمات والد است.
<syntaxhighlight lang="html">
<div style="display: flex;">
<div style="flex: 1; min-height: 100px;">...</div>
<div style="width: 200px;">...</div>
</div>
</syntaxhighlight>
----
== توجه به محتواهای دینامیک ==
در طراحی مدرن، محتوای متغیر (مثل متن کاربران، تصاویر آپلودی و ...) نیاز به استفاده از <code>max-width</code> و <code>overflow</code> دارد تا از شکست چیدمان جلوگیری شود.
<syntaxhighlight lang="css">
width: 100%;
max-width: 600px;
overflow: auto;
</syntaxhighlight>
----
== تاثیر در سئو ==
در طراحی موبایلفرندلی، تنظیم درست عرض با واحدهای نسبی و عدم استفاده از fixed width برای همهچیز باعث کاهش scroll افقی و بهبود تجربه کاربری میشود که در سئو تاثیر مستقیم دارد.
----
== تمرین: ساخت یک جعبه واکنشگرا ==
<syntaxhighlight lang="html">
<div style="width: 90%; max-width: 800px; margin: auto; padding: 1rem; background-color: #f0f0f0;">
این باکس در موبایل کوچکتر و در دسکتاپ حداکثر ۸۰۰px خواهد بود.
</div>
</syntaxhighlight>
----
== جمعبندی ==
تنظیم <code>width</code> و <code>height</code> بهدرستی، نهتنها ظاهر زیباتری ایجاد میکند بلکه به تجربه کاربری، طراحی واکنشگرا، و حتی سئو کمک میکند. استفادهٔ درست از واحدهای نسبی، محدودیتهای حداقلی و حداکثری، و درک رفتار <code>box-sizing</code> از الزامات یک طراح حرفهای CSS است.
----
'''مطالعهٔ بیشتر:'''
* [[سیاساس/box-model]]
* [[سیاساس/margin]]
* [[سیاساس/فاصله درونی]]
* [[سیاساس/display]]
* [[سیاساس/flex]]
[[رده:سیاساس]]
q4bwjhwxblwcqutdoi3h338rymco7l0
بحث:سیاساس/رنگ
1
41304
132014
131995
2025-07-02T19:25:48Z
Fwldom
26269
/* منبع */ پاسخ
132014
wikitext
text/x-wiki
== منبع ==
{{پب|Fwldom}} درود. منبع نوشتارهای این صفحه کجاست؟ w3schools یا mdn یا ...؟ [[کاربر:Doostdar|دوستدار ایران بزرگ]] [[بحث کاربر:Doostdar|☎]] دوشنبه،۹ تیر ۱۴۰۴، ساعت ۱۱:۱۲ (ایران) ۳۰ ژوئن ۲۰۲۵، ساعت ۰۶:۴۲ (UTC)
:w3schools [[کاربر:Fwldom|Fwldom]] ([[بحث کاربر:Fwldom|بحث]]) ۲ ژوئیهٔ ۲۰۲۵، ساعت ۱۹:۲۵ (UTC)
htchlhhg8yi31467euke2m7djfhcazk
بحث:سیاساس/margin
1
41306
132015
131998
2025-07-02T19:27:58Z
Fwldom
26269
/* برای مطالعه بیشتر */ پاسخ
132015
wikitext
text/x-wiki
== برای مطالعه بیشتر ==
{{پب|Fwldom}} درود. برای مطالعه بیشتر درباره margin چه وبگاه یا کتابی رو معرفی میکنید؟ [[کاربر:Doostdar|دوستدار ایران بزرگ]] [[بحث کاربر:Doostdar|☎]] دوشنبه،۹ تیر ۱۴۰۴، ساعت ۱۱:۲۱ (ایران) ۳۰ ژوئن ۲۰۲۵، ساعت ۰۶:۵۱ (UTC)
:درود بر شما
:مطلب مرتبط در سایت mdn:
:<nowiki>https://developer.mozilla.org/en-US/docs/Web/CSS/margin</nowiki> [[کاربر:Fwldom|Fwldom]] ([[بحث کاربر:Fwldom|بحث]]) ۲ ژوئیهٔ ۲۰۲۵، ساعت ۱۹:۲۷ (UTC)
9e9t5nt8wh47ut5z81ov5v8l7c1g0lr
بحث کاربر:Cordialement a
3
41310
132010
2025-07-02T15:32:15Z
New user message
8356
افزودن [[الگو:خوشامدید|پیام خوشآمد]] به صفحهٔ بحث کاربر تازه
132010
wikitext
text/x-wiki
== خوش آمدید ==
[[File:Carl Spitzweg 021-detail.jpg|thumb|left|180px|خوشآمدید!]]
<br/>
سلام {{PAGENAME}}، به ویکیکتاب خوش آمدید. از مشارکت شما سپاسگزارم. امیدوارم که از اینجا خوشتان بیاید و تصمیم به ماندن بگیرید. راهنماهای ویکیکتاب در [[راهنما:فهرست|اینجا]] است اما پیوندهای زیر برای کاربرهای جدید مفیدند:
{|
|-
|[[پرونده:Noia 64 apps help index.png|30px|right|link=ویکیکتاب:ویکیکتاب چیست؟|ویکینسک (ویکیکتاب) چیست؟]] || [[ویکیکتاب:ویکیکتاب چیست؟|ویکینسک (ویکیکتاب) چیست؟]]
|-
| [[پرونده:Nuvola apps ksig.png|30px|right|link=ویکیکتاب:آموزش سریع|آموزش سریع]] || [[ویکیکتاب:آموزش سریع|آموزش سریع]] آموزش کار با زبان مدیاویکی (محیط ویکیکتاب)
|-
| [[پرونده:Cscr-featured.svg|30px|right|link=ویکیکتاب:کتابهای برگزیده|کتابهای برگزیده]] || [[ویکیکتاب:کتابهای برگزیده|کتابهای برگزیده]] فهرستی از کتابهای برگزیده
|-
| [[پرونده:Nuvola apps chat.png|30px|right|link=ویکیکتاب:میز تحریر|میز تحریر]]||[[ویکیکتاب:میز تحریر]] برای گفتگو دربارهٔ مسائل فنی و سیاستها.
|-
| [[پرونده:Nuvola_apps_bookcase_1.svg|30px|right|link=ویکیکتاب:خودآموز/کمک کردن در یکی از کتابهای موجود|کمک کردن در یکی از کتابهای موجود]]||[[ویکیکتاب:خودآموز/کمک کردن در یکی از کتابهای موجود|کمک کردن در یکی از کتابهای موجود]] راههای تکمیل و ویرایش ایبوکهای ویکیکتاب
|-
|[[File:Bucket in the sand.svg|right|50px|link=ویکیکتاب:صفحه تمرین|صفحه تمرین]]||[[ویکیکتاب:صفحه تمرین|صفحه تمرین]] برای تمرین ویرایش
|-
|[[پرونده:Nuvola apps agent.svg|30px|right|link=w:ویکیکتاب:خودآموز|آموزش پیشرفته]]||[[w:ویکیپدیا:خودآموز|آموزش پیشرفته]]
|-
|'''پروژههای دیگر بنیاد'''||[[پرونده:Wikipedia-logo.png|20px|link=w:صفحه_اصلی|ویکیپدیا]][[پرونده:HSWikimedia.svg|25px|link=m:Special:Recentchanges|فراویکی]] [[پرونده:HSCommons.svg|25px|link=commons:Special:Recentchanges|ویکیانبار]][[پرونده:HSWNews.svg|25px|link=n:ویژه:تغییرات اخیر|ویکیخبر]] [[پرونده:HSWtionary.svg|25px|link=wikt:صفحه_اصلی|ویکیواژه]] [[پرونده:HSWQuote.svg|25px|link=q:صفحه_اصلی|ویکیگفتاورد]][[پرونده:HSWSource.svg|30px|link=s:صفحه_اصلی|ویکینبشته]][[پرونده:Wikidata-logo.svg|25px|link=wikidata:صفحه_اصلی|ویکیداده]]
|}
امیدوارم از ''[[ویکینسک:ویکینسکنویسان|ویکینسکنویس]]'' بودن لذت ببرید! لطفاً برای آزمایش از [[ویکیکتاب:گودال ماسهبازی]] استفاده کنید. باز هم خوش آمد میگویم.شاد باشید!
-- [[کاربر:New user message|New user message]] ([[بحث کاربر:New user message|بحث]]) ۲ ژوئیهٔ ۲۰۲۵، ساعت ۱۵:۳۲ (UTC)
4hv7c5u3l1mnel1vgp0n1hnh29jh0ji
سیاساس/واحدها
0
41311
132017
2025-07-02T19:37:38Z
Fwldom
26269
ایجاد صفحه
132017
wikitext
text/x-wiki
== مقدمه ==
در CSS برای تعیین اندازهٔ عناصر مختلف مانند طول، عرض، حاشیه، فاصلهها، اندازهٔ فونت و ... از «واحدهای اندازهگیری» استفاده میشود. دانستن تفاوت بین این واحدها به طراح کمک میکند که طراحی واکنشگرا، دقیق و سازگار با صفحهنمایشهای مختلف ایجاد کند.
واحدهای اندازهگیری در CSS به دو دستهٔ کلی تقسیم میشوند:
* '''واحدهای مطلق''' (Absolute units)
* '''واحدهای نسبی''' (Relative units)
== واحدهای مطلق ==
واحدهای مطلق همیشه اندازهٔ مشخص و ثابتی دارند و نسبت به صفحهنمایش یا عنصر والد تغییر نمیکنند. این واحدها معمولاً برای چاپ (Print) یا مواردی که اندازه باید دقیق باشد استفاده میشوند.
=== لیست واحدهای مطلق ===
{| class="wikitable"
! واحد !! توضیح !! معادل تقریبی
|-
| px || پیکسل؛ رایجترین واحد در طراحی صفحات وب || 1px ≈ یک پیکسل در صفحهنمایش
|-
| pt || پوینت؛ معمولاً در چاپ استفاده میشود || 1pt = 1/72 اینچ
|-
| pc || پایکا؛ کمتر استفاده میشود || 1pc = 12pt
|-
| in || اینچ || 1in = 2.54cm = 96px
|-
| cm || سانتیمتر || 1cm ≈ 37.8px
|-
| mm || میلیمتر || 1mm ≈ 3.78px
|}
== واحدهای نسبی ==
واحدهای نسبی بر اساس اندازه یا ویژگیهای سایر عناصر (مثل عنصر والد، یا اندازهٔ فونت پایهٔ مرورگر) تعریف میشوند. این واحدها برای طراحی واکنشگرا (Responsive) بسیار مناسب هستند.
=== لیست واحدهای نسبی ===
{| class="wikitable"
! واحد !! توضیح
|-
| em || نسبت به اندازهٔ فونت عنصر والد (1em = اندازهٔ فونت جاری)
|-
| rem || نسبت به اندازهٔ فونت عنصر ریشه (html)
|-
| % || درصدی از ویژگی مرجع (مثلاً عرض والد)
|-
| vw || درصدی از عرض پنجرهٔ مرورگر (1vw = 1% از عرض ویوپورت)
|-
| vh || درصدی از ارتفاع پنجرهٔ مرورگر
|-
| vmin || کوچکتر از vw و vh
|-
| vmax || بزرگتر از vw و vh
|-
| ex || ارتفاع حرف "x" در فونت جاری
|-
| ch || عرض عدد صفر (0) در فونت جاری
|}
== تفاوت بین px، em و rem ==
برای درک بهتر تفاوت بین این سه واحد رایج، به مثال زیر توجه کنید:
<syntaxhighlight lang="css">
html {
font-size: 16px;
}
.container {
font-size: 1.5em; /* برابر با 24px چون 1.5 * 16 */
}
.box1 {
width: 200px;
}
.box2 {
width: 10em; /* نسبت به font-size والد */
}
.box3 {
width: 10rem; /* نسبت به font-size عنصر html */
}
</syntaxhighlight>
== پیشنهاد برای استفاده ==
* برای اندازه فونتها در طراحی واکنشگرا بهتر است از '''rem''' یا '''em''' استفاده شود.
* برای فاصلهها و ابعاد اغلب '''px''' یا '''%''' مناسب هستند.
* برای سازگاری بیشتر در صفحهنمایشهای مختلف از واحدهای '''vw/vh''' استفاده کنید.
== نکات مهم ==
* مرورگرهای مدرن به خوبی از همهٔ این واحدها پشتیبانی میکنند.
* استفاده ترکیبی از چند واحد (مثلاً `calc(100% - 20px)`) بسیار رایج است.
* تفاوت بین `em` و `rem` در ارجاع به عنصر والد یا ریشه است.
== تمرین ==
کدی بنویسید که یک <code>div</code> به اندازهٔ 50% عرض مرورگر داشته باشد و ارتفاع آن برابر با 30vh باشد. همچنین اندازهٔ فونت داخل آن با استفاده از واحد <code>rem</code> تنظیم شود.
== کاربرد این صفحه از آموزش css ==
درک دقیق تفاوت و کاربرد هر واحد اندازهگیری به شما کمک میکند که طراحیهای دقیق، زیبا و واکنشگرا بسازید. توصیه میشود همیشه به سازگاری در دستگاههای مختلف و وضوح صفحهنمایشها توجه داشته باشید.
[[رده:سیاساس]]
hgizxd3r9no3eyhrk04jaziy0tm3rk5
سیاساس/گرادیان
0
41312
132018
2025-07-02T19:42:52Z
Fwldom
26269
صفحهای تازه حاوی « == مقدمه == '''گرادینت''' (Gradient) در CSS به معنای ایجاد یک طیف رنگی پیوسته بین دو یا چند رنگ است. این ویژگی به طراحان امکان میدهد که بدون نیاز به تصاویر، پسزمینههایی زیبا و انعطافپذیر ایجاد کنند. گرادینتها در CSS معمولاً در ویژگی <code>background-image</cod...» ایجاد کرد
132018
wikitext
text/x-wiki
== مقدمه ==
'''گرادینت''' (Gradient) در CSS به معنای ایجاد یک طیف رنگی پیوسته بین دو یا چند رنگ است. این ویژگی به طراحان امکان میدهد که بدون نیاز به تصاویر، پسزمینههایی زیبا و انعطافپذیر ایجاد کنند.
گرادینتها در CSS معمولاً در ویژگی <code>background-image</code> استفاده میشوند و انواع مختلفی دارند که از جمله میتوان به گرادینت خطی (linear-gradient)، گرادینت شعاعی (radial-gradient)، و گرادینت مخروطی (conic-gradient) اشاره کرد.
== انواع گرادینتها ==
=== ۱. گرادینت خطی (linear-gradient) ===
این نوع گرادینت، رنگها را در یک خط مستقیم از یک رنگ به رنگ دیگر تغییر میدهد.
==== سینتکس ====
<syntaxhighlight lang="css">
background-image: linear-gradient([زاویه یا جهت], رنگ۱, رنگ۲, ...);
</syntaxhighlight>
==== مثال ====
<syntaxhighlight lang="css">
background-image: linear-gradient(to right, red, orange, yellow);
</syntaxhighlight>
==== نکات ====
* جهت میتواند `to right`, `to bottom left`, یا عددی مانند `45deg` باشد.
* تعداد رنگها میتواند بیشتر از دو باشد.
* میتوان درصد یا محل توقف (stop points) مشخص کرد:
<code>linear-gradient(to right, red 0%, yellow 50%, green 100%)</code>
----
=== ۲. گرادینت شعاعی (radial-gradient) ===
این گرادینت از یک نقطه شروع شده و به صورت دایرهای یا بیضی به سمت بیرون گسترش مییابد.
==== سینتکس ====
<syntaxhighlight lang="css">
background-image: radial-gradient([شکل و مکان شروع], رنگ۱, رنگ۲, ...);
</syntaxhighlight>
==== مثال ====
<syntaxhighlight lang="css">
background-image: radial-gradient(circle, blue, lightblue, white);
</syntaxhighlight>
==== گزینهها ====
* اشکال: `circle`, `ellipse`
* مکان شروع: `at center`, `at top left`, `at 20% 30%`
----
=== ۳. گرادینت مخروطی (conic-gradient) ===
در این نوع گرادینت، رنگها به صورت دایرهای و چرخشی از یک نقطه مرکزی پخش میشوند.
==== سینتکس ====
<syntaxhighlight lang="css">
background-image: conic-gradient([from زاویه] [at موقعیت], رنگها);
</syntaxhighlight>
==== مثال ====
<syntaxhighlight lang="css">
background-image: conic-gradient(from 0deg at center, red, yellow, green, red);
</syntaxhighlight>
==== نکات ====
* از CSS Level 4 پشتیبانی میشود.
* برای ساخت چارت یا نمودارهای دایرهای بسیار کاربردی است.
== مقایسه انواع گرادینت ==
{| class="wikitable"
! نوع گرادینت !! جهت انتشار !! شکل !! کاربرد رایج
|-
| linear-gradient || خطی (زاویهای) || خط مستقیم || پسزمینه، دکمهها
|-
| radial-gradient || از مرکز به بیرون || دایره یا بیضی || افکت نور یا روشنایی
|-
| conic-gradient || چرخشی دور مرکز || دایرهای (360 درجه) || نمودار، ساعت، چرخ رنگ
|}
== گرادینت تکرارشونده ==
برای ساخت الگوهای راهراه یا تکرارشونده، میتوان از گرادینتهای تکرارشونده استفاده کرد:
<syntaxhighlight lang="css">
background-image: repeating-linear-gradient(45deg, #000, #000 10px, #fff 10px, #fff 20px);
</syntaxhighlight>
== استفاده از opacity در گرادینت ==
برای ایجاد شفافیت، میتوان از رنگهای RGBA یا HSL با مقدار شفافیت استفاده کرد:
<syntaxhighlight lang="css">
background-image: linear-gradient(to right, rgba(255,0,0,0.5), rgba(255,255,0,0.8));
</syntaxhighlight>
== گرادینت چندلایه ==
میتوان چندین گرادینت را در یک عنصر ترکیب کرد:
<syntaxhighlight lang="css">
background-image:
linear-gradient(to right, rgba(0,0,0,0.2), rgba(0,0,0,0.2)),
radial-gradient(circle at center, red, blue);
</syntaxhighlight>
== سازگاری مرورگر ==
{| class="wikitable"
! مرورگر !! پشتیبانی از linear !! radial !! conic
|-
| Chrome || بله || بله || از نسخه 69+
|-
| Firefox || بله || بله || از نسخه 83+
|-
| Safari || بله || بله || از نسخه 12.1+
|-
| Edge || بله || بله || بله
|}
== تمرین ==
یک کادر بسازید که پسزمینهٔ آن از آبی به سبز به صورت خطی از بالا به پایین گرادینت داشته باشد و وسط آن نوشتهای با رنگ سفید قرار گیرد.
== نکات مهم ==
* گرادینتها تصویر نیستند، بلکه توابع تولید رنگ هستند.
* بهتر است از گرادینت به عنوان جایگزین تصاویر استفاده شود تا حجم صفحات کاهش یابد.
* گرادینت با انیمیشن ترکیبپذیر است و میتواند افکتهای چشمنوازی ایجاد کند.
* در نسخههای قدیمی مرورگرها ممکن است نیاز به پیشوندها باشد (مانند <code>-webkit-</code>)، اما امروزه اغلب نیازی نیست.
== کاربرد این صفحخ از آموزش css ==
گرادینتها ابزار قدرتمند و انعطافپذیری برای طراحی مدرن و زیبای صفحات وب هستند. با شناخت انواع آنها و نحوه استفادهٔ درست، میتوان جلوههای بصری حرفهای و واکنشگرا ایجاد کرد.
[[رده:سیاس]]
f9gti0suv3w0spbamijvxunp0iovd2y
132029
132018
2025-07-02T20:56:37Z
Doostdar
6290
removed [[Category:سیاس]]; added [[Category:سیاساس]] با استفاده از ردهساز
132029
wikitext
text/x-wiki
== مقدمه ==
'''گرادینت''' (Gradient) در CSS به معنای ایجاد یک طیف رنگی پیوسته بین دو یا چند رنگ است. این ویژگی به طراحان امکان میدهد که بدون نیاز به تصاویر، پسزمینههایی زیبا و انعطافپذیر ایجاد کنند.
گرادینتها در CSS معمولاً در ویژگی <code>background-image</code> استفاده میشوند و انواع مختلفی دارند که از جمله میتوان به گرادینت خطی (linear-gradient)، گرادینت شعاعی (radial-gradient)، و گرادینت مخروطی (conic-gradient) اشاره کرد.
== انواع گرادینتها ==
=== ۱. گرادینت خطی (linear-gradient) ===
این نوع گرادینت، رنگها را در یک خط مستقیم از یک رنگ به رنگ دیگر تغییر میدهد.
==== سینتکس ====
<syntaxhighlight lang="css">
background-image: linear-gradient([زاویه یا جهت], رنگ۱, رنگ۲, ...);
</syntaxhighlight>
==== مثال ====
<syntaxhighlight lang="css">
background-image: linear-gradient(to right, red, orange, yellow);
</syntaxhighlight>
==== نکات ====
* جهت میتواند `to right`, `to bottom left`, یا عددی مانند `45deg` باشد.
* تعداد رنگها میتواند بیشتر از دو باشد.
* میتوان درصد یا محل توقف (stop points) مشخص کرد:
<code>linear-gradient(to right, red 0%, yellow 50%, green 100%)</code>
----
=== ۲. گرادینت شعاعی (radial-gradient) ===
این گرادینت از یک نقطه شروع شده و به صورت دایرهای یا بیضی به سمت بیرون گسترش مییابد.
==== سینتکس ====
<syntaxhighlight lang="css">
background-image: radial-gradient([شکل و مکان شروع], رنگ۱, رنگ۲, ...);
</syntaxhighlight>
==== مثال ====
<syntaxhighlight lang="css">
background-image: radial-gradient(circle, blue, lightblue, white);
</syntaxhighlight>
==== گزینهها ====
* اشکال: `circle`, `ellipse`
* مکان شروع: `at center`, `at top left`, `at 20% 30%`
----
=== ۳. گرادینت مخروطی (conic-gradient) ===
در این نوع گرادینت، رنگها به صورت دایرهای و چرخشی از یک نقطه مرکزی پخش میشوند.
==== سینتکس ====
<syntaxhighlight lang="css">
background-image: conic-gradient([from زاویه] [at موقعیت], رنگها);
</syntaxhighlight>
==== مثال ====
<syntaxhighlight lang="css">
background-image: conic-gradient(from 0deg at center, red, yellow, green, red);
</syntaxhighlight>
==== نکات ====
* از CSS Level 4 پشتیبانی میشود.
* برای ساخت چارت یا نمودارهای دایرهای بسیار کاربردی است.
== مقایسه انواع گرادینت ==
{| class="wikitable"
! نوع گرادینت !! جهت انتشار !! شکل !! کاربرد رایج
|-
| linear-gradient || خطی (زاویهای) || خط مستقیم || پسزمینه، دکمهها
|-
| radial-gradient || از مرکز به بیرون || دایره یا بیضی || افکت نور یا روشنایی
|-
| conic-gradient || چرخشی دور مرکز || دایرهای (360 درجه) || نمودار، ساعت، چرخ رنگ
|}
== گرادینت تکرارشونده ==
برای ساخت الگوهای راهراه یا تکرارشونده، میتوان از گرادینتهای تکرارشونده استفاده کرد:
<syntaxhighlight lang="css">
background-image: repeating-linear-gradient(45deg, #000, #000 10px, #fff 10px, #fff 20px);
</syntaxhighlight>
== استفاده از opacity در گرادینت ==
برای ایجاد شفافیت، میتوان از رنگهای RGBA یا HSL با مقدار شفافیت استفاده کرد:
<syntaxhighlight lang="css">
background-image: linear-gradient(to right, rgba(255,0,0,0.5), rgba(255,255,0,0.8));
</syntaxhighlight>
== گرادینت چندلایه ==
میتوان چندین گرادینت را در یک عنصر ترکیب کرد:
<syntaxhighlight lang="css">
background-image:
linear-gradient(to right, rgba(0,0,0,0.2), rgba(0,0,0,0.2)),
radial-gradient(circle at center, red, blue);
</syntaxhighlight>
== سازگاری مرورگر ==
{| class="wikitable"
! مرورگر !! پشتیبانی از linear !! radial !! conic
|-
| Chrome || بله || بله || از نسخه 69+
|-
| Firefox || بله || بله || از نسخه 83+
|-
| Safari || بله || بله || از نسخه 12.1+
|-
| Edge || بله || بله || بله
|}
== تمرین ==
یک کادر بسازید که پسزمینهٔ آن از آبی به سبز به صورت خطی از بالا به پایین گرادینت داشته باشد و وسط آن نوشتهای با رنگ سفید قرار گیرد.
== نکات مهم ==
* گرادینتها تصویر نیستند، بلکه توابع تولید رنگ هستند.
* بهتر است از گرادینت به عنوان جایگزین تصاویر استفاده شود تا حجم صفحات کاهش یابد.
* گرادینت با انیمیشن ترکیبپذیر است و میتواند افکتهای چشمنوازی ایجاد کند.
* در نسخههای قدیمی مرورگرها ممکن است نیاز به پیشوندها باشد (مانند <code>-webkit-</code>)، اما امروزه اغلب نیازی نیست.
== کاربرد این صفحخ از آموزش css ==
گرادینتها ابزار قدرتمند و انعطافپذیری برای طراحی مدرن و زیبای صفحات وب هستند. با شناخت انواع آنها و نحوه استفادهٔ درست، میتوان جلوههای بصری حرفهای و واکنشگرا ایجاد کرد.
[[رده:سیاساس]]
g7hdyveav3u2hqy3iax66b4nf9uhpfm
سیاساس/outline
0
41313
132019
2025-07-02T19:45:20Z
Fwldom
26269
افزودن مطلب
132019
wikitext
text/x-wiki
== مقدمه ==
ویژگی '''outline''' در CSS برای ایجاد خط دور (خط حاشیهای) در اطراف عناصر HTML استفاده میشود. برخلاف ویژگی <code>border</code>، خطوط <code>outline</code> در طراحی تأثیر بصری متفاوتی دارند و معمولاً برای مشخصکردن فوکوس عناصر (مثلاً هنگام استفاده از کیبورد) کاربرد دارند.
== تفاوت outline و border ==
{| class="wikitable"
! ویژگی !! outline !! border
|-
| فضای اشغالشده || خارج از ابعاد عنصر، بدون تغییر در باکس || داخل باکس و اندازه را تغییر میدهد
|-
| قابل اندازهگیری با box model || خیر || بله
|-
| پشتیبانی از گوشه گرد (border-radius) || خیر || بله
|-
| ترتیب نمایش (z-index) || همیشه روی سایر عناصر قرار میگیرد || قابل تنظیم
|-
| هدف اصلی || دسترسیپذیری (Accessibility) و فوکوس کیبورد || تزئین و طراحی ظاهری
|}
== خاصیتهای مربوط به outline ==
CSS چند ویژگی اختصاصی برای کنترل outline دارد:
=== ۱. outline-style ===
مشخص میکند خط دور چه شکلی باشد.
<syntaxhighlight lang="css">
outline-style: solid | dotted | dashed | double | groove | ridge | inset | outset | none;
</syntaxhighlight>
مثال:
<syntaxhighlight lang="css">
outline-style: dashed;
</syntaxhighlight>
=== ۲. outline-color ===
رنگ خط دور را مشخص میکند.
<syntaxhighlight lang="css">
outline-color: red;
</syntaxhighlight>
همچنین میتوان از مقدار <code>invert</code> برای هماهنگی با رنگ پسزمینه استفاده کرد.
=== ۳. outline-width ===
ضخامت خط دور را تعیین میکند.
<syntaxhighlight lang="css">
outline-width: thin | medium | thick | 2px | 0.2em | ...
</syntaxhighlight>
مثال:
<syntaxhighlight lang="css">
outline-width: 3px;
</syntaxhighlight>
=== ۴. outline-offset ===
فاصلهٔ خط دور از حاشیهٔ عنصر را مشخص میکند (بیرونتر یا دورتر از عنصر رسم میشود).
<syntaxhighlight lang="css">
outline-offset: 4px;
</syntaxhighlight>
== استفاده ترکیبی با shorthand ==
میتوان همه ویژگیها را بهصورت خلاصه نوشت:
<syntaxhighlight lang="css">
outline: 2px dotted blue;
</syntaxhighlight>
== کاربردهای رایج ==
* نمایش وضعیت فوکوس (مثلاً در <code>input</code>، <code>button</code>، <code>a</code>)
* کمک به دسترسیپذیری برای کاربرانی که فقط از کیبورد استفاده میکنند
* بررسی و دیباگ عناصر در توسعه (برای مشخص کردن ابعاد)
== مثال ==
<syntaxhighlight lang="css">
button:focus {
outline: 2px solid #00f;
outline-offset: 4px;
}
</syntaxhighlight>
== حذف outline (با احتیاط!) ==
در برخی طراحیها، طراحان میخواهند فوکوس به چشم نیاید، ولی این کار ممکن است دسترسیپذیری کاربران را مختل کند:
<syntaxhighlight lang="css">
button:focus {
outline: none;
}
</syntaxhighlight>
'''نکته مهم:''' اگر outline را حذف میکنید، باید جایگزینی بصری مناسب برای نشان دادن فوکوس ارائه دهید (مثلاً تغییر رنگ پسزمینه یا border).
== تمرین ==
یک فرم ساده ایجاد کنید که هنگام فوکوس روی فیلدها، outline رنگی متفاوت با border داشته باشد و ۵ پیکسل فاصله از عنصر (offset) داشته باشد.
== نکات مهم ==
* outline بدون تأثیر در layout و اندازه ظاهر میشود.
* outline در مرورگرها ظاهر متفاوتی دارد؛ بهتر است آن را بهصورت اختصاصی تعریف کنید.
* بهتر است در طراحی ریسپانسیو و قابل دسترس، outline را حذف نکنید مگر با جایگزین مناسب.
* برای شناسایی عناصر فعال و فوکوسدار، outline ابزار بسیار مناسبی است.
== کاربرد این صفحه از آموزش css ==
ویژگی <code>outline</code> ابزاری سبک، سریع و کاربردی برای ایجاد خطوط دور و مشخصکردن عناصر فعال است. با استفاده صحیح از این ویژگی میتوان هم طراحی زیباتر و هم تجربه کاربری بهتری ارائه کرد، بهویژه برای افرادی که از کیبورد یا تکنولوژیهای کمکی استفاده میکنند.
[[رده:سیاساس]]
chq0luqusvm8d3y9v9xvtdmb1qkd3s7
سیاساس/ریست و نرمالایز
0
41314
132020
2025-07-02T19:48:52Z
Fwldom
26269
صفحهای تازه حاوی « == مقدمه == مرورگرهای مختلف برای نمایش پیشفرض عناصر HTML، تنظیمات پیشفرض (مانند margin، padding، اندازهٔ فونت و ...) دارند که باعث تفاوت در ظاهر یکسان کدها در مرورگرهای مختلف میشود. برای حل این مشکل، توسعهدهندگان از دو تکنیک رایج استفاده میکنند:...» ایجاد کرد
132020
wikitext
text/x-wiki
== مقدمه ==
مرورگرهای مختلف برای نمایش پیشفرض عناصر HTML، تنظیمات پیشفرض (مانند margin، padding، اندازهٔ فونت و ...) دارند که باعث تفاوت در ظاهر یکسان کدها در مرورگرهای مختلف میشود. برای حل این مشکل، توسعهدهندگان از دو تکنیک رایج استفاده میکنند:
* '''CSS Reset''' (ریستکردن سبکها)
* '''Normalize.css''' (نرمالسازی سبکها)
هدف هر دو، ایجاد پایهای هماهنگ برای استایلدهی است، اما رویکرد آنها متفاوت است.
== CSS Reset چیست؟ ==
ریست کردن CSS یعنی حذف تمام سبکهای پیشفرض مرورگر برای تمامی عناصر HTML. با این کار، طراح یک پایه خالی و بدون مزاحمت برای طراحی در اختیار دارد.
=== نمونه CSS Reset ساده ===
<syntaxhighlight lang="css">
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
</syntaxhighlight>
=== ریست معروف اریک مایر ===
یکی از ریستهای پرکاربرد در جامعهٔ وب، ریست ساختهشده توسط Eric Meyer است:
<syntaxhighlight lang="css">
/* CSS Reset - Eric Meyer */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
display: block;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote::before, blockquote::after,
q::before, q::after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
</syntaxhighlight>
=== مزایا ===
* حذف تفاوتهای پیشفرض بین مرورگرها
* کنترل کامل روی استایلها
=== معایب ===
* حذف کامل استایلها میتواند تجربهٔ کاربری را کاهش دهد
* نیاز به بازتعریف بسیاری از استایلهای پایه
== Normalize.css چیست؟ ==
Normalize.css یک فایل CSS کوچک است که به جای حذف کامل سبکها، آنها را '''سازگار، یکنواخت و معقول''' در همهٔ مرورگرها میکند.
بهجای پاککردن همهچیز، Normalize:
* استایلهای پیشفرض مفید را حفظ میکند
* رفتار ناسازگار بین مرورگرها را اصلاح میکند
* کمک میکند عناصر بهطور معناداری رندر شوند
=== نصب Normalize.css ===
میتوان از CDN یا نصب npm استفاده کرد:
'''CDN:'''
<syntaxhighlight lang="html">
<link rel="stylesheet" href="https://necolas.github.io/normalize.css/8.0.1/normalize.css">
</syntaxhighlight>
'''npm:'''
<syntaxhighlight lang="bash">
npm install normalize.css
</syntaxhighlight>
=== نمونهای از Normalize.css ===
<syntaxhighlight lang="css">
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
html {
line-height: 1.15;
-webkit-text-size-adjust: 100%;
}
body {
margin: 0;
}
</syntaxhighlight>
=== مزایا ===
* حفظ ویژگیهای مفید مرورگر
* بهبود دسترسپذیری و خوانایی
* نیاز کمتر به بازتعریف عناصر پایه
=== معایب ===
* پیچیدهتر از CSS Reset
* در برخی پروژههای خاص ممکن است نیاز به ریست باشد
== مقایسه ریست و نرمالایز ==
{| class="wikitable"
! ویژگی !! CSS Reset !! Normalize.css
|-
| روش کار || حذف همهٔ استایلها || اصلاح و هماهنگسازی استایلها
|-
| سازگاری با مرورگرها || ساده ولی خشن || سازگارتر و دقیقتر
|-
| تجربه کاربری پیشفرض || کمتر (نیاز به بازتعریف بیشتر) || بیشتر (با حفظ استایلهای مفید)
|-
| کنترل کامل || بله || محدودتر
|-
| مناسب برای || طراحی از صفر || پروژههای مدرن و دسترسپذیر
|}
== ترکیب ریست و نرمالایز ==
برخی پروژهها از ترکیب سبکهای ریست و نرمالایز استفاده میکنند تا هم کنترل کامل و هم رفتار طبیعی مرورگر حفظ شود. حتی برخی فریمورکها (مثل Bootstrap) از نسخهٔ سفارشی Normalize استفاده میکنند.
== نکات مهم ==
* هیچ کدام از این روشها «درست یا غلط» نیست؛ انتخاب بین آنها بستگی به نیاز پروژه دارد.
* اگر طراحی از پایه و کاملاً سفارشی است، Reset گزینهٔ بهتری است.
* اگر میخواهید ظاهر طبیعی HTML حفظ شود ولی ناسازگاری مرورگرها را نداشته باشید، از Normalize استفاده کنید.
* از حذف outlineها بدون جایگزین در ریست پرهیز کنید (برای حفظ دسترسپذیری).
== تمرین ==
# یک فایل HTML ساده بنویسید با چند تگ مانند <code>h1</code>، <code>ul</code>، <code>button</code>
# با CSS Reset ظاهر آن را کاملاً یکسان و بدون حاشیه کنید
# سپس با Normalize ظاهر آن را بررسی و تفاوتها را تحلیل کنید
== کاربرد این صفحه از آموزش css ==
استفاده از CSS Reset یا Normalize.css به شما کمک میکند که طراحی وب خود را بر پایهای قابل پیشبینی، منسجم و بدون تفاوتهای مزاحم بین مرورگرها آغاز کنید. شناخت تفاوتها و انتخاب مناسب برای پروژه، یکی از مهارتهای پایهای در توسعهٔ حرفهای وب است.
[[رده:سیاساس]]
aop6tm6qjfs1sy13o3qrgfqg5ujdfc4
بحث کاربر:Omlet.cs
3
41315
132030
2025-07-02T22:42:44Z
New user message
8356
افزودن [[الگو:خوشامدید|پیام خوشآمد]] به صفحهٔ بحث کاربر تازه
132030
wikitext
text/x-wiki
== خوش آمدید ==
[[File:Carl Spitzweg 021-detail.jpg|thumb|left|180px|خوشآمدید!]]
<br/>
سلام {{PAGENAME}}، به ویکیکتاب خوش آمدید. از مشارکت شما سپاسگزارم. امیدوارم که از اینجا خوشتان بیاید و تصمیم به ماندن بگیرید. راهنماهای ویکیکتاب در [[راهنما:فهرست|اینجا]] است اما پیوندهای زیر برای کاربرهای جدید مفیدند:
{|
|-
|[[پرونده:Noia 64 apps help index.png|30px|right|link=ویکیکتاب:ویکیکتاب چیست؟|ویکینسک (ویکیکتاب) چیست؟]] || [[ویکیکتاب:ویکیکتاب چیست؟|ویکینسک (ویکیکتاب) چیست؟]]
|-
| [[پرونده:Nuvola apps ksig.png|30px|right|link=ویکیکتاب:آموزش سریع|آموزش سریع]] || [[ویکیکتاب:آموزش سریع|آموزش سریع]] آموزش کار با زبان مدیاویکی (محیط ویکیکتاب)
|-
| [[پرونده:Cscr-featured.svg|30px|right|link=ویکیکتاب:کتابهای برگزیده|کتابهای برگزیده]] || [[ویکیکتاب:کتابهای برگزیده|کتابهای برگزیده]] فهرستی از کتابهای برگزیده
|-
| [[پرونده:Nuvola apps chat.png|30px|right|link=ویکیکتاب:میز تحریر|میز تحریر]]||[[ویکیکتاب:میز تحریر]] برای گفتگو دربارهٔ مسائل فنی و سیاستها.
|-
| [[پرونده:Nuvola_apps_bookcase_1.svg|30px|right|link=ویکیکتاب:خودآموز/کمک کردن در یکی از کتابهای موجود|کمک کردن در یکی از کتابهای موجود]]||[[ویکیکتاب:خودآموز/کمک کردن در یکی از کتابهای موجود|کمک کردن در یکی از کتابهای موجود]] راههای تکمیل و ویرایش ایبوکهای ویکیکتاب
|-
|[[File:Bucket in the sand.svg|right|50px|link=ویکیکتاب:صفحه تمرین|صفحه تمرین]]||[[ویکیکتاب:صفحه تمرین|صفحه تمرین]] برای تمرین ویرایش
|-
|[[پرونده:Nuvola apps agent.svg|30px|right|link=w:ویکیکتاب:خودآموز|آموزش پیشرفته]]||[[w:ویکیپدیا:خودآموز|آموزش پیشرفته]]
|-
|'''پروژههای دیگر بنیاد'''||[[پرونده:Wikipedia-logo.png|20px|link=w:صفحه_اصلی|ویکیپدیا]][[پرونده:HSWikimedia.svg|25px|link=m:Special:Recentchanges|فراویکی]] [[پرونده:HSCommons.svg|25px|link=commons:Special:Recentchanges|ویکیانبار]][[پرونده:HSWNews.svg|25px|link=n:ویژه:تغییرات اخیر|ویکیخبر]] [[پرونده:HSWtionary.svg|25px|link=wikt:صفحه_اصلی|ویکیواژه]] [[پرونده:HSWQuote.svg|25px|link=q:صفحه_اصلی|ویکیگفتاورد]][[پرونده:HSWSource.svg|30px|link=s:صفحه_اصلی|ویکینبشته]][[پرونده:Wikidata-logo.svg|25px|link=wikidata:صفحه_اصلی|ویکیداده]]
|}
امیدوارم از ''[[ویکینسک:ویکینسکنویسان|ویکینسکنویس]]'' بودن لذت ببرید! لطفاً برای آزمایش از [[ویکیکتاب:گودال ماسهبازی]] استفاده کنید. باز هم خوش آمد میگویم.شاد باشید!
-- [[کاربر:New user message|New user message]] ([[بحث کاربر:New user message|بحث]]) ۲ ژوئیهٔ ۲۰۲۵، ساعت ۲۲:۴۲ (UTC)
fll40lfg7zuqogk3y2nr9ubjp7mfp32