abolfazl

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

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

سلام دوستان

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

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

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

چطور بایدبرای آی فریم های گوگل استایل بنویسیم؟

0

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


لینک به پست

سلام

استایل خاصی نمیشه داد. فقط میشه داخل یک سری باکس قرارشون داد. چجور چیزی مد نظر شماست؟

1

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


لینک به پست

سلام

استایل خاصی نمیشه داد. فقط میشه داخل یک سری باکس قرارشون داد. چجور چیزی مد نظر شماست؟

سلام ممنون از توجه شما به این تاپیک

درسته ماهم یه باکس ساده میخایم برای این نقشه ها

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

چه طور باید این کار و انجام بدم؟

ویرایش شده در توسط abolfazl
0

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


لینک به پست

یه div بسازید و به صورت زیر استایل بدید


div#map{
width:500px;
height;300px;
background:#eee;
border:1px solid #ccc;
padding:1px;
}

داخل div کد مربوط به نقشه

2

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


لینک به پست

یه div بسازید و به صورت زیر استایل بدید


div#map{
width:500px;
height;300px;
background:#eee;
border:1px solid #ccc;
padding:1px;
}

داخل div کد مربوط به نقشه

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

آقای مهدوی ببینید برای مثال این یه کد آیفریم مپ گوگله:


<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d207372.49201938324!2d51.349818600000006!3d35.696814100000005!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x3f8e00491ff3dcd9%3A0xf0b3697c567024bc!2z2KrZh9ix2KfZhg!5e0!3m2!1sfa!2sir!4v1442418377122" width="600" height="450" frameborder="0" style="border:0" allowfullscreen></iframe>

این برای نقشه تهرانه فکر کنید ما از این آیفریم ها تعداد زیادی در پست های مختلف داریم

چطور با یک کد در استایل قالب برای همشون یک باکس تعریف کنیم؟

0

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


لینک به پست


<div class="map">
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d207372.49201938324!2d51.349818600000006!3d35.696814100000005!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x3f8e00491ff3dcd9%3A0xf0b3697c567024bc!2z2KrZh9ix2KfZhg!5e0!3m2!1sfa!2sir!4v1442418377122" width="600" height="450" frameborder="0" style="border:0" allowfullscreen></iframe>
</div>

css


.map{
width:500px;
height;300px;
background:#eee;
border:1px solid #ccc;
padding:1px;
}

1

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


لینک به پست


<div class="map">
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d207372.49201938324!2d51.349818600000006!3d35.696814100000005!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x3f8e00491ff3dcd9%3A0xf0b3697c567024bc!2z2KrZh9ix2KfZhg!5e0!3m2!1sfa!2sir!4v1442418377122" width="600" height="450" frameborder="0" style="border:0" allowfullscreen></iframe>
</div>

css


.map{
width:500px;
height;300px;
background:#eee;
border:1px solid #ccc;
padding:1px;
}

داداش من منظورت و متوجه شدم...

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

چون تعداد زیادی از پست ها دارای این آیفریم هستن و کار سختیه برم تو هر پست این دایو و بهش اضافه کنم

0

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


لینک به پست

دوستان تاپیک بروزرسانی شد برای رسیدن به یک نتیجه :wub:

0

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


لینک به پست

دوستان تاپیک بروزرسانی شد برای رسیدن به یک نتیجه :wub:


اینجوری استایل دهی نمیشه ؟
.map iframe{
border:2px solid red
}

1

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


لینک به پست


اینجوری استایل دهی نمیشه ؟
.map iframe{
border:2px solid red
}

خیلی ممنون ولی با این کد هیچ حاشیه ای اضافه نمیشه! دوستان علتش چیه؟

ویرایش شده در توسط abolfazl
0

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


لینک به پست

سلام. علتش اینه که توی پست ها شما .map نداری که !

شما بیا این کار رو بکن مثلا بگو .


.post iframe

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

1

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


لینک به پست

سلام. علتش اینه که توی پست ها شما .map نداری که !

شما بیا این کار رو بکن مثلا بگو .


.post iframe

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

خیلی ممنون از راهنماییتون ولی بازم استایل نگرفت :(

0

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


لینک به پست

انتهای فایل style.css کد رو به این صورت گذاشتید:


.post iframe{
width:500px;
height;300px;
background:#eee;
border:4px solid #ccc;
padding:1px;
}

کار نداد ؟

اگر کار نداد جلوی هر دستور یک عبارت !important بذارید. مثلا به این صورت :


width:500px !important;

اگر باز هم کار نداد با inspect element براوزر نگاه کنید قسمت مطلب تگ هاش چه کلاسی دارن همون به جای .post بذارید در مورد نحوه استفاده از اینسپکت المنت هم جستجو کنید.

1

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


لینک به پست

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

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

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

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


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

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

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


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