چگونه element.style به سایت اضافه کنم

[adsman]

من از گوگل کروم استفاده می کنم و با برنامه جاوا کنسول خودش با یکسری تغییرات در css توانستم قالب دلخواه خود را داشته باشم. ولی نمی دانم در کج از این دستور استفاده کنم و آن را

اضافه کنم. در فایل index.php خیلی کار کردم و راه های مختلفی امتحان کردم ولی نشد.

این دستور css هست : 

element.style {
width: 900px;
padding-right: 1px;
padding-left: 1px;
border-left-width: 1px;
margin-left: 0px;
left: 105px;
}

و این دستور html هست :

<div class="main-content" role="main"><div class="site-content page-wrap" style="

width: 900px;

padding-right: 1px;
padding-left: 1px;
border-left-width: 1px;
margin-left: 0px;
left: 105px;
">

لطفا راهنمائی کنید در کجا و کدام فایل و به چه شکل از این کد استفاده کنم ؟

 

[MahdiY]

لطفا بیشتر توضیح بدید

این کد ها را کجا میخواهید اضافه کنید ؟ index.php ؟

منتقل شد انجمن پرسش و پاسخ ...

 

[rocki3oy]

با سلام و احترام.

دوست عزیز معمولا css هایی که به صورت inline باشند در inspect element مرورگرها به صورت element.style نشون میدم.

یعنی این استایل در فایل css نیست و در همان index.php هست که باید اول برای اون class تعریف کنید بعد در فایل css قرار بدید.

موفق باشید.

 

[MahdiY]

این کد را بزنید تو فایل css

.site-content { width: 900px; padding-right: 1px; padding-left: 1px; border-left-width: 1px; margin-left: 0px; left: 105px;}اگر فایل css ندارید! این کد را بزنید تو قسمت head

<style>.site-content {	width: 900px;	padding-right: 1px;	padding-left: 1px;	border-left-width: 1px;	margin-left: 0px;	left: 105px;}</style>

 

[adsman]

از همه دوستان ممنون.

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

موفق باشید

 

[adsman]

با تشکری مجدد

دوستان عزیز بعد از تغییراتی که شما راهنمائی کرده بودید انجام دادم. آن قسمت هایی تغییر دادم که صفحه اصلی سایت هست از حالت ریسپانسیو خارج

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

امکانی هم نیست که بشود دید.

لطفا برای برطرف کردن این مشکل راهنمائی بفرمائید.

 

[rocki3oy]

با سلام و احترام.

لطفا لینک بدید عزیز.

شاید این کدهارو بعد قرار دادید که در لود شدن کدهای دیگه مشکل پیش اومده

 

[adsman]

دوست عزیز امکانش نیست که لینک سایت را قرار دهم.

من از این کد در قسمت head سایت اسفاده کردم.

<style>
.site-content {
    width: 900px;
    padding-right: 1px;
    padding-left: 1px;
    border-left-width: 1px;
    margin-left: 0px;
    left: 105px;
}
</style>

 

[adsman]

این کد را بزنید تو فایل css

.site-content { width: 900px; padding-right: 1px; padding-left: 1px; border-left-width: 1px; margin-left: 0px; left: 105px;}اگر فایل css ندارید! این کد را بزنید تو قسمت head

<style>.site-content { width: 900px; padding-right: 1px; padding-left: 1px; border-left-width: 1px; margin-left: 0px; left: 105px;}</style>

باتشکر از شما دوست عزیز و گرامی

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

لطفا راهنمائی بفرمائید.

باتشکر

 

[Danial-Eshghi.Ir]

width : 900px

این دستور حالت ریسپانسیو سایت رو از بین میبره

میتونی مثلا 90% قرار بدی بجاش

 

[adsman]

باتشکر از شما یعنی اینکه به جای 900 فقط کافی است که 90% را جایگیزین کنم؟ یا باید در کدها هم تغییراتی را ایجاد کنیم؟

 

[adsman]

width : 900px

این دستور حالت ریسپانسیو سایت رو از بین میبره

میتونی مثلا 90% قرار بدی بجاش

90% را جایگزین کردم ولی باز اون قسمتی که تغییر داده‌ام متاسفانه ریسپاسیو نشد.

لطفا راهنمائی بفرمائید

 

[جاویدان]

با سلام

دوست عزیز

این رو هم تست کنید

max-width: 900px;

البته جای 900 شاید بتونی auto هم بذاری که اینجوری میشه

max-width:auto;width:auto;این دو حالت هستش تست کن

در اصل کد آقا مهدی اینجوری میشه

<style>.site-content { width: auto; padding-right: 1px; padding-left: 1px; border-left-width: 1px; margin-left: 0px; left: 105px;}</style>موفق باشی

 

[adsman]

با سلام

دوست عزیز

این رو هم تست کنید

max-width: 900px;

البته جای 900 شاید بتونی auto هم بذاری که اینجوری میشه

max-width:auto;width:auto;این دو حالت هستش تست کن

در اصل کد آقا مهدی اینجوری میشه

<style>.site-content { width: auto; padding-right: 1px; padding-left: 1px; border-left-width: 1px; margin-left: 0px; left: 105px;}</style>موفق باشی

با تشکر از شما

ولی مشکل بنده با امتحان کردن کدی که فرمودید همچنان پابرجاست.

موفق باشید

 

[جاویدان]

با سلام

دوست عزیز

الان که مشکل رو شما رو از اول خودم تا پایین یادم افتاد شما باید برای گوشی موبایل هم تعریف جداگانه ای داشته باشی

مثلا برای 800*400 باید تعریف جداگانه همین رو به صورت نصف یا 3/4 انجام بدی یعنی اگر می خوای ریسپانسیو باشه باید برای هر حالتی تعیین کنی قالب از چه موقعیتی استفاده کنه برای بهتر فهمیدن یه قالب وردپرس دانلود کن و تو قسمت css های موبایل یا سایر بخشهای css ببین برای هر حالت گوشی از چه اندازه استفاده شده و شما عین همون رو پیاده سازی کن

موفق باشید