بایگانی برچسب: s

HTML و CSS

آموزش برنامه نویسی CSS – ویژگیهای مربوط به متن در CSS (بخش اخر)

درود

در این قسمت به ادامه ویژگیهایی که بر روی متن ها اثر می گذارند می پردازیم.
text-transform

این ویژگی مشخص می کند که متن با استفاده از حروف بزرگ نوشته شود یا حروف کوچک و یا به صورت معمولی البته بدون آنکه در حروفی که تایپ شده است تغییری به وجود آورید. با این روش اگر خواستید قسمتی از متن مثلاً برای تأکید بیشتر با حروف بزرگ مشاهده شود نیازی نیست که دوباره آن قسمت را از اول تایپ کنید. البته این ویژگی در زبان فارسی چندان استفاده ای ندارد ولی در زبانهایی مثل انگلیسی می توانید آنرا به کار ببرید.

به یک مثال در مورد این ویژگی توجه کنید:

همانطور که مشاهده می کنید بدون استفاده از حروف بزرگ در نوشتن کد، متن ما با حروف بزرگ نمایش داده می شود.

این ویژگی چند مقدار دارد که در اینجا مشاهده می کنید:

none :
با انتخاب این گزینه متن به همان صورتی که تایپ شده است نمایش داده می شود.
lowercase :
با انتخاب این گزینه متن با حروف کوچک نمایش داده می شود.
uppercase :
این گزینه متن را با حروف بزرگ نمایش می دهد.
capitalize :
این گزینه حروف اول کلماتی را که با حروف کوچک نوشته شده اند با حروف بزرگ و بقیه حروف را با حروف کوچک نمایش می دهد. به مثال زیر توجه کنید:

line-height

این ویژگی به ما امکان می دهد تا ارتفاع سطر ها را مشخص کنیم. این ارتفاع می تواند به صورت درصد یا در مقیاس پیکسل باشد و فاصله بین سطرها را مشخص می کند.

برای مثال اگر بخواهیم سطرها از هم ۵۰ پیکسل فاصله داشته باشند می توانیم به صورت زیر عمل کنیم:

text-indent

این ویژگی مقدار تو رفتگی متن را در سطر اول هر قسمت (مثلاً سطر اول هر پاراگراف) مشخص می کند. این مقدار می تواند بر حسب پیکسل یا در صد باشد.

در مثال زیر این مقدار تو رفتگی را ۳۰ پیکسل در نظر می گیریم:

و بار دیگر خیلی ممنون که به وبسایت پنگوئن اومدید و وقت گران بهاتون در اختیار ما گذاشته اید.
تا درودی دیگر بدرود.

HTML و CSS

آموزش برنامه نویسی CSS – نحوه ی ارتباط CSS با HTML (بخش آخر)

سلام
در جلسات قبل به این موضوع رسیدگی کردیم که چگونه میتوان CSS را با HTML مرتبط کرد. و متوجه شدید که حتی میتوان یک CSS خارجی ساخت و سپس آن را با HTML درون نرم افزار مرتبط کرد. حالا در این آموزش به روش های دیگر ارتباط این دو زبان با یکدیگر می رسیم.
ابتدا همونطور که در آموزش قبل گفتم یک CSS خارجی را به روشی ساده میتوان با HTML که درون نرم افزار است ارتباط داد. حالا در این آموزش به دو روش دیگری که در این بحث وجود دارد میرسیم.
۱– درون کدی
۲- درون خطی
۳- یه شیوه ی Drag & Drop
من ترجیح میدم که از آموزش رو با شیوه ی درون کدی شروع بکنم و سپس به بقیه ی آموزش رو ادامه بدم.
۱– آموزش ارتباط CSS با HTML به روش درون کدی
یک CSS داخلی را می توان مورد استفاده قرار داد اگر یک سند تنها از یک سبک دهی منحصر به فرد استفاده کند.
شیوه نامه داخلی با استفاده از تگ style، در بخش<HEAD> در یک صفحه HTML، تعریف می شود. به عنوان مثال:

۲- آموزش ارتباط CSS با HTML به روش درون خطی
شیوه نامه درون خطی می تواند مورد استفاده قرار گیرد اگر استایل منحصر به فرد به یک رخداد منفرد از یک عنصر به کار رود.
برای استفاده ازاستایل درون خطی،از تگ های مربوطه استفاده کنید که می تواند حاوی هر خاصیت CSS باشد.
مثال زیر نشان می دهد که چگونه برای تغییر رنگ متن و حاشیه چپ از یک پاراگراف استفاده کنید:

۳– آموزش ارتباط CSS با HTML به روش Drag & Drop
این روش ساده ترین روش است به طوریکه همانطور که از اسم این موضوع پیداست فقط کافی است که شما فایل CSS یا همان استایل مورد نظر را انتخاب کرده سپس آن را کشیده (Drag) و آن را درون تگ<Head> قرار دهید یا به طوریکه هم معنی با اسم خارجی خود باشد ان را بیاندازید. (Drop) و حالا CSS شما قابل استفاده در HTML است.
با عرض تشکر خدمت شما خواننده عزیز که وقت گران بهای خود را در اختیار ما گذاشته اید.
از طرف خودم و گروه برنامه نویسی پنگوئن از شما تشکر میکنم.

HTML و CSS

آموزش برنامه نویسی css – مقدمه آموزش

سلام
در ابتدای جلسه ی اول آموزش زبان بسیار زیبا و کاربردی CSS ما قرار نیست که درجا بریم سر کد نویسی . کار من آموزش زبان CSS هستش و از این به بعد زبان CSS از HTML به صورت جدا و مستقل آموزش داده میشه .
ابتدا سر تیتر هایی که قراره در این جلسه با هم بررسی کنیم رو میگم:
۱-CSS چیست ؟
۲- چرا زبان CSS به وجود امد؟
۳- کاربرد های زبان CSS
در اصطلاح عامیانه یا به معنای لغوی CSS به معنای الگوهای آبشاری یا روی‌ اندازه ی آبشاری سَبْک ( یا به انگلیسی CSS Cascading Style Sheets ) که برای تعریف سبک صفحات وب خود از جمله طراحی , سایز و ابعاد , رنگ و فونت و صدها کاربرد دیگر…

زمانی که HTML پا به عرصه اینترنت نهاد بیشتر مردم فکر می کردند که که تنها زبان موجود برای کدنویسی و طراحی وب در اینترنت همین یک زبان است و زبان های دیگری وجود ندارد.
HTML زبانی بود که بسیاری از موارد پیشرفته طراحی در آن لحاظ نشده بود علاوه بر اینکه قابلییت تغییر و کاربر پسندی و صد ها قابلییتی که ما در عصر حاضر شاهد آن هستیم در آن لحاظ نشده بود .

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

طریقه ی انتقال فایل CSS و کدنویسی ان در جلسات دیگه به شما توضیح خواهد داده شد.
پس مباحثی که ما در جلسه ی آینده نه در جلسات اینده با انها اشنا خواهیم شد عبارتند از :
آموزش کار با استایل (CSS)
طریقه استفاده از کدهای CSS
قوانین CSS
نحوه ارتباط CSS با HTML

توجه داشته باشید نظرات شما بسیار برای ما پر اهمییت هستند صد در صد از نظرات شما بهره میبریم و مطمئن باشید نظرات شما به کار ما جهت و سو میده از مباحثی که علاقه به تعلیم دارید برای ما بگید به آنها هم رسیدگی میشه .
گروه برنامه نویسی پنگوئن از توجه شما به این پست تشکر میکنه.
گروه برنامه نویسی پنگوئن