Kamali

نحوه ی استایل دادن به هیدینگ ها ، بولد ، ایتالیک و ....

15 پست در این موضوع قرار دارد

با سلام و احترام . دوستان ببخشید میخواستم بدونم چه جوری میشه در style.css قالب ، واسه هیدینگ ها ( h1 تا h6 ) ، همچنین bold و italic که در ویرایشگر دیداری وجود داره ، استایل تعریف کرد ؟

منظورم اینه که کلاس این المان ها چیه ؟

تشکر

به اشتراک گذاری این پست


لینک به پست


اگه درست متوجه شده باشم منظورت این هست دیگه درسته؟ اگه واسه این ها استایل تعریف کنی هرجای سایت که تگ ها وجو داشته باشن استایل ها اعمال میشن

h1 {}
h2 {}
h3 {}
...
h6 {}

اگه درست متوجه شده باشم همین شکله ولی فکر نکنم بشه به Bold و Italic استایل داد اونا خودشون استایل هستن 

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

h1 {
  font-style: italic
  font-weight: bold
}

 

به اشتراک گذاری این پست


لینک به پست

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

b, strong { 
    color: red;
}

پ‌ن: مثلا اینجا تگ‌های b و strong که برای بولد کردن متن به کار میرن استایل رنگ قرمز گرفتن.

ویرایش شده در توسط Farshad

به اشتراک گذاری این پست


لینک به پست
در 19 دقیقه قبل، Farshad گفته است :

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


b, strong { 
    color: red;
}

پ‌ن: مثلا اینجا تگ‌های b و strong که برای بولد کردن متن به کار میرن استایل رنگ قرمز گرفتن.

تشکر . آقا فرشاد نمیدونم چرا پوسته ی من اینجوریه ؟ آخه وقتی در ویرایشگر دیداری یک عنوان رو بولد و یا ایتالیک میکنم ، در ویرایشگر اعمال میشه ، ولی وقتی متن منتشر میشه ، در اونجا ، متن بصورت کاملا ساده و بدون بولد شدن و ایتالیک شدن به نمایش درمیاد .

سئوال من اینه : مگه به قول آقای محمدرضا ، بولد و ایتالیک ، خودشون استایل نیستن ؟ پس چرا پوسته ی من این قابلیت رو نداره ؟ واسه همه ی پوسته ها باید این قابلیت رو تعریف کرد ؟ مثله همین استایل دادنی که شما گفتید ؟ یا اینکه باید به صورت پیش فرض قابلیت درشت شدن ( بولد ) و کج شدن ( ایتالیک ) وجود داشته باشه ؟

اگه یه پوسته مثله پوسته من این قابلیت رو نداشت باید چه کدی اضافه کنم که این قابلیت های بولد و ایتالیک به پوسته اضافه بشه ؟

به اشتراک گذاری این پست


لینک به پست
در 2 ساعت قبل، Kamali گفته است :

تشکر . آقا فرشاد نمیدونم چرا پوسته ی من اینجوریه ؟ آخه وقتی در ویرایشگر دیداری یک عنوان رو بولد و یا ایتالیک میکنم ، در ویرایشگر اعمال میشه ، ولی وقتی متن منتشر میشه ، در اونجا ، متن بصورت کاملا ساده و بدون بولد شدن و ایتالیک شدن به نمایش درمیاد .

سئوال من اینه : مگه به قول آقای محمدرضا ، بولد و ایتالیک ، خودشون استایل نیستن ؟ پس چرا پوسته ی من این قابلیت رو نداره ؟ واسه همه ی پوسته ها باید این قابلیت رو تعریف کرد ؟ مثله همین استایل دادنی که شما گفتید ؟ یا اینکه باید به صورت پیش فرض قابلیت درشت شدن ( بولد ) و کج شدن ( ایتالیک ) وجود داشته باشه ؟

اگه یه پوسته مثله پوسته من این قابلیت رو نداشت باید چه کدی اضافه کنم که این قابلیت های بولد و ایتالیک به پوسته اضافه بشه ؟

چرا، همینجوری که شما و دوستمون گفتن، اینا استایل های پیشفرض هستند و باید به صورت دیفالت به اون شکلی که شما میگید نشون داده بشن مگر اینکه خود طراح تغیرشون داده باشه. 

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

