текстовый водяной знак на веб-сайте? как сделать это?

Вы могли сделать изображение с водяным знаком и затем установить изображение как фон с помощью CSS.

Например:

<style type="text/css">
.watermark{background:url(urltoimage.png);}
</style>
<div class="watermark">
<p>this is some text with the watermark as the background.</p>
</div>

Это должно работать.

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

Если Вы хотели бы, чтобы это покрыло целую страницу, заставьте отделение с классом 'делать водяные знаки' и определить свой стиль как что-то как:

.watermark
{
   background-image: url(image.png);
   background-position: center center;
   background-size: 100%; /* CSS3 only, but not really necessary if you make a large enough image */
   position: absolute;
   width: 100%;
   height: 100%;
   margin: 0;
   z-index: 10;
}

Если Вы действительно хотите, чтобы изображение простиралось для установки, можно пойти немного далее и добавить изображение в то отделение и определить его стиль для установки (width/height:100%;).

Конечно, это идет с довольно важным протестом: IE6 и некоторые старые браузеры не могли бы знать, что сделать с прозрачным pngs. Имея гиганта, непрозрачное изображение, касающееся Вашего сайта, конечно, не сделало бы. Но существуют некоторые взломы для обхождения этого, к счастью, который Вы, скорее всего, захотите сделать при использовании прозрачного png.

Если Вы добавляете "фоновое вложение: прикрепленный" к CSS в предложении kavendek выше, можно "прикрепить" фоновое изображение к указанному местоположению в окне. Тем путем водяной знак будет всегда оставаться видимым, неважно, куда пользователь прокручивает на странице.

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

<style type="text/css">
#watermark {
  color: #d0d0d0;
  font-size: 200pt;
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  position: absolute;
  width: 100%;
  height: 100%;
  margin: 0;
  z-index: -1;
  left:-100px;
  top:-200px;
}
</style>

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

<div id="watermark">
<p>This is the test version.</p>
</div>