Помогите нубу

newbie · 15.02.2011, 21:41

Всем привет!

Может кто-нибудь помочь? Дело вроде не трудное, но хтмл я видел последний раз много лет назад в школе, а сделать надо срочно..

В чём, собственно, вопрос: сделать страничку, на которой по центру будет надпись, в углу небольшая картинка. Страничка масштабируемая, надпись и картинка с эффектом выдавливания.
Делать выдавливание в фотошопе я умею, но как лучше поступить в моём случае? Сделать всё в фотошопе и поставить масштабируемым фоном? Если да, то как сделать масштабируемый фон?

Ну или хотя бы ткните, где посмотреть/что почитать, сам поковыряюсь..

vladendark · 15.02.2011, 21:50

http://css3generator.com/ выбираем text-shadow и в бой
картинку позиционируем absolute/

если надо очень - то покажите скриншот того, чего желаете добиться

newbie · 15.02.2011, 23:29

Добиться хочу вот такого + в правом/левом углу небольшой рисунок в таком же стиле, что и надпись.

Добавлено через 1 час 10 минут

Если делаю вот так

PHP код:


			
<html>

        <head>

                <meta http-equiv="Content-Type" content="text/html; charset=windows-utf-8">

        <link rel="stylesheet" type="text/css" href="style.css">

                <title>Index</title>

        </head>

<body>

        <div class="figure">

                <img class="scaled" src="1.jpg">

        </div>

</body>

</html>

а в style.ccs так

PHP код:


			
img.scaled {

  width: 100%;

  height: 100%;

}

то получается сносно, но по краям фона остаются белые полоски..

vitaly-go · 15.02.2011, 23:32

должно помочь

Код:

* { margin:0; padding:0; }

vladendark · 15.02.2011, 23:54

Цитата:

должно помочь

чему? ослу (IE) правильно считать отступы - ну да, поможет. а человеку нет

Цитата:

то получается сносно, но по краям фона остаются белые полоски..

я окончательно запутался. Вы хотите вышеуказанную картинку растянуть на весь экран?
тогда нужно width и height задавать самой картинке а не обрамляющему блоку. НО ТАК ДЕЛАТЬ НИЗЗЗЯ!

Можно поставить ее в background к body либо через css, либо как-то так, хотя и это не лучшая реализация

в любом случае, вам необходимо иметь достаточно большую картинку для заднего фона.

либо же делать задний фон отдельно градиентным а картинку с буквами вставлять в документ и позиционировать

newbie · 16.02.2011, 01:37

Цитата:

я окончательно запутался. Вы хотите вышеуказанную картинку растянуть на весь экран?

Нет, я просто пытаюсь достигнуть любыми способами нужного результата - получить страницу с надписью и картинкой, которые будут одинаково нормально смотреться на разных разрешениях..

Цитата:

либо же делать задний фон отдельно градиентным а картинку с буквами вставлять в документ и позиционировать

А вот тут можно поподробнее о реализации?

vladendark · 16.02.2011, 07:39

дайте PSD вашего макета - я вам сверстаю

15.02.2011, 21:41	#1
newbie	Всем привет! Может кто-нибудь помочь? Дело вроде не трудное, но хтмл я видел последний раз много лет назад в школе, а сделать надо срочно.. В чём, собственно, вопрос: сделать страничку, на которой по центру будет надпись, в углу небольшая картинка. Страничка масштабируемая, надпись и картинка с эффектом выдавливания. Делать выдавливание в фотошопе я умею, но как лучше поступить в моём случае? Сделать всё в фотошопе и поставить масштабируемым фоном? Если да, то как сделать масштабируемый фон? Ну или хотя бы ткните, где посмотреть/что почитать, сам поковыряюсь..

15.02.2011, 21:50	#2
vladendark	http://css3generator.com/ выбираем text-shadow и в бой картинку позиционируем absolute/ если надо очень - то покажите скриншот того, чего желаете добиться

15.02.2011, 23:29	#3
newbie	Добиться хочу вот такого + в правом/левом углу небольшой рисунок в таком же стиле, что и надпись. Добавлено через 1 час 10 минут Если делаю вот так PHP код: `<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=windows-utf-8"> <link rel="stylesheet" type="text/css" href="style.css"> <title>Index</title> </head> <body> <div class="figure"> <img class="scaled" src="1.jpg"> </div> </body> </html>` а в style.ccs так PHP код: `img.scaled { width: 100%; height: 100%; }` то получается сносно, но по краям фона остаются белые полоски.. Последний раз редактировалось newbie; 15.02.2011 в 23:29.. Причина: Добавлено сообщение

15.02.2011, 23:32	#4
vitaly-go	должно помочь Код: * { margin:0; padding:0; }

16.02.2011, 07:39	#7
vladendark	дайте PSD вашего макета - я вам сверстаю