برای بولد شدن میتونید این استایل رو اضافه کنید.

b, strong { 
    font-weight: bold !important;
}

به اشتراک گذاری این پست


لینک به پست
در 6 ساعت قبل، Farshad گفته است :

چرا، همینجوری که شما و دوستمون گفتن، اینا استایل های پیشفرض هستند و باید به صورت دیفالت به اون شکلی که شما میگید نشون داده بشن مگر اینکه خود طراح تغیرشون داده باشه. 

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

برای بولد شدن میتونید این استایل رو اضافه کنید.


b, strong { 
    font-weight: bold !important;
}

تشکر . متأسفانه قالبم روی لوکال هاسته و چون دارم ایراداتش رو رفع میکنم ، هنوز روی هاست اصلی نبردم .

الان این ایرادی که قالبم داره رو نمیدونید چه جوری میشه رفع کرد ؟ منظورم اینه که شاید یه تکه کدی چیزی باید در قالب می بوده که حالا نیست ! در حالت عادی این مشکل میتونه از چی باشه و آیا راه حلی داره یا خیر ؟

به اشتراک گذاری این پست


لینک به پست
در 14 ساعت قبل، Kamali گفته است :

تشکر . متأسفانه قالبم روی لوکال هاسته و چون دارم ایراداتش رو رفع میکنم ، هنوز روی هاست اصلی نبردم .

الان این ایرادی که قالبم داره رو نمیدونید چه جوری میشه رفع کرد ؟ منظورم اینه که شاید یه تکه کدی چیزی باید در قالب می بوده که حالا نیست ! در حالت عادی این مشکل میتونه از چی باشه و آیا راه حلی داره یا خیر ؟

خوب ببینید به صورت دیفالت شما نباید کاری بکنید، اینا تگ‌های پیشفرض هستن.

اول با یه مرورگر دیگه تست کنید، اگر مشکل پا برجا بود، یکبار سورس اون صفحه رو چک کنید و ببینید آیا در واقعیت اون کلمه‌ی مورد نظر در تگ strong قرار گرفته یا نه، اگر بود که این کد رو در انتهای استایل قالبتون بذارید و مجددا تست کنید:

b, strong { 
    font-weight: bold !important;
}

(اگر پلاگین کش فعاله، کشش رو خالی کنید)

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

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

به اشتراک گذاری این پست


لینک به پست
در 21 ساعت قبل، Farshad گفته است :

خوب ببینید به صورت دیفالت شما نباید کاری بکنید، اینا تگ‌های پیشفرض هستن.

اول با یه مرورگر دیگه تست کنید، اگر مشکل پا برجا بود، یکبار سورس اون صفحه رو چک کنید و ببینید آیا در واقعیت اون کلمه‌ی مورد نظر در تگ strong قرار گرفته یا نه، اگر بود که این کد رو در انتهای استایل قالبتون بذارید و مجددا تست کنید:


b, strong { 
    font-weight: bold !important;
}

(اگر پلاگین کش فعاله، کشش رو خالی کنید)

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

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

تشکر از شما .

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

بحث من سر این هست که مگه وظیفه ی دکمه های بولد و ایتالیک ، در ویرایشگر دیداری ، این نیست که متن رو درشت و کج کنن ؟ پس چرا به خودی خود ( بدون تعریف استایل واسه این دو تا ) قالب من به صورت پیش فرض اینکارو انجام نمیده ؟ تا به حال همه ی قالبهایی که دیدم اینکارو بدون تعریف استایل انجام دادن ، ولی قالب من نمیدونم چرا اینجوریه .

به نظر شما مشکل از چی میتونه باشه ؟

به اشتراک گذاری این پست


لینک به پست
در 6 دقیقه قبل، Kamali گفته است :

تشکر از شما .

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

بحث من سر این هست که مگه وظیفه ی دکمه های بولد و ایتالیک ، در ویرایشگر دیداری ، این نیست که متن رو درشت و کج کنن ؟ پس چرا به خودی خود ( بدون تعریف استایل واسه این دو تا ) قالب من به صورت پیش فرض اینکارو انجام نمیده ؟ تا به حال همه ی قالبهایی که دیدم اینکارو بدون تعریف استایل انجام دادن ، ولی قالب من نمیدونم چرا اینجوریه .

به نظر شما مشکل از چی میتونه باشه ؟

