Formulario Dreamweaver

Bluesday · 28 de julho de 2011

Ola a todos.

Sou novo na area do dreamweaver. Estou ah 3 meses ja mexendo nele.

porém ainda ah muitas duvidas mesmo tendo um professor bom que me ensino bastante.

Preciso criar um sistema de postagem e atualização. Parecido com twitter.

E quero criar um input ="text" que nao seja aquela caixa branca. Quero usar

uma imagem que fiz no photoshop para digitar dentro dela.

Uma para nome, outra email e uma para um grande conteudo de mensagem.

porém nao to sabendo como fazer com que a imagem vire um espaço para digitação.

Help please. Estou sem muito tempo para fazer isso :/

DiF · 28 de julho de 2011

ola amigo. pra fazer isso é bastante simples.. basta você criar uma div e criar a area de digitaçao de texto.. seja uma caixa de texto ou um textarea.. dentro dessa div e por CSS você retira a borda e o fundo deixe como background: transparent da caixa de texto ou textarea depois dentro da div coloque sua imagem como background-image.

Bluesday · 28 de julho de 2011

O que eu tinha feito antes de postar o topico era isso aqui. Mas ainda estou meio confuso sobre qual esta mais proximo de esta certo.

<div id="caixa1"> <input border="0" src="file:///C|/Users/Bluesday/Desktop/Prova DreamFUdido/imagens/caixa.png" name="text" width="288" height="35" type="image"></div>

<div id="caixa1"> <input border="0" src="file:///C|/Users/Bluesday/Desktop/Prova DreamFUdido/imagens/caixa.png" name="text" width="288" height="35" type="image"

#caixa1{
	width:286px; height:34px; margin-top:1575px; margin-left:120px; background-image:url(imagens/caixa.png)
}

Poderia mostra um exemplo usando os meus comandos. Para eu fazer da forma certa

??

E agradeço a ajuda que esta dando.

DiF · 28 de julho de 2011

olha amigo... eu nao costumo dar coisas prontas.. mas nesse caso vou postar um exemplo que eu criei aqui.

bom pelo que eu li no seu codigo.. isto seria uma prova? bem nao vou fazer sua questao, meu exemplo é totalmente diferente do seu propósito de questao.. mas serve como base pois é este o caminho. te dei este codigo para fins de estudo. espero q você estude ele e compreenda todas as propriedades utilizadas.. o CSS criado para manipular os elementos..


<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
<style type="text/css">
#postIt{
	width: 350px;
	height: 360px;
	background-image: url(img/fundo.png);
}

#postIt textarea{
	resize: none;
	position: relative;
	top: 7em;
	left: 2em;
	border: none;
	background: transparent;
}

#postIt input.btn_envia{ 
	position: relative; 
	top: 7.5em; 
	left: 19.8em;
	-moz-border-radius: 20px;
	background-color: #fef6ac;
}
</style>
</head>
<body>
<div id="postIt">
	<textarea rows="12" cols="35"></textarea>
	<input type="submit" value="Enviar" class="btn_envia">
</div>
</body>
</html>