X   Сообщение сайта
(Сообщение закроется через 3 секунды)



 

Здравствуйте, гость ( Вход | Регистрация )

Открыть тему
Тема закрыта
> Помогите немножко по html, А то уже совсем...
Maxim-KL
Maxim-KL
Topic Starter сообщение 12.2.2013, 2:56; Ответить: Maxim-KL
Сообщение #1


MaximGroups.net
******

Группа: Banned
Сообщений: 1423
Регистрация: 24.9.2010
Из: localhost
Поблагодарили: 436 раз
Репутация:   122  


О великие Гуру html помогите запутавшемуся барану...

Ситуация такая. Есть картинка Тыц, простенький монитор и в центр то есть в самой матрице нужно вставить таблицу в которой в будущем будет выводиться видео или картинка. И это все нужно организовать на голом html.

Все как бы просто но у меня все время что то криво получается и уже совсем запутался, ча монитор разобью, нервы сдают!!!

Кому не сложно помогите пожалуйста, буду очень благодарен.


--------------------
Забанен за мошенничество
0
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Vred
Vred
сообщение 12.2.2013, 3:05; Ответить: Vred
Сообщение #2


мошенник
*****

Группа: Banned
Сообщений: 679
Регистрация: 19.6.2012
Из: Украина
Поблагодарили: 314 раз
Репутация:   53  


Maxim-KL,


.video {padding-top: XXpx; padding-left: XXpx} - тут подгоняй

<div class="video"> - див по размеру картинки, монитор фоном, видяха в диве
<iframe width="433" height="244" src="http://www.youtube.com/embed/LOoRDBC3OHI" frameborder="0" allowfullscreen></iframe>
</div>


Сообщение отредактировал Vred - 12.2.2013, 3:06


--------------------
Забанен за мошенничество


Поблагодарили: (1)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
devuser
devuser
сообщение 12.2.2013, 3:07; Ответить: devuser
Сообщение #3


Все будет тип-топ
*****

Группа: Active User
Сообщений: 713
Регистрация: 5.12.2012
Из: Online
Поблагодарили: 342 раза
Репутация:   52  


Да ну, берегите нервы
http://d1.news-more.ru/maxim/

В исходном коде все стили


--------------------


Поблагодарили: (1)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Vred
Vred
сообщение 12.2.2013, 3:22; Ответить: Vred
Сообщение #4


мошенник
*****

Группа: Banned
Сообщений: 679
Регистрация: 19.6.2012
Из: Украина
Поблагодарили: 314 раз
Репутация:   53  


<style>
.video {width: 512px; height: 512px; background-image: url(Monitor.png); padding: 0px; background-repeat:no-repeat; background-position:left  }
.code { padding-top: 80px; padding-left: 41px;}
</style>


<div class="video">
<div class="code"><iframe width="433" height="244" src="http://www.youtube.com/embed/LOoRDBC3OHI" frameborder="0" allowfullscreen></iframe></div>
</div>


Вот у меня на скорую руку такой код получился
Вроде работает
Но можно грамотней

P.S.: Но я бы не стал возиться с вставкой ролика в картинку монитора
Самый шик сейчас - чтобы по клику ролик открывался в модальном окне в широком формате и приличном размере.
Как открываются всякие jquery лайтбоксы для картинок.


--------------------
Забанен за мошенничество


Поблагодарили: (1)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Maxim-KL
Maxim-KL
Topic Starter сообщение 12.2.2013, 3:41; Ответить: Maxim-KL
Сообщение #5


MaximGroups.net
******

Группа: Banned
Сообщений: 1423
Регистрация: 24.9.2010
Из: localhost
Поблагодарили: 436 раз
Репутация:   122  


Vred, devuser, Огромное вам спасибо за то что помогли а то думал ча что то сломаю...


--------------------
Забанен за мошенничество
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Vred
Vred
сообщение 12.2.2013, 3:44; Ответить: Vred
Сообщение #6


мошенник
*****

Группа: Banned
Сообщений: 679
Регистрация: 19.6.2012
Из: Украина
Поблагодарили: 314 раз
Репутация:   53  


Maxim-KL, да не стоит оно таких нервов. Relax


--------------------
Забанен за мошенничество


Поблагодарили: (1)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Maxim-KL
Maxim-KL
Topic Starter сообщение 13.2.2013, 4:46; Ответить: Maxim-KL
Сообщение #7


MaximGroups.net
******

Группа: Banned
Сообщений: 1423
Регистрация: 24.9.2010
Из: localhost
Поблагодарили: 436 раз
Репутация:   122  


И так моя проблема продолжение... Ну никак я не могу нормально работать с голым html в больших обемах у меня траблы получаются... Все что выше спрашивал я организовал так:
<style type="text/css"><!--
        .monitor{
position:relative;
width:512px;
height:512px;
background:url(http://....Monitor.png) left top no-repeat;
}
.area{
position:absolute;
left:40px;
top:80px;
width:430px;
height:245px;
background:#ddd;
overflow:hidden;
}
.area *{
max-width:430px;
max-height:245px;
}

--></style>&nbsp;

&nbsp;
<div class="monitor">
<div class="area">

Нужная вставка

</div>
</div>


Но почему то идет выравнивание на левую сторону странички а мне надо на правую... Как я не пробую передвинуть в право оно все равно отображается с левой стороны... Как это чудо передвинуть в правую сторону? 478.gif


--------------------
Забанен за мошенничество
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
x64
x64
сообщение 13.2.2013, 13:47; Ответить: x64
Сообщение #8


F.A.L.L.O.U.T.
*******

Группа: Super Moderator
Сообщений: 3432
Регистрация: 30.6.2011
Из: Железнодорожный (Балашиха)
Поблагодарили: 2750 раз
Репутация:   289  


что справа, монитор? для .monitor добавить:
margin-left:auto;

или содержимое? для .area
text-align:right;


--------------------


Поблагодарили: (1)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
devuser
devuser
сообщение 13.2.2013, 14:50; Ответить: devuser
Сообщение #9


Все будет тип-топ
*****

Группа: Active User
Сообщений: 713
Регистрация: 5.12.2012
Из: Online
Поблагодарили: 342 раза
Репутация:   52  


для .monitor добавьте в css
float:right


Собственно по моей ссылке выше я обновил код, чтоб можно было увидеть как получится.

Сообщение отредактировал devuser - 13.2.2013, 14:54


--------------------


Поблагодарили: (1)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Открыть тему
Тема закрыта
1 чел. читают эту тему (гостей: 1, скрытых пользователей: 0)
Пользователей: 0


Свернуть

> Похожие темы

  Тема Ответов Автор Просмотров Последний ответ
Открытая тема (нет новых ответов) Помогите выбрать ноутбук
Ноутбук для детей
14 kstnews 313 Сегодня, 3:34
автор: anchous
Открытая тема (нет новых ответов) Помогите выбрать программу
Помогите выбрать программу
11 impak 1356 11.12.2017, 13:11
автор: Mikki
Открытая тема (нет новых ответов) Вёрстка. Per aspera ad html.
С радостью принимаю заказы по вёрстке.
3 ValeryRar 461 1.12.2017, 11:02
автор: ValeryRar
Открытая тема (нет новых ответов) Исправлю HTML ошибки на страницах Вашего сайта
10 guruapps 1213 30.11.2017, 22:59
автор: maxim1249
Открытая тема (нет новых ответов) Помогите найти плагин на WP
Отзывы с профилей соц сетей
1 SEOMR 450 30.11.2017, 7:18
автор: Nell


 



RSS Текстовая версия Сейчас: 18.12.2017, 7:50
Дизайн