بالاتر هم گفتم، اینا استایل های دیفالت هستن و به صورت پیشفرض شما نباید کاری بکنید، مگر اینکه طراح خودش به صورت عمدا یا سهواً تغییری درشون داده باشه، مثلا واسه استایل بولد نوشته باشه font-weight: normal; خوب در این صورت ممکنه چنین مشکلی پیش بیاد.

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

ولی خوب در کل همونطوری که خودتون گفتید اینا استایل های پیشفرض هستن و شما نباید کاری بکنید. ^_^

به اشتراک گذاری این پست


لینک به پست
در 11 ساعت قبل، Farshad گفته است :

بالاتر هم گفتم، اینا استایل های دیفالت هستن و به صورت پیشفرض شما نباید کاری بکنید، مگر اینکه طراح خودش به صورت عمدا یا سهواً تغییری درشون داده باشه، مثلا واسه استایل بولد نوشته باشه font-weight: normal; خوب در این صورت ممکنه چنین مشکلی پیش بیاد.

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

ولی خوب در کل همونطوری که خودتون گفتید اینا استایل های پیشفرض هستن و شما نباید کاری بکنید. ^_^

خیلی ممنون از توضیحاتتون .

مشکلی که هست اینه که داخل قالب ، اصلا هیچ استایلی واسه این تگ ها درنظر گرفته نشده .

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

آیا در یک قالب وردپرس ، حتما باید برای تگ های بولد و ایتالیک ، استایل تعریف کرد ؟ مثلا طبق گفته ی خودتون ، برای اینکه بولد ، استایل بگیره ، باید حتما در style.css قالب ، این کلاس رو تعریف کرد و بهش استایل داد ؟ یا اینکه اگه هیچ استایلی هم واسه این تگ های پیش فرض وردپرس تعریف نشه ، خود وردپرس بصورت پیش فرض ، به اونها استایل میده ؟

به اشتراک گذاری این پست


لینک به پست
در 5 ساعت قبل، Kamali گفته است :

خیلی ممنون از توضیحاتتون .

مشکلی که هست اینه که داخل قالب ، اصلا هیچ استایلی واسه این تگ ها درنظر گرفته نشده .

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

آیا در یک قالب وردپرس ، حتما باید برای تگ های بولد و ایتالیک ، استایل تعریف کرد ؟ مثلا طبق گفته ی خودتون ، برای اینکه بولد ، استایل بگیره ، باید حتما در style.css قالب ، این کلاس رو تعریف کرد و بهش استایل داد ؟ یا اینکه اگه هیچ استایلی هم واسه این تگ های پیش فرض وردپرس تعریف نشه ، خود وردپرس بصورت پیش فرض ، به اونها استایل میده ؟

خیر، هیچ استایلی لازم نیست و نه وردپرس بلکه خود مرورگر میدونه باید اینها رو چجوری نشون بده، در نتیجه لازم نیست به صورت پیشفرض چیزی براشون تو استایل تعریف بشه.

به اشتراک گذاری این پست


لینک به پست
در 11 ساعت قبل، Farshad گفته است :

خیر، هیچ استایلی لازم نیست و نه وردپرس بلکه خود مرورگر میدونه باید اینها رو چجوری نشون بده، در نتیجه لازم نیست به صورت پیشفرض چیزی براشون تو استایل تعریف بشه.

تشکر از پاسختون ؛ پس با این حساب ، ظاهرا نمیشه متوجه شد که این مشکل ، چرا در قالبم وجود داره و بالاجبار ، باید واسه این تگ ها ، استایل تعریف کنم .

میشه بفرمایید از کجا میتونم کلاس تگ ها رو بدست بیارم که بتونم در استایل قالب ، واسشون استایل تعریف کنم ؟

مثلا واسه بولد شما فرمودید :

b, strong {}

واسه ایتالیک و یا آندرلاین و ... کلاسهاشون چی میشه و باید از کجا پیداشون کنم ؟

ویرایش شده در توسط Kamali

به اشتراک گذاری این پست


لینک به پست
در 12 دقیقه قبل، Kamali گفته است :

تشکر از پاسختون ؛ پس با این حساب ، ظاهرا نمیشه متوجه شد که این مشکل ، چرا در قالبم وجود داره و بالاجبار ، باید واسه این تگ ها ، استایل تعریف کنم .

