The_Immortal
Newbie-
Posts
26 -
Joined
-
Last visited
Content Type
Profiles
Forums
Calendar
Store
Everything posted by The_Immortal
-
Растягивание изображения на весь экран
The_Immortal replied to The_Immortal's question in HTML Coding
Таким образом отрезается изображение 😞 Не могу никак наткнуться на реализацию этого shrinkToFit... -
Растягивание изображения на весь экран
The_Immortal replied to The_Immortal's question in HTML Coding
А как всё-таки тот shrinkToFit реализовать? -
Растягивание изображения на весь экран
The_Immortal replied to The_Immortal's question in HTML Coding
Я уже пробовал - этот вариант даёт отступы по краям, чего не хотелось бы... Вообще я бы всё же хотел реализовать наверное автоматическое заполнение картинки по экрану, как это представляется по ссылке . Попробовал так: <html> <head> <meta name="viewport" content="width=device-width; height=device-height;"> <link rel="stylesheet" href="resource://content-accessible/ImageDocument.css"> <link rel="stylesheet" href="resource://content-accessible/TopLevelImageDocument.css"> <link rel="stylesheet" href="chrome://global/skin/media/TopLevelImageDocument.css"> <title>Background</title> </head> <body> <img src="https://content.screencast.com/users/immick6307/folders/Snagit/media/43d76d9a-3476-4bb7-ac03-185a3ec097bb/12.14.2021-12.42.png" class="shrinkToFit" > </body> </html> Но так выводится полное изображение... Т.е. класс "shrinkToFit" не срабатывает почему-то... -
Растягивание изображения на весь экран
The_Immortal replied to The_Immortal's question in HTML Coding
Я в конец запутался. Мне необходимо, чтобы прокрутка была ровно до конца картинки. Картинка имеет высоту 1718px. Я сделал так: html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Background</title> <style> body { background: url(https://content.screencast.com/users/immick6307/folders/Snagit/media/43d76d9a-3476-4bb7-ac03-185a3ec097bb/12.14.2021-12.42.png) no-repeat; -moz-background-size: 100%; /* Firefox 3.6+ */ -webkit-background-size: 100%; /* Safari 3.1+ и Chrome 4.0+ */ -o-background-size: 100%; /* Opera 9.6+ */ background-size: 100%; /* Современные браузеры */ } .layer { height: 1300px; } </style> </head> <body> <div class="layer"> </div> </body> </html> При этом у меня в браузере появляется лишний скроллинг - белый фон после фото. Экспериментальным путем вышел на высоту 1300px (почему-то!). При этом в мобильном браузере при горизонтальной ориентации экрана всё равно "лишний скроллинг" имеется. -
Растягивание изображения на весь экран
The_Immortal replied to The_Immortal's question in HTML Coding
А что минимально там можно указать? Я задал: <div> <br> </div> - не помогло. -
Господа, прошу прощения за ламерский вопрос (я не спец в html совсем), но подскажите, пожалуйста, по каким причинам вот этот код <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Background</title> <style> body { background: url(https://content.screencast.com/users/immick6307/folders/Snagit/media/43d76d9a-3476-4bb7-ac03-185a3ec097bb/12.14.2021-12.42.png) no-repeat; -moz-background-size: 100%; /* Firefox 3.6+ */ -webkit-background-size: 100%; /* Safari 3.1+ и Chrome 4.0+ */ -o-background-size: 100%; /* Opera 9.6+ */ background-size: 100%; /* Современные браузеры */ } </style> </head> <body> </body> </html> Не дает в браузерах скроллинг по вертикали? Пример взят отсюда. Спасибо!
-
Ребят, благодарю за подсказку, только меня интересует сохранение не на стороне клиента, а на самой странице, т.е. на стороне сервера... Видимо, я коряво выразился...
-
Всех приветствую! Друзья, сразу признаюсь, что я полный нуб, но не лентяй. Имеется простейшая задачка. На странице одно поле для ввода, значение которого попадает чуть ниже. Необходимо это значение сохранять на странице после нажатия кнопки. <html> <head> <title>Just4Test</title> </head> <body> Число2: <input id="number1"> <button id="save">Сохранить</button> <hr> <div id="result"></div> <script> function saveit() { var num = document.getElementById('number1').value; var html = 'Число1: 90' + '<br>' + 'Число2: ' + num + '<br>' + 'Число3: 105'; document.getElementById('result').innerHTML = html; } document.getElementById('save').addEventListener('click', saveit); </script> </body> </html> Я, естественно, гуглил и в качестве решений видел использование либо ActiveX, что совсем не комильфо, либо PHP, который также мне не подходит в виду IIS-сервера. Подскажите, пожалуйста, какие ещё есть вариант для сохранения данных и последующего вывода (в файл/из файла). Спасибо!
-
psywalker, да, думал об одном, писал о другом Огромнейшее Вам спасибо!
-
Всех приветствую! Друзья, пытаюсь немного подкастумайзить в одной из тем Wordpress. Подскажите, пожалуйста, каким образом можно изменить цвет отдельного списка меню? Вот нужный кусок: <li class="menu-item menu-item-type-custom menu-item-object-custom current-menu-ancestor current-menu-parent menu-item-has-children menu-item-1558" id="menu-item-1558"><a>Меню</a><ul class="sub-menu"> <li class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-1464 current_page_item menu-item-1541" id="menu-item-1541"><a href="#1">Подменю1</a></li> <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-1542" id="menu-item-1542"><a href="#2">Подменю2</a></li></ul></li>Мне необходимо изменить цвет фона только "Меню", а подменю оставить. Я сделал так (дописал в style.css): li#menu-item-1558 a { color: gold; }Но таким образом цвет применяется и к подменю тоже (элементы "Подменю1", "Подменю2"). Помогите, пожалуйста. Спасибо! P.S. Вероятно, можно переопределить фон у дочек-сыновей (Подменю), но их там большое множество...
-
Друзья, подскажите, пожалуйста, каким образом реализовать показ скрытого текста через "Читать далее"? Прбовал <сut>, но он не срабатывает. И возможно ли это реализовать через DHTML? Спасибо!
-
npofopr, В целом да, понимаю. Однако хотел повысить уровень понимания на реальном примере. Но пример этот, видимо, действительно выбран неудачно. Mozilla Firefox актуальной версии, Google Chrome актуальной версии/неOpera актуальной версии, Internet Explorer 8/9/10/11. Полагаю, что у всех обладателей вышеуказанных браузеров А тут все чистенько и понятно - я уже исследовал Пожалуй, Вы правы. Прошу прощения... И благодарю за участие!
-
iKING, Прошу прощения: #sidebar1_wrap {...min-width: 200px;}#forums_list_wrap {...min-width: 510px;}включает в себя #idx-sidebar2 {...min-width: 240px;}И т.к. #idx-sidebar2 входит в #forums_list_wrap, то получается 200 + 510 = 710, а 710 != 760, вот и не понимаю откуда эти общие 760 взялись... Да и не сжимается #forums_list_wrap до заявленных 510. Минимум по факту у него больше, а именно 752px. И получаем общую min-width: 200 + 752 = 952px и это далековато от заявленных 760px... Чертовщинка какая-то Я к тому, что #forums_list_wrap был обязан еще больше сжаться, но он почему-то этого не делает... Кстати говоря, когда по горизонтали сжимаешь окно со страницей, то там с правой стороны появляется какая-то серая фиговина, которую Firebug относит к тегу <html> - что это вообще такое?
-
Всех приветствую! Друзья, пытаюсь понять как работает min-width. Дернуло меня глянуть значение данного тега на сайте Рутрекера. Если сжимать окно с вышеуказанной страницей, до тех пор пока содержимое не перестанет сжиматься, то получим некое значение. И это значение отличается от того, что заявлено у них в body: body {...min-width: 760px;}Оно явно больше. Тогда я решил пройтись по всему css и посмотреть какие еще элементы имеют min-width: #sidebar1_wrap {...min-width: 210px;}#forums_list_wrap {...min-width: 510px;}#forums_list_wrap {...min-width: 240px;}Сложил все вместе, получилось 950px - и все равно это не соответствует действительности. 1. Быть может, кто-нибудь может подсказать где там собака зарыта? 2. Зачем ставить общий min-width меньшим, чем составляющие min-width в сумме (760px < 950px)? Благодарю!
-
rus, Да! Вы поняли о чем я :-) Не знаю, мне вот стало интересно... и обидно за первую ячейку, т.к. в данной ситуации именно у нее и позаимствовали этот пиксель. А почему именно так и где это описано (ровно как и про "top...; left...; сильнее чем right...; bottom;") - непонятно... Ну да Бог с ним :-) Я извиняюсь, но все-таки Вы не могли бы пояснить как это: соответсвует вот этому: Речь идет про width. Если бы мне не порекомендовали Firebug, то я и не задался этим вопросом. Но когда я увидел вот это: , то мне стало непонятно, а где же На скрине явно видно, что Firebug под шириной блока бордеры не учитывает (рамка вокруг ячейки не выделена). Вопрос: почему? Эм... Давайте проясним. Если ширина таблица задана 350px, то она и останется 350px, не смотря на наличие бордеров. Область без бордеров (уж не знаю как ее обозвать) будет равна 348px. А вот как Вы получили 352px мне не ясно. Или Вы это для меня так интерпретировали?
-
rus, Эм... И? :-) Про это я в курсе. Как это связано с моим вопросом: ?
-
npofopr, оказывается читать иногда полезно)) Правда, это как-то противоречит вот этому: Ну да ладно. Firebug, вероятно, показывает по умолчанию. Благодарю! Но вот ответа на второй вопрос не нашел...
-
rus, npofopr, благодарю за подсказку! Однако осталось еще пару вопросов. <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>cell width</title> <style> * { margin: 0; padding: 0; } table { border: none; border-collapse: collapse; } td { border: 1px solid; } </style> </head> <body> <table width=350> <tr> <td width=300>Cell1</td> <td width=50>Cell2</td> </tr> </table> </body></html>1. При наведении Firebug'ом на td маркером выделяется ячейка, но без учета border'а. Получается ширина ячейка не включает в себя border. Это действительно так? 2. Почему правый бордер первой ячейки (или это левый бордер второй ячейки?) закрывается на позиции 299px, а не на 300/301px? Такое ощущение, что приоритет по ширине отдается второй ячейке...
-
rus, <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>cell width</title> <style> td { border: 1px solid; } </style> </head> <body> <table width="350"> <tr> <td width=300>Cell1</td> <td width=50>Cell2</td> </tr> </table> </body></html>Сделал: Еще непонятнее стало... Дык они же по умолчанию 0... Разве нет?
-
Всех приветствую! Друзья, помогите, пожалуйста, понять в чем проблема. <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>cell width</title> <style> td { border: 1px solid; } </style> </head> <body> <table> <tr> <td width=300>Cell1</td> <td width=50>Cell2</td> </tr> </table> </body></html>На выходе: Собственно, вопрос: откуда получается ширина размером в 304px, когда она задается 300px. Спасибо!
-
1) Ребят, поведайте, пожалуйста, полному нубу откуда повелось переопределять тэг html в css? html { background-color: #FFFFFF; background-image: url("../../Img/bckgrnd.jpg"); background-position: center top; background-repeat: repeat; min-height: 400px; } Дело в том, что, подобных приемов в уроках я не встречал. Вроде как всегда приучали работать с body. Но на практике очень часто вижу подобное. 2) Никак не могу понять назначение height: 100% применительно к тому же html: html { ... height: 100%; } - что это дает? Каким образом происходит растяжение по высоте? Пробовал экспериментировать, убирая данное свойство, но никакого изменения не выявил... В общем, подскажите, пожалуйста Благодарю!
-
Дык все-таки, ребят, как это пофиксить? Некрасиво же, да и нелогично.
-
Vadimka, огромнейшее спасибо Вам! Для меня это очень сложно, поэтому решил максимально упростить: http://jsfiddle.net/The_Immortal/kVxDU/
-
Пытаюсь редактить готовый шаблон. Имеется список ссылок в виде маркированного списка: http://jsfiddle.net/The_Immortal/kVxDU/ Необходимо этот список оцентрировать... Я так понимаю, надо центрировать div, в котором содержится ul. Поэтому написал: <div class="usermenu"; align="center"> Но, как видите, результата никакого
-
npofopr, FireFox 16.0.2. А при каком распорядке этих псевдоклассов смотрите и в каком браузере? Лучше наглядно показать: http://jsfiddle.net/The_Immortal/YXuxD/ - при наведении фиолетовая подсветка, а при щелчке - черная. Теперь проделайте следующее: наведите курсор на ссылку (она подсветится фиолетовым), потом зажмите левую кнопку мышки на ссылке (она подсветится черным), далее отщелкните ее в путом месте. Ссылка остается подсвечиваться черным. И если сейчас на нее навести курсор, то она также останется с черной подсветкой, хотя должна быть с фиолетовой.