учу сь верстать

leto2012 · February 11, 2012

Здравствуйте,


<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>test</title>
<style>

	 BODY {

  }

#pic    {height:500px;
	width:500px;
	background:#000 url(pic2.png) no-repeat; 

	 position: absolute; /* Абсолютное позиционирование */
   	 bottom: 15px; /* Положение от нижнего края */
    	right: 15px; /* Положение от правого края */

   }

</style>
</head>
<body>
<div id ="pic">  
</div>
</body>
</html>

мне нужно, чтобы половина стебелька была черной

http://olga153b.freetzi.com/ola/index.html

Некоторые тексты из макета перенеслись нормально, а остальные не переносятся, что-то я делаю не правильно.

Edited February 11, 2012 by leto2012

Arinden · February 11, 2012

мне нужно, чтобы половина стебелька была черной

Половина какого стебелька? На изображении? Photoshop Вам в помощь...

leto2012 · February 12, 2012

мне нужно, чтобы половина стебелька была черной
Половина какого стебелька? На изображении? Photoshop Вам в помощь...

там 2 стебелька, один в руке, второй просто в земле. Нужно второй.

ablay2009 · February 12, 2012

Вот ведь люди пошли.... Да причем тут верстка, если вам нужно изображение отредактировать? Photoshop + прямые руки(желательно обе) и все дела.

leto2012 · February 12, 2012

Вот ведь люди пошли.... Да причем тут верстка, если вам нужно изображение отредактировать? Photoshop + прямые руки(желательно обе) и все дела.

я сделала что-то наподобие, но не совсем то что надо. Хотела бы, чтобы исправили как надо. Дайте плз ссылку, где хорошие уроки фотошопа.

http://olga153b.freetzi.com/ola/absolut.html


<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>test</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js" type="text/javascript"></script>
<script src="js/project.js" type="text/javascript"></script>
<link href="css/style.css" media="screen" rel="stylesheet" type="text/css" />
<!--[if IE 7]><link href="css/ie7.css" rel="stylesheet" type="text/css" /><![endif]-->
<!--[if IE 8]><link href="css/ie8.css" rel="stylesheet" type="text/css" /><![endif]-->
<!--[if IE 9]><link href="css/ie9.css" rel="stylesheet" type="text/css" /><![endif]-->
</head>

<body>

        <div id="wrapper">
	<div id ="pic">	

	</div>
</div>	

</body>
</html>

css/style.css

#pic {height:500px;

width:500px;

background: url(pic2.png) no-repeat;

position: absolute; /* Абсолютное позиционирование */

top: 100px; /* Положение от нижнего края */

right: 15px; /* Положение от правого края */

line-height: 1px;

}

не пойму почему это не работает.

тогда как этот код работает


<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>test</title>
<style>

	 BODY {

  }

#pic    {height:500px;
	width:500px;
	background: url(pic2.png) no-repeat; 

	 position: absolute; /* Абсолютное позиционирование */
   	 top: 50px; /* Положение от нижнего края */
    	right: 15px; /* Положение от правого края */

   }

</style>
</head>
<body
<div id ="pic">  
</div>
</body>
</html>

Заранее спасибо.

Edited February 13, 2012 by leto2012

Arinden · February 12, 2012

.png формат Edited February 12, 2012 by Arinden

leto2012 · February 13, 2012

http://olga153b.freetzi.com/ola/index.html

кое-что получилось

Edited February 17, 2012 by leto2012

klierik · February 13, 2012

http://savepic.su/1316691.htm
спасибо

Тут лучше использовать не слайсы а Trim.

1. прячем все слои и оставляешь только тот каоктрый должен быть в итоге в PNG/JPG

2. потом идешь: Image -> Trim. Фотошом саб обрежет все что лишнее размер холста будет равен рисунку

3. потом, в данном случае, включаешь слои с черным и белым фоном (ПСД не видел, но предпологаю что они быть должны)

4. сохраняешь в ПНГ через: File -> Save for Web. Прозрачность включена. Тут, кстати, вполне подойдет JPG, так ак полупрозрачность тут не требуеся, вроде как

skygazer · February 13, 2012

Такая страничка интересная получилась

Может вам в дизайнеры податься?

witec · February 13, 2012

я сделала что-то наподобие, но не совсем то что надо. Хотела бы, чтобы исправили как надо. Дайте плз ссылку, где хорошие уроки фотошопа.
http://olga153b.free...la/absolut.html

В google есть все...

Уроков Photoshop очень много, и фото и видео, вот к примеру, вроде нормальный(только большой)Photoshop CS5 от А до Я http://photoshop-master.org/disc15/ Можно купить, можно скачать в инете.

klierik · February 13, 2012

дополню witec

Еще хороший вариант это уроки с Lynda.com, которые не сложно найти, к примеру на рутрекере.

И не смотря на то что они на английском языке, если это проблема, то просматривая видео станет и так понятно о чем идет речь.

leto2012 · March 1, 2012

дополню witec
Еще хороший вариант это уроки с Lynda.com, которые не сложно найти, к примеру на рутрекере.
И не смотря на то что они на английском языке, если это проблема, то просматривая видео станет и так понятно о чем идет речь.

Да, с помощью trim получилось хорошо

http://savepic.net/2510751.htm спасибо.

Sign In

учу сь верстать

Question

Link to comment

Share on other sites

11 answers to this question

Recommended Posts

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Join the conversation

Обсуждения

Important Information