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
Сообщений: 3544
Регистрация: 30.6.2011
Из: Железнодорожный (Балашиха)
Поблагодарили: 2881 раз
Репутация:   294  


что справа, монитор? для .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


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

Замечание модератора:
Эта тема была закрыта автоматически ввиду отсутствия активности в ней на протяжении 100+ дней.
Если Вы считаете ее актуальной и хотите оставить сообщение, то воспользуйтесь кнопкой
или обратитесь к любому из модераторов.


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


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


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


Свернуть

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

  Тема Ответов Автор Просмотров Последний ответ
Горячая тема (нет новых ответов) Помогите, пожалуйста, моей дочери выжить!
благотворительный топик
30 vitvirtual 3812 19.5.2018, 8:30
автор: vitvirtual
Открытая тема (нет новых ответов) Интеграция html на Wordpress
8 mxxx 1366 16.5.2018, 18:06
автор: Chezarius
Открытая тема (нет новых ответов) Перенесу вашу HTML+CSS верстку на Wordpress
0 blackhead 399 9.5.2018, 14:50
автор: blackhead
Открытая тема (нет новых ответов) Продвигаю страницу по запросу "Как сделать игру". Помогите советом, пожалуйста
Я секу в теме! Но подать статью угодным поисковикам образом не смо
22 coremission 2211 8.5.2018, 12:33
автор: coremission
Открытая тема (нет новых ответов) Вёрстка HTML-писем
15 Vampler 4675 7.5.2018, 21:10
автор: Vampler


 



RSS Текстовая версия Сейчас: 26.5.2018, 20:36
Дизайн