2014-07-02 3 views
1

Я размещаю свой сайт в Blogger и имею базовое понимание HTML и CSS. Я хочу добавить совместное дополнение к вашей ссылке с SimplyLinked. Однако ...Переопределить ширину изображения, стандартизованную стандартом HTML, предотвратить взорванную фотографию JS сторонних производителей?

HTML, они дали мне было это:

<script type="text/javascript" src="http://www.simply-linked.com/listwidget.aspx?l=60A7D397-F94E-4840-8DFE-BCCB40BA298F" 
></script> 

Но поскольку у меня есть HTML установить ширину для каждой фотографии размещены на веб-сайт, чтобы быть 800px, что на самом деле должна быть маленькая кнопка на внизу списка заканчивается ужасно негабаритный. See pic here.

Как я могу (или действительно, могу ли я) переопределить HTML-код, который программирует тело моего блога, чтобы изображения на стороннем javascript были их надлежащего размера?

спасибо !!


[EDIT 7/2/14 12:16 утра]

Я так ценю ответов, и я быстро понимая, как мало я знаю об этом. Спасибо за вашу помощь и ваше терпение!

Wyzard: Вы абсолютно правы - это CSS. (Я все еще изучаю!)

ejay_francisco: CSS (как правильно указал Wyzard) добавлен прямо перед концом кожи. Это тонна кода, я не думаю, что могу опубликовать все это здесь ...? Но, может быть, этот отрывок полезно:

.post-body img { 
width: 800px!important; 
height: auto!important; } 
#sidebar-left-1 {margin: 0 0px 0 -10px; 
} 
#Blog1 {margin: 0px 0px 0 30px; 
} 
#HTML6{ 
margin:60px 0 0 0px; 
} 
#navbar, #Attribution1{ 
display:none; 
}]]></b:skin> 
+0

Вы можете оставить свой HTML-разметку? для других посмотреть, где он находится. – Yaje

+0

Что вы имеете в виду: «У HTML установлен ширина для каждой фотографии»? Атрибут 'width' HTML является частью отдельного элемента '', и изображение, добавленное этим скриптом, вообще не имеет атрибута width. Вы имеете в виду, что у вас есть правило CSS, например 'img {width: 800px; } '? – Wyzard

+0

Просто хотел, чтобы вы оба знали, что я ответил на ваши вопросы как редактирование оригинального сообщения. Благодаря! – user3795801

ответ

0

Вы можете добавить этот код в ваш HTML (предпочтительно <head>, но <body> будет работать):

<style> 
    .sl_i a img { 
    width: 181px; 
    height: 28px; 
    } 
</style> 

... Или еще лучше, добавьте его в CSS , без тегов <style> и </style>.

Вы можете удалить символ новой строки (возврат каретки) и сократить строки нескольких пространств до одного места, если вы хотите, чтобы сэкономить место:

<style>.sl_i a img{width:181px;height:28px;}</style> 

Что она делает это цель любой <img> элемент вложен внутри элемента <a>, вложенного в элемент класса sl_i. Я получил это определение, открыв href в окне браузера, проверив изображение и отметив его позицию в DOM.

ДЕМОНСТРАЦИЯ: http://jsbin.com/gefiq/1/