بسم الله الرحمن الرحیم

نکات سی اس اس-css

فهرست علوم
علوم کامپیوتر
نکات سی اس اس-css
رسم کردن با css
مخفی و آشکار کردن با سی اس اس





کلمات شبیه هم:

display: block;
color: black;
target="_blank"



p:before,p:after { content: "---"; }

متن استرونگ با استایل دکمه


صفحات وب از دو بخش تشکیل میشود، بخش نمایش و محتوی، و بخش کد که نحوه نمایش محتوی را تعیین میکند.

هر عنصر واقع بین علامت کوچکتر و بزرگتر یک المان (تگ) است که میتوان با انتخاب آن توسط یک سلکتور (انتخابگر) روی شخص یا گروه آنها کار انجام داد، مثلا اگر آی‌دی خاص یک المان را انتخاب کنیم تنها با او و بر او کار انجا میدهیم، مثل آیه سوم مثلا:  #id  یک سلکتور آی‌دی است پس مینویسیم:  #aayah-3 

https://www.w3schools.com/cssref/css_selectors.asp






تگ clear: both در قبال فلوت است که اگر کلیر بوث باشد اجازه نمیدهددر هیچ طرف چپ و راست فلوت شود
اما کلیر لفت مثلا فقط نمیگذارد که طرف چپ فلوت شود

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


تگ pre برای حفظ سطور و فواصل جالب است.


هر المنت یک باکس دارد، خط مرزی بین او و بیرونش، بوردر است، فاصله بوردر تا محتویات المنت، پدینگ است، و فاصله بوردر تا عنصر بیرونی، مارجین است، پس وقتی از محتویات المنت، به سوی مرز(بوردر) برویم، ابتدا پدینگ است و سپس خود مرز بوردر است و سپس مارجین است و سپس عنصر بیرونی

https://www.w3schools.com/css/css_boxmodel.asp

و این تصویر از سایت:

http://webtarget.ir/margin-padding-border/





صفحه جالب:
https://www.w3schools.com/cssref/playit.asp?filename=playcss_display&preval=contents









صفحه ۲۰ ترفند پیشرفته برای وب:
https://mohtava.info/tips-for-writing-modern-css/






(${0:$GEDIT_SELECTED_TEXT}) CSS vertical-align Property Example Vertical align an image: img.a { vertical-align: baseline; } img.b { vertical-align: text-top; } img.c { vertical-align: text-bottom; } img.d { vertical-align: sub; } img.e { vertical-align: super; } CSS Syntax vertical-align: baseline|length|sub|super|top|text-top|middle|bottom|text-bottom|initial|inherit; (uu)

استفاده از تب‌ها با استایل، به فایل استایل صفر مراجعه شود:
مفرداتریشه‌هاتجزیه و ترکیبقرائات مفردات اولریشه های مفرداتتراکیبقرائات سبعةمفردات دوم

transition خورد خورد رنگی شدن یا محو شدن یا سایر تغییرات است

opacity تیریگی است که یک شفاف است و صفر پنهان است و بنا بین تیره است



استایل منوی بازشو از بغل:











Useless Link

hhhhhhhh
hhhhhhhh
hhhhhhhh
hhhhhhhh
hhhhhhhh





مهدی دلاور 1395-12-20 22:21
سلام و خسته نباشید.
میشه در مورد کاربرد مقدار table در خصوصیت display من رو راهنمایی کنید. اینکه عنصر را مانند یک عنصر جدول در نظر میگیرد در این مثال یعنی چی؟
ممنون.

پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
0 # امیر پهلوان صادق 1395-12-21 08:48
سلام
به دو روش می توانید یک جدول را در صفحات وب استفاده نماییید:
1- استفاده از تگ table در HTML
2- استفاده از خصوصیات CSS
table { display: table }
tr { display: table-row }
thead { display: table-header-gr oup }
tbody { display: table-row-group }
tfoot { display: table-footer-gr oup }
col { display: table-column }
colgroup { display: table-column-gr oup }
td, th { display: table-cell }
caption { display: table-caption }