میشه بفرمایید از کجا میتونم کلاس تگ ها رو بدست بیارم که بتونم در استایل قالب ، واسشون استایل تعریف کنم ؟

مثلا واسه بولد شما فرمودید :


b, strong {}

واسه ایتالیک و یا آندرلاین و ... کلاسهاشون چی میشه و باید از کجا پیداشون کنم ؟

والا این مورد رو تاحالا منم ندیده بودم و واسم خیلی جالب و عجیب بود، ممکنه دلیل دیگه ای داشته باشه، که اگه دوستان حرفه‌ای تر در تاپیک شرکت میکردن میشد علت یابیش کرد.

این استایل ها رو منم به طور کامل بلد نیستم ولی شما یه بار استایل بدین (مثلا توی ویرایشگر ایتالیک کنید) بعد ببینید چه استایلی واسش تعریف شده تو متن (با inspect مرورگر)، مثلا واسه ایتالیک فکر کنم i باشه، بعد بش استایل بدین. 

به اشتراک گذاری این پست


لینک به پست
در ۱ ساعت قبل، Farshad گفته است :

والا این مورد رو تاحالا منم ندیده بودم و واسم خیلی جالب و عجیب بود، ممکنه دلیل دیگه ای داشته باشه، که اگه دوستان حرفه‌ای تر در تاپیک شرکت میکردن میشد علت یابیش کرد.

این استایل ها رو منم به طور کامل بلد نیستم ولی شما یه بار استایل بدین (مثلا توی ویرایشگر ایتالیک کنید) بعد ببینید چه استایلی واسش تعریف شده تو متن (با inspect مرورگر)، مثلا واسه ایتالیک فکر کنم i باشه، بعد بش استایل بدین. 

واسه ایتالیک ، همونطور که فرمودید ، اول i رو گذاشتم ولی جواب نداد و استایل نگرفت ، بعدش از طریق سورس که نگاه کردم ، دیدم متن کج شده ، بین دو تگ em قرار گرفته ، بعدا واسه em استایل تعریف کردم ، اینبار استایل رو گرفت ، ولی متأسفانه تداخل ایجاد شد و بعضی متن های دیگه ، ( به جز متن موجود در content ) هم این استایل رو گرفتن و با هم تداخل ایجاد کرد ، حتی با important هم تداخلش از بین نرفت .

به جز em و i ، واسه استایل دادن به ایتالیک ، تگ دیگه ای وجود نداره ؟

به اشتراک گذاری این پست


لینک به پست
در 2 ساعت قبل، Kamali گفته است :

واسه ایتالیک ، همونطور که فرمودید ، اول i رو گذاشتم ولی جواب نداد و استایل نگرفت ، بعدش از طریق سورس که نگاه کردم ، دیدم متن کج شده ، بین دو تگ em قرار گرفته ، بعدا واسه em استایل تعریف کردم ، اینبار استایل رو گرفت ، ولی متأسفانه تداخل ایجاد شد و بعضی متن های دیگه ، ( به جز متن موجود در content ) هم این استایل رو گرفتن و با هم تداخل ایجاد کرد ، حتی با important هم تداخلش از بین نرفت .

به جز em و i ، واسه استایل دادن به ایتالیک ، تگ دیگه ای وجود نداره ؟

خوب برای اینکه فقط متن موجود در بلاک کانتنت رو هدف قرار بدین، ایجوری عمل کنید: 

.content-class > p > em {
	...;
}

به جای content-class اسم کلاس بلاکی که محتوای اصلیتون داخلش هست رو قرار بدین.

این کد میاد و به مرورگر میگه فقط تگ‌های em‌‌ای که داخل تگ پاراگراف که اون هم خودش داخل بلاک محتوای اصلی هست رو هدف قرار بده :blink:

به اشتراک گذاری این پست


لینک به پست

برای ارسال نظر یک حساب کاربری ایجاد کنید یا وارد حساب خود شوید

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

ایجاد یک حساب کاربری

برای حساب کاربری جدید در انجمن ما ثبت نام کنید. عضویت خیلی ساده است !


ثبت نام یک حساب کاربری جدید

ورود به حساب کاربری

دارای حساب کاربری هستید؟ از اینجا وارد شوید


ورود به حساب کاربری