Mouse over this text












فرق صفت جهت یعنی دایرکشن راست به چپ یا چپ به راست با صفت چینش متن یعنی الیگمنت راست یا الیگمنت وسط یا یا چپ در مثالهای زیر ملاحظه کنید، دقت شود که اینجا A و B دو المان هستند نه یک متن متصل که یک المان حساب شود:


راست به چپ با راست‌چین

A
B

اساس فایل
**
علامت کوچکتر






راست به چپ با چپ‌چین

A
B

اساس فایل
**
علامت کوچکتر








راست به چپ با وسط چین

A
B

اساس فایل
**
علامت کوچکتر




چپ به راست با راست‌چین

A
B

اساس فایل
**
علامت کوچکتر






چپ به راست با چپ‌چین

A
B

اساس فایل
**
علامت کوچکتر




چپ به راست با وسط‌چین

A
B

اساس فایل
**
علامت کوچکتر



در متن طولانی دو صفت دایرکشن و الیگمنت تفاوت خود را نشان نمیدهند یعنی در حقیقت صفت دایرکشن خودنمایی ندارد، در این سه دقت کنید، فقط الیگمنت خودنمایی دارد، بخلاف مثالهای قبل که هر دو خودنمایی دارند در دو متن که دو المان و مستقل از هم بودند:

اساس فایل را دو تگ شروع و پایان تشکیل میدهد که هر یک متشکل است از علامت کوچکتر در ابتدای تگ، و علامت بزرگتر در انتهای آن، و هر چه بین این دو علامت کوچکتر و بزرگتر بیاید در بروزر از


اساس فایل را دو تگ شروع و پایان تشکیل میدهد که هر یک متشکل است از علامت کوچکتر در ابتدای تگ، و علامت بزرگتر در انتهای آن، و هر چه بین این دو علامت کوچکتر و بزرگتر بیاید در بروزر از



اساس فایل را دو تگ شروع و پایان تشکیل میدهد که هر یک متشکل است از علامت کوچکتر در ابتدای تگ، و علامت بزرگتر در انتهای آن، و هر چه بین این دو علامت کوچکتر و بزرگتر بیاید در بروزر از









اساس فایل را دو تگ شروع و پایان تشکیل میدهد که هر یک متشکل است از علامت کوچکتر در ابتدای تگ، و علامت بزرگتر در انتهای آن، و هر چه بین این دو علامت کوچکتر و بزرگتر بیاید در بروزر از


اساس فایل را دو تگ شروع و پایان تشکیل میدهد که هر یک متشکل است از علامت کوچکتر در ابتدای تگ، و علامت بزرگتر در انتهای آن، و هر چه بین این دو علامت کوچکتر و بزرگتر بیاید در بروزر از



اساس فایل را دو تگ شروع و پایان تشکیل میدهد که هر یک متشکل است از علامت کوچکتر در ابتدای تگ، و علامت بزرگتر در انتهای آن، و هر چه بین این دو علامت کوچکتر و بزرگتر بیاید در بروزر از

Display links as block elements:

HTML CSS JavaScript

Capture click events in CSS with hidden checkbox/radio







محتوای اول
محتوای دوم
محتوای سوم
کدهای CSS:





Home News

Mega Menu

Category 1

Link 1 Link 2 Link 3

Category 2

Link 1 Link 2 Link 3

Category 3

Link 1 Link 2 Link 3




راست کلیک کنید تا منوی زمینه باز شود




















میتوان این قسمت را ثابت در صفحه هم نمود، به کد مراجعه شود:
About Services Clients Contact
Link 1 Link 2 Link 3
Search

Sidebar Dropdown

Click on the dropdown button to open the dropdown menu inside the side navigation.

This sidebar is of full height (100%) and always shown.

Some random text..