MXStudio » Felipemacena

Sistema de notícias PHP/MySql/DW 2ª parte

Felipemacena — Mon, 25 Oct 2004 00:00:00 +0000

Salve Comunidade,

Conforme combinado vamos hoje ver a segunda e última parte do nosso tutorial de sistema de notícias utilizando PHP, MySql e Dreamweaver.
Abordaremos nesta fase um novo bloco de códigos, onde o mesmo terá a função de recuperaros dados cadastrados em nossa base de dados (MySql).
Vamos ao código do arquivo recuperar.php

//sistema de notícias
//felipemacena – mxstudio

//primeiro vamos conectar nosso banco de dados – MySql

$conexao= mysql_connect(“hostname”, “user”, “pass”);
//onde string hostname:port:/path/to/socket = o caminho, endereço do host,
ex: localhost
//string username = nome do usuário da base de dados
//string password = a senha do usuário da base de dados

$db = mysql_select_db(“database_name”);
//onde string database_name, o nome da nossa tabela que é news

$sql = “SELECT * FROM news WHERE ver = ‘on’ ORDER BY id DESC LIMIT 30″;
//onde news é o nome da nossa base de dados criada no primeiro tutorial
//lembra-se que o webmasetr irá aprovar ou nao as noticias que irão no site?
//então neste caso nosso script irá apenas listar as notícias que foram
aprovados, por isso o ‘on’
//ASC = listar as notícas em ordem ascendente de inclusão
//LIMIT 30, vai listar as ultmias 30 noticias cadastradas, você pode
alterar para qualquer valor
//caso queira listar todas as notícias retire LIMIT 30

$resultado = mysql_query($sql)
or die (“string message”);
//onde string mesasge é a mensagem caso o mysql não consiga realizar a
consulta

while ($linha=mysql_fetch_array($resultado)){
//comando para buscar cada campo de notícia e organizar no formato html

$id= $linha["id"];
$nome= $linha["nome"];
$sobrenome= $linha["sobrenome"];
$cidade= $linha["cidade"];
$estado= $linha["estado"];
$email= $linha["email"];
$data= $linha["data"];
$hora= $linha["hora"];
$titulo= $linha["titulo"];
$subtitulo= $linha["subtitulo"];
$texto= $linha["texto"];
$ver= $linha["ver"];
$novadata= substr($data,8,2).”/”.substr($data,5,2).”/”.substr($data,0,4);
$novahora= substr($hora,0,2).”h”.substr($hora,3,2).”min”;

echo”Identidade da Notícia: $id”;
echo”
”;
echo”Autor da Notícia: $nome $sobrenome || $email”;
echo”
”;
echo”Cidade: $cidade || Estado: $estado”;
echo”
”;
echo”Data: $novadata || Hora: $novahora”;
echo”
”;
echo”Titulo da Notícia: $titulo”;
echo”
”;
echo”Subtituo da Notícia: $subtitulo”;
echo”
”;
echo”Texto da Notícia: $texto”;
echo”
”;
echo”Autorizado pelo Webmaster: “;
if ($ver=on) {
echo”Verdadeiro”;
}
else {
echo”Falso”;
}
echo”
”;
echo”
”;
}
?>

Acabamos de criar as variáveis ($nome, $data, $hora, …) para cada campo do nosso formulário, tabela.
Agora vamos a parte mais importante que é a vez do webmaster controlar as notícas que irão ao ar ou não, através do arquivo controlar.php

$db = mysql_select_db(“database_name”);
//onde string database_name, o nome da nossa tabela que é news

$sql = “SELECT * FROM news WHERE ver = ‘on’ || ver = ‘off’ ORDER BY id ASC”;
//onde news é o nome da nossa base de dados criada no primeiro tutorial
//lembra-se que o webmasetr irá aprovar ou nao as noticias que irão no site?
//então neste caso nosso script irá apenas listar as notícias que foram
aprovados, por isso o ‘on’
//ASC = listar as notícas em ordem ascendente de inclusão
//LIMIT 30, vai listar as ultmias 30 noticias cadastradas, você pode
alterar para qualquer valor

$resultado = mysql_query($sql)
or die (“Erro de Query”);
//onde string mesasge é a mensagem caso o mysql não consiga realizar a
consulta

echo”

”;
echo””;
echo””;
echo””;
echo””;
echo””;
echo””;
echo””;
echo””;
echo””;
echo””;
echo””;
echo””;
echo””;
echo””;

while ($linha=mysql_fetch_array($resultado))
{
$id= $linha["id"];
$nome= $linha["nome"];
$sobrenome= $linha["sobrenome"];
$cidade= $linha["cidade"];
$estado= $linha["estado"];
$email= $linha["email"];
$data= $linha["data"];
$hora= $linha["hora"];
$titulo= $linha["titulo"];
$subtitulo= $linha["subtitulo"];
$noticia= $linha["noticia"];
$ver= $linha["ver"];

$novadata= substr($data,8,2).”/”.substr($data,5,2).”/”.substr($data,0,4);
$novahora= substr($hora,0,2).”h”.substr($hora,3,2).”min”;

echo”

”;
echo””;
echo””;
echo””;
echo””;
echo””;
echo””;
echo””;
echo””;
echo””;
echo””;
echo””;
echo””;
echo””;
}
echo”

Identidade da Notícia:	Nome:	Sobrenome:	Cidade:	Estado:	Email:	Data:	Hora:	Título da Notícia:	Liberada pelo WebMaster?	Alterar:	Deletar:
$id	$nome	$sobrenome	$cidade	$estado	$email	$novadata	$novahora	$titulo	$ver	Alterar	Deleta

”;

?>

Não sei se vocês perceberam, mas criamos dois links umpara o arquivo altera.php e outro para o arquivo deleta.php, que servem para webmaster alterar qualquer informação e para deletar as notícias indesejadas, iremos agora criar estes dois arquivos.

Arquivo altera.php

$db = mysql_select_db(“database_name”);
//onde string database_name, o nome da nossa tabela que é news

$sql = “SELECT * FROM news WHERE id = ‘$id’”;
//onde news é o nome da nossa base de dados criada no primeiro tutorial
//lembra-se que o webmasetr irá aprovar ou nao as noticias que irão no site?
//então neste caso nosso script irá apenas listar as notícias que foram
aprovados, por isso o ‘on’
//ASC = listar as notícas em ordem ascendente de inclusão
//LIMIT 30, vai listar as ultmias 30 noticias cadastradas, você pode
alterar para qualquer valor

$resultado = mysql_query($sql)
or die (“Erro de Query”);
//onde string mesasge é a mensagem caso o mysql não consiga realizar a
consulta

$novadata= substr($data,8,2).”/”.substr($data,5,2).”/”.substr($data,0,4);
$novahora= substr($hora,0,2).”h”.substr($hora,3,2).”min”;

echo”Alterar”;
echo”
”;
echo”

”;
}
?>

Arquivo deleta.php

$db = mysql_select_db(“database_name”);
//onde string database_name, o nome da nossa tabela que é news
$sql= “DELETE FROM news WHERE id=’$id’”;
$resultado= mysql_query($sql)
or die (“string message”);
echo”Noticia excluida com sucesso”;
?>

Finalmente chegamos ao final da nossa matéria so falta criarmos mais um arquivo que será responsável em receber os dados do nosso arquivo altera.php e realizará a troca das infrmações no MySql.

$db = mysql_select_db(“database_name”);
//onde string database_name, o nome da nossa tabela que é news
$sql= “UPDATE news SET id=’$id_novo’, nome=’$nome_novo’,
sobrenome=’$sobrenome_novo’, cidade=’$cidade_novo’, estado=’$estado_novo’,
email=’$email_novo’, titulo=’$titulo_novo’, subtitulo=’$subtitulo_novo’,
texto=’$noticia_nova’, ver=’$ver_novo’ WHERE id=’$id’”;
$resultado= mysql_query($sql)
or die (“Erro de Query”);
//onde string mesasge é a mensagem caso o mysql não consiga realizar a
consulta
echo”Sua Noticia foi alterada com sucesso.”;
?>

Salve-o como altera_db.php

Espero ter atendido as necessidades da comunidade em relação a este pequeno sisteminha de notícias, qualquer dúvida favor consultar o nosso fórum.

Sistema de notícias PHP/MySql/DW

Felipemacena — Sat, 23 Oct 2004 00:00:00 +0000

Salve Comunidade,

Conforme prometido em nosso fórum, estarei hoje começando a nossa coluna sobre sistema de notícias utilizando Dreamweaver, PHP e MySql, espero que possa ser bem didático e que no final todos fiquem satisfeitos.
Inicialmente começaremos criando a nosa base de dados onde irá receber todas as nossas notícias cadastradas.

Com o MySql aberto digite a seguinte linha:

create database news;

Agora abra a base de dados criada:

use news;

O próximo passo é criar a tabela que vai ser cadastrada nossas notícias, vou colocar um exemplo, mas que pode ser adaptado conforme as suas necessidades.

CREATE TABLE noticias (
id int(5) NOT NULL auto_increment,
nome char(30) NOT NULL,
sobrenome char(30) NOT NULL,
cidade char(50) NOT NULL,
estado char(2) NOT NULL,
email char(80),
data date NOT NULL,
hora time NOT NULL,
titulo char(100) NOT NULL,
subtitulo char(200),
texto text NOT NULL,
ver char(3) DEFAULT ‘off’,
PRIMARY KEY (id),
UNIQUE id (id)
);

* os valores em vermelho poderão ser alterados

O próximo passo é criar um script que vai analisar o arquivo cadastra.php que veremos mais adiante. Iremos utilizar o Dreamweaver (DW) para trabalhar com os comandos de PHP. Com o DW aberto clique CTRL+N e escolha na aba Geral em Categoria: Pagina Dinâmica e em Página Dinâmica: PHP conforme imagem abaixo:

Com a página aberta clique na aba PHP localizada na tag Inserir:

Agora vá no modo de visualização do código e clique no botão Bloco de Código e começaremos a digitar o nosso código PHP, desta forma teremos mais facilidade em escrever os códigos, muito importante para quem estar aprendendo a linguagem:

Arquivo inserir.php:

//felipemacena – babu
//mxstudio.com.br

//lembra-se que falei anteriormente que a data seria automática?
//ele vai ser definida pelo próprio php

$sql=”INSERT INTO news (nome, sobrenome, cidade, estado, email, data, hora,
titulo, subtitulo, texto) VALUES (‘$nome’, ‘$sobrenome’, ‘$cidade’,
‘$estado’, ‘$email’, ‘$data’, ‘$hora’, ‘$titulo’, ‘$subtitulo’,
‘$noticia’)”;

//conectando a base de dados MySql

$conexao= mysql_connect(“localhost”, “root”, “”)
//onde string hostname:port:/path/to/socket = o caminho, endereço do host,
ex: localhost
//string username = nome do usuário da base de dados
//string password = a senha do ususário da base de dados

or die (“Erro ao conectar com o DB”);
//onde string message = mensagem retorno de configuração errada na base de
dados

$db= mysql_select_db(“test”)
or die (“Erro ao selecionar o DB”);
//onde string database_name nome da base de dados
//onde string message = mensagem retorno de base de dados inexistente

$sql=mysql_query($sql)
or die (“Erro na query”);
//onde string message = mensagem retorno de erro de gravaçao de dados

echo”Parabéns o cadastro foi efetuado com sucesso.”;
?>
Chegamos a parte final deste tutorial, semana que vem tem mais, qualquer dúvida no fórum.

Montando uma enquete simples PHP MySql

Felipemacena — Fri, 24 Sep 2004 00:00:00 +0000

Salve Comunidade

Montando uma Enquete
simples.

Veremos neste tutorial como
montar um sisteminha simples de votação com apenas uma opção,
podendo ser incrementado e adicionado em nossa seção de códigos
lá no
Fórum.
Crie um novo documento no Dreamweaver podendo ser do tipo HTML.

Monte um formulário com alguns campos
de votação conforme especificado abaixo:

HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN”>

MXStudio

Qual o seu site preferido?

Crie uma tabela no MySql chamada votacao
com os seguintes parâmetros:

CREATE TABLE votacao (id INT(2) NOT NULL auto_increment primary key, descricao
CHAR(50), votos CHAR(4));

Após a tabela ser criada vamos agora inserir
as opções da nossa enquete:

INSERT INTO votacao (descricao,votos) VALUES (“MXStudio”,”0″);
INSERT INTO votacao (descricao,votos) VALUES (“Site2″,”0″);
INSERT INTO votacao (descricao,votos) VALUES (“Site3″,”0″);
INSERT INTO votacao (descricao,votos) VALUES (“Site4″,”0″);

Você pode estar se perguntandopor outros valores
no INSERT como o ID.
Iso foi feito porque quando criamos a tabela denominamos a função
de AUTO_INCREMENT, desta forma a própria
tabela vai icrementar os valores.

Agora teremos que criar um página no formato
PHP para o nosso action que foi denominada de votacao.php
.

Crie um novo documento no Dreamweaver no formato PHP.

Vamos agora inserir o nosso código:

// Esta linha abaixo tem a função de verificar se a enquete
foi votada e prossegue em frente no caso de verdade
if ($escolha != “”) {

// Abaixo segue os parâmetros para conexão
com o DB
$mysql_host = “”; // local do servidor MySQL
$mysql_user = “”: // usuário do MySQL
$mysql_pass = “”; // senha do usuário do MySQL
$mysql_dtbs = “”; // base de dados onde a tabela foi criada

$num_resp = “”; // número de
opções na tua votação
$pergunta = “”; // pergunta da votação

// A partir daqui você nõ mexe mais
em nada, mas tem tudo passo-a-passo para que serve cada linha

$mysql_conx = mysql_connect($mysql_host,$mysql_user,$mysql_pass);
// conexão com o MySQL

$radio = $num_resp + 1;
// para uso posterior

mysql_select_db($mysql_dtbs);
// seleciona a base de dados

//Atualização da base de dados

$query_upd = “SELECT * FROM votacao WHERE
id=$escolha”;
$resul_upd = mysql_query($query_upd);
// aqui o PHP selecciona apenas os registos que coincidem com a escolha,
no nosso caso apenas uma opção

$obj_upd = mysql_fetch_object($resul_upd);
// o comando mysql_fetch_object() separa os resultados de uma query por
colunas
// neste caso, $obj_upd -> descrição da opção
que o usuário votou

$vot_upd = $obj_upd->votos;
$vot_upd++;
// separa só os votos e adicinona mais um voto

$upd_upd = “UPDATE votacao SET votos=$vot_upd
WHERE id=$escolha”;
mysql_query($upd_upd);
// atualizou a base de dados

// Agora o PHP fará a pesquisa na base
de dados e retornará as opções, seus votos respectivos,
o total de votos //até o momento e a escolha do usuário

echo “

” . $pergunta . “

”;

for($i=1;$i<$radio;$i++) {

$query[$i] = “SELECT * FROM votacao WHERE
id=$i”;
$resul[$i] = mysql_query($query[$i]);
$objet[$i] = mysql_fetch_object($resul[$i]);

echo “ SIZE=\”1\”>” . $objet[$i]->opcao . “
” . $objet[$i]->descricao . “ ” . $objet[$i]->votos
. “
”;

$tot_vt += $objet[$i]->votos;

// tudo isto serve para requisitar o resultado
de cada opção e exibir na tela

}
echo “Total de votos:”
. $tot_vt . “ Sua Escolha:”
. $escolha . “”;
}
?>

Com isso terminamos o nosso sistema simples de votação
com apenas uma opção, caso tenha interesse em incrementá-lo
poste lá no nosso fórum
de php.

Páginas restritas com PHP e MySql

Felipemacena — Thu, 10 Jun 2004 00:00:00 +0000

Salve comunidade mxstudio.

Bastante utilizado pelos usuários e webmasters, as páginas restritas se tornaram uma febre, neste tutorial vou explicar como se faz um formulário simples de usuário e senha utilizando o PHP e MySql.
Primeiramente para que você teste a funcionalidade deste artifício, deve ter instalado e configurado o PHP, o Apache e o MySql ou outro de livre escolha.

Vamos criar uma tabela chamada usuarios, é ela que vai verificar os campos do nosso formulário.

CREATE TABLE users (
username varchar(20) NOT NULL default ”,
password varchar(20) NOT NULL default ”,
PRIMARY KEY (ID)
) TYPE=MyISAM;

Após a criação da tabela você deve povoá-la com pelo menos uma entrada. Dentro o Dreamweaver construa um formulário simplessalvadno como login.php.

Após criar o formulário deveremos fazer a conexão com nosso banco de dados, siga os passoa abaixo para realizá-la.

1º – Clique em Window > Databases (CTRL_SHIFT+F10), desta forma teremos a janela de Banco de Dados aberta do lado direito da janela do Dreamweaver, clique no sinal de + e escolha MySql Conection.

2º – Na janela que abriu deveremos preencher os campos com os detalhes da base de dados. No primeiro campo você deve colocar um nome para a sua conexão, no segundo coloque o usuário MySql que no nosso caso colocaremos localhost. Preencha os campos de username e senha de modo que não esqueça e finalmente para a Database coloque um nome para a sua base de dados, ou precione Selec… para escolher de uma lista ja existente se houver.

3º – Após estas etapas precione a tecla Test, se ocorreu tudo certo você receberá o seu prêmio.

4º – Agora você poderá visualizar os detalhes da sua conexão, na janela das bases de dados. Clique na seta + e observe todas as suas conexões.

Se ocorreu tudo certo você deverá visualizar os detalhes da tabela na aba Databases da janela Applocation.

No arquivo criado login.php escolha Application > Log In User.

Ao clicar na propriedade acima você será levado a uma nova janela de configuração contendo em sua primeira parte:
1- Detalhes do seu formulário;
2- Base de Dados;
3- Redirecionamento;

Você poderá restringir o acesso selecionando selecionando somente Username e Password, pois no nosso formulário temos apenas estes campos.

Para ter certeza que tudo ocorreu bem vá em Application Server Behaviors você deverá visualizar a seguinte tela:

Espero ter contribuído para a ampliação do conhecimento.

As dúvidas sobre Dreamweaver deverão ser tiradas em nosso fórum, clicando aqui.

Gravando Comandos

Felipemacena — Sat, 22 May 2004 00:00:00 +0000

“http://www.w3.org/TR/html4/loose.dtd”>

.Banner {

border-top-width: 0px;

border-right-width: 0px;

border-bottom-width: 1px;

border-left-width: 0px;

border-top-style: solid;

border-right-style: solid;

border-bottom-style: solid;

border-left-style: solid;

border-top-color: #CCCCCC;

border-right-color: #CCCCCC;

border-bottom-color: #CCCCCC;

border-left-color: #CCCCCC;

font-family: verdana;

font-size: 1px;

}

.BannerCenter {

text-align: center;

}

.FundoLateralDireita {

background-color: #e0e0e0;

border-top-width: 0px;

border-right-width: 1px;

border-bottom-width: 0px;

border-left-width: 1px;

border-top-style: solid;

border-right-style: solid;

border-bottom-style: solid;

border-left-style: solid;

border-top-color: #CCCCCC;

border-right-color: #CCCCCC;

border-bottom-color: #CCCCCC;

border-left-color: #CCCCCC;

}

.Botao {

font-family: Verdana;

font-size: 10px;

background-color: #D0D0D0;

color: #666666;

border: 1px solid #666666;

}

.InputText {

font-family: Verdana;

font-size: 10px;

color: #000000;

border: 1px inset #adbdcc;

background-color: #f7f8fa;

}

.BuscaInterna {

font-family: Arial, Helvetica, sans-serif;

font-size: 12px;

font-weight: bold;

color: #566E9C;

text-align: center;

}

.FundoLateralEsquerdo {

background-color: #e0e0e0;

border-top-width: 0px;

border-right-width: 1px;

border-bottom-width: 0px;

border-left-width: 1px;

border-top-style: solid;

border-right-style: solid;

border-bottom-style: solid;

border-left-style: solid;

border-top-color: #CCCCCC;

border-right-color: #CCCCCC;

border-bottom-color: #CCCCCC;

border-left-color: #CCCCCC;

}

.NewsLetter {

font-family: Verdana;

font-size: 11px;

font-weight: normal;

color: #666666;

padding-left: 5px;

}

.TxtNeg {

font-family: Verdana;

font-size: 11px;

font-weight: bold;

color: #666666;

}

.TxtNegCenter {

font-family: Verdana;

font-size: 10px;

font-weight: bold;

color: #666666;

text-align: center;

}

.LinhaFooter {

border-top-width: 0px;

border-right-width: 0px;

border-bottom-width: 1px;

border-left-width: 0px;

border-top-style: solid;

border-right-style: solid;

border-bottom-style: solid;

border-left-style: solid;

border-top-color: #CCCCCC;

border-right-color: #CCCCCC;

border-bottom-color: #CCCCCC;

border-left-color: #CCCCCC;

font-family: verdana;

font-size: 1px;

background-color: #CCCCCC;

}

.Atualizacao {

font-family: Verdana;

font-size: 10px;

font-weight: bold;

color: #FF9900;

}

.BordaDireita {

border-top-width: 5px;

border-right-width: 1px;

border-bottom-width: 5px;

border-left-width: 1px;

border-top-style: solid;

border-right-style: solid;

border-bottom-style: solid;

border-left-style: solid;

border-top-color: #FFFFFF;

border-right-color: #C0C0C0;

border-bottom-color: #FFFFFF;

border-left-color: #FFFFFF;

}

.AlinhamentoEsquerdo {

text-align: left;

border-top-width: 5px;

border-right-width: 1px;

border-bottom-width: 5px;

border-left-width: 0px;

border-top-style: solid;

border-right-style: solid;

border-bottom-style: solid;

border-left-style: solid;

border-top-color: #FFFFFF;

border-right-color: #FFFFFF;

border-bottom-color: #FFFFFF;

border-left-color: #FFFFFF;

}

.RodapeTabelas {

border-top-width: 0px;

border-right-width: 0px;

border-bottom-width: 0px;

border-left-width: 0px;

border-top-style: solid;

border-right-style: solid;

border-bottom-style: solid;

border-left-style: solid;

border-top-color: #CCCCCC;

border-right-color: #CCCCCC;

border-bottom-color: #CCCCCC;

border-left-color: #CCCCCC;

}

.TituloArtigo {

font-family: Arial, Helvetica, sans-serif;

font-size: 12px;

font-weight: bold;

color: #354460;

}

.TXT {

font-family: Verdana;

font-size: 11px;

font-weight: normal;

color: #666666;

}

.RodapeTabelas1 {

border-top-width: 0px;

border-right-width: 0px;

border-bottom-width: 0px;

border-left-width: 0px;

border-top-style: solid;

border-right-style: solid;

border-bottom-style: solid;

border-left-style: solid;

border-top-color: #CCCCCC;

border-right-color: #CCCCCC;

border-bottom-color: #CCCCCC;

border-left-color: #CCCCCC;

}

.TituloArtigo1 {

font-family: Verdana;

font-size: 11px;

font-weight: bold;

color: #003399;

padding-left: 5px;

}

.LinhaArtigos {

border-top-width: 1px;

border-right-width: 0px;

border-bottom-width: 0px;

border-left-width: 0px;

border-top-style: solid;

border-right-style: solid;

border-bottom-style: solid;

border-left-style: solid;

border-top-color: #FF9900;

border-right-color: #FF9900;

border-bottom-color: #FF9900;

border-left-color: #FF9900;

}

.Titulos {

font-family: Arial, Helvetica, sans-serif;

font-size: 14px;

text-transform: uppercase;

color: #566E9C;

border-bottom-width: 1px;

border-bottom-style: solid;

border-bottom-color: #566E9C;

border-left-style: solid;

border-left-color: #566E9C;

font-weight: bold;

vertical-align: middle;

padding-left: 5px;

border-left-width: 3px;

height: 20px;

}

.TitulosSub {

font-family: Verdana, Arial, Helvetica, sans-serif;

font-size: 10px;

text-transform: uppercase;

color: #666666;

border-bottom-width: 1px;

border-bottom-style: solid;

border-bottom-color: #566E9C;

border-left-style: solid;

border-left-color: #566E9C;

font-weight: bold;

vertical-align: middle;

padding-left: 5px;

border-left-width: 7px;

height: 20px;

border-right-width: 5px;

border-right-style: solid;

border-right-color: #FFFFFF;

}

.numerodacoluna { font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 11px; color:#3366CC}

.titulodamateria { font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 13px; color:#000000; font-weight:bolder}

.texto { font-family: Verdana, Arial, sans-serif; font-size: 10px; color: #666666}

.textodiferente { font-family:Verdana, Arial, Helvetica, sans-serif; font-size:10px; color:#6699CC}

.TabelaListaConteudo {

background-color: #F7f8fa;

border: 1px solid #adbdcc;

}

.TxtNegAlgDir {

font-family: Verdana;

font-size: 11px;

font-weight: bold;

color: #666666;

text-align: right;

}

.estilofonte {

font-family: Verdana, Arial, Helvetica, sans-serif;

color: #849CB3;

font-size: 11px;

}

TABLE {

FONT-WEIGHT: normal; FONT-SIZE: 11px; COLOR: #666666; LINE-HEIGHT: 14px; FONT-STYLE: normal; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif

}

.title {

FONT-SIZE: 24px; COLOR: #5b7a99; LINE-HEIGHT: 28px

}

.subtitle {

FONT-SIZE: 18px; COLOR: #666666; LINE-HEIGHT: 21px

}

.titleHighlight {

FONT-WEIGHT: bold; COLOR: #5b7a99

}

.subtitleHighlight {

COLOR: #5b7a99

}

LABEL {

FONT-SIZE: 11px; COLOR: #333333; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif

}

.labelTitle {

FONT-WEIGHT: bold

}

BODY {

BACKGROUND-POSITION: left top;

SCROLLBAR-FACE-COLOR: #adbdcc;

SCROLLBAR-SHADOW-COLOR: #6c88a3;

SCROLLBAR-3DLIGHT-COLOR: #6c88a3;

SCROLLBAR-ARROW-COLOR: #5b7a99;

SCROLLBAR-TRACK-COLOR: #d7dee6;

BACKGROUND-REPEAT: repeat-y;

SCROLLBAR-DARKSHADOW-COLOR: #c1d1e0;

SCROLLBAR-BASE-COLOR: #adbdcc;

BACKGROUND-COLOR: #ffffff

}

.inputRadioButton {

BORDER-RIGHT: 0px; BORDER-TOP: 0px; BORDER-LEFT: 0px; BORDER-BOTTOM: 0px; TEXT-ALIGN: center

}

.cheqbox {

BORDER-RIGHT: 0px solid; BORDER-TOP: 0px solid; BORDER-LEFT: 0px solid; BORDER-BOTTOM: 0px solid

}

.linkTop {

COLOR: #5b7a99; TEXT-DECORATION: none

}

.linkTop:hover {

COLOR: #304b6b; TEXT-DECORATION: none

}

.linkHighlight:hover {

COLOR: #b92088; TEXT-DECORATION: none

}

.linkMenu {

COLOR: #5b7a99; TEXT-DECORATION: none

}

.linkMenu:hover {

COLOR: #849CB3; TEXT-DECORATION: none

}

.linkText {

COLOR: #5b7a99; TEXT-DECORATION: none

}

.linkText:hover {

COLOR: #b92088; TEXT-DECORATION: none

}

.linkTrack {

COLOR: #666666; TEXT-DECORATION: none

}

.linkTrack:hover {

COLOR: #b92088; TEXT-DECORATION: none

}

a:link {

font-family: Verdana;

font-size: 11px;

color: #5b7a99;

text-decoration: none;

}

a:visited {

font-family: Verdana;

font-size: 11px;

color: #5b7a99;

text-decoration: none;

}

a:hover {

font-family: Verdana;

font-size: 11px;

color: #5b7a99;

text-decoration: none;

}

a:active {

font-family: Verdana;

font-size: 11px;

color: #5b7a99;

text-decoration: none;

}

.rodape {

font-family: Verdana, Arial, Helvetica, sans-serif;

font-size: 9px;

color: #666666;

text-decoration: none;

}

.style4 {font-size: 11px; font-weight: normal; font-family: Verdana;}

.style6 {font-family: Verdana, Arial, sans-serif; font-size: 10px; color: #FF0000; }

–>

// –>

Salve comunidade mxstudio.

Quem nunca repetiu comandos na hora do desenvolvimento de sites no Dreamweaver? Vou abordar nesta coluna um comando muito utilizado por mim na hora de confeccionar sites.

O Dreamweaver permite que você grave temporariamnte qualquer quantidade de estapas como um comando. As etapas que você realiza são gravadas quando são realizadas assim, não é necessário selecionar múltiplas etapas no painel History (SHIFT+F10).

Alguns eventos, tais como clicar para selecionar alguma coisa ou arrastar um elemento de um lugar para outro, não podem ser gravados e serão pulados

no comando.

1. Escolha Commands > Start Recording (CTRL+SHIFT+X); depois, realize as etapas que deseja gravar. O cursor muda para um ícone de fita cassete de áudio, quando gravado;

2. Quando você tiver acabado de gravar, escolha Commands > Stop Recording.

3. Escolha Commands > Play Recorded Command para repetir a última gravação. Uma etapa chamada Run Command aparece no painel History.

4. Para salvar o comando gravado no menu Commands, selecione a etapa Play Command no painel History e clique o botão Save As Command, no canto inferior direito do painel History.

5. Entre com o nome para o comando e clique Ok. O comando agora aparece no menu Commands.

Batizei o comando como mxstudio, para vê-lo vá em Commands, você verá que o seu comando apareceu no final da aba.

O Dreamweaver não grava as mudanças feitas quando você troca para um outro documento enquanto gravando. O cursor muda para um ícone de fita cassete quando gravando. Se o cursor não exibir o ícone de gravação, as mudanças não estão sendo gravadas.clicando aqui.

Como configurar a posição e visibilidade de camadas

Felipemacena — Sun, 02 May 2004 00:00:00 +0000

“http://www.w3.org/TR/html4/loose.dtd”>

.Banner {

border-top-width: 0px;

border-right-width: 0px;

border-bottom-width: 1px;

border-left-width: 0px;

border-top-style: solid;

border-right-style: solid;

border-bottom-style: solid;

border-left-style: solid;

border-top-color: #CCCCCC;

border-right-color: #CCCCCC;

border-bottom-color: #CCCCCC;

border-left-color: #CCCCCC;

font-family: verdana;

font-size: 1px;

}

.BannerCenter {

text-align: center;

}

.FundoLateralDireita {

background-color: #e0e0e0;

border-top-width: 0px;

border-right-width: 1px;

border-bottom-width: 0px;

border-left-width: 1px;

border-top-style: solid;

border-right-style: solid;

border-bottom-style: solid;

border-left-style: solid;

border-top-color: #CCCCCC;

border-right-color: #CCCCCC;

border-bottom-color: #CCCCCC;

border-left-color: #CCCCCC;

}

.Botao {

font-family: Verdana;

font-size: 10px;

background-color: #D0D0D0;

color: #666666;

border: 1px solid #666666;

}

.InputText {

font-family: Verdana;

font-size: 10px;

color: #000000;

border: 1px inset #adbdcc;

background-color: #f7f8fa;

}

.BuscaInterna {

font-family: Arial, Helvetica, sans-serif;

font-size: 12px;

font-weight: bold;

color: #566E9C;

text-align: center;

}

.FundoLateralEsquerdo {

background-color: #e0e0e0;

border-top-width: 0px;

border-right-width: 1px;

border-bottom-width: 0px;

border-left-width: 1px;

border-top-style: solid;

border-right-style: solid;

border-bottom-style: solid;

border-left-style: solid;

border-top-color: #CCCCCC;

border-right-color: #CCCCCC;

border-bottom-color: #CCCCCC;

border-left-color: #CCCCCC;

}

.NewsLetter {

font-family: Verdana;

font-size: 11px;

font-weight: normal;

color: #666666;

padding-left: 5px;

}

.TxtNeg {

font-family: Verdana;

font-size: 11px;

font-weight: bold;

color: #666666;

}

.TxtNegCenter {

font-family: Verdana;

font-size: 10px;

font-weight: bold;

color: #666666;

text-align: center;

}

.LinhaFooter {

border-top-width: 0px;

border-right-width: 0px;

border-bottom-width: 1px;

border-left-width: 0px;

border-top-style: solid;

border-right-style: solid;

border-bottom-style: solid;

border-left-style: solid;

border-top-color: #CCCCCC;

border-right-color: #CCCCCC;

border-bottom-color: #CCCCCC;

border-left-color: #CCCCCC;

font-family: verdana;

font-size: 1px;

background-color: #CCCCCC;

}

.Atualizacao {

font-family: Verdana;

font-size: 10px;

font-weight: bold;

color: #FF9900;

}

.BordaDireita {

border-top-width: 5px;

border-right-width: 1px;

border-bottom-width: 5px;

border-left-width: 1px;

border-top-style: solid;

border-right-style: solid;

border-bottom-style: solid;

border-left-style: solid;

border-top-color: #FFFFFF;

border-right-color: #C0C0C0;

border-bottom-color: #FFFFFF;

border-left-color: #FFFFFF;

}

.AlinhamentoEsquerdo {

text-align: left;

border-top-width: 5px;

border-right-width: 1px;

border-bottom-width: 5px;

border-left-width: 0px;

border-top-style: solid;

border-right-style: solid;

border-bottom-style: solid;

border-left-style: solid;

border-top-color: #FFFFFF;

border-right-color: #FFFFFF;

border-bottom-color: #FFFFFF;

border-left-color: #FFFFFF;

}

.RodapeTabelas {

border-top-width: 0px;

border-right-width: 0px;

border-bottom-width: 0px;

border-left-width: 0px;

border-top-style: solid;

border-right-style: solid;

border-bottom-style: solid;

border-left-style: solid;

border-top-color: #CCCCCC;

border-right-color: #CCCCCC;

border-bottom-color: #CCCCCC;

border-left-color: #CCCCCC;

}

.TituloArtigo {

font-family: Arial, Helvetica, sans-serif;

font-size: 12px;

font-weight: bold;

color: #354460;

}

.TXT {

font-family: Verdana;

font-size: 11px;

font-weight: normal;

color: #666666;

}

.RodapeTabelas1 {

border-top-width: 0px;

border-right-width: 0px;

border-bottom-width: 0px;

border-left-width: 0px;

border-top-style: solid;

border-right-style: solid;

border-bottom-style: solid;

border-left-style: solid;

border-top-color: #CCCCCC;

border-right-color: #CCCCCC;

border-bottom-color: #CCCCCC;

border-left-color: #CCCCCC;

}

.TituloArtigo1 {

font-family: Verdana;

font-size: 11px;

font-weight: bold;

color: #003399;

padding-left: 5px;

}

.LinhaArtigos {

border-top-width: 1px;

border-right-width: 0px;

border-bottom-width: 0px;

border-left-width: 0px;

border-top-style: solid;

border-right-style: solid;

border-bottom-style: solid;

border-left-style: solid;

border-top-color: #FF9900;

border-right-color: #FF9900;

border-bottom-color: #FF9900;

border-left-color: #FF9900;

}

.Titulos {

font-family: Arial, Helvetica, sans-serif;

font-size: 14px;

text-transform: uppercase;

color: #566E9C;

border-bottom-width: 1px;

border-bottom-style: solid;

border-bottom-color: #566E9C;

border-left-style: solid;

border-left-color: #566E9C;

font-weight: bold;

vertical-align: middle;

padding-left: 5px;

border-left-width: 3px;

height: 20px;

}

.TitulosSub {

font-family: Verdana, Arial, Helvetica, sans-serif;

font-size: 10px;

text-transform: uppercase;

color: #666666;

border-bottom-width: 1px;

border-bottom-style: solid;

border-bottom-color: #566E9C;

border-left-style: solid;

border-left-color: #566E9C;

font-weight: bold;

vertical-align: middle;

padding-left: 5px;

border-left-width: 7px;

height: 20px;

border-right-width: 5px;

border-right-style: solid;

border-right-color: #FFFFFF;

}

.numerodacoluna { font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 11px; color:#3366CC}

.titulodamateria { font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 13px; color:#000000; font-weight:bolder}

.texto { font-family: Verdana, Arial, sans-serif; font-size: 10px; color: #666666}

.textodiferente { font-family:Verdana, Arial, Helvetica, sans-serif; font-size:10px; color:#6699CC}

.TabelaListaConteudo {

background-color: #F7f8fa;

border: 1px solid #adbdcc;

}

.TxtNegAlgDir {

font-family: Verdana;

font-size: 11px;

font-weight: bold;

color: #666666;

text-align: right;

}

.estilofonte {

font-family: Verdana, Arial, Helvetica, sans-serif;

color: #849CB3;

font-size: 11px;

}

TABLE {

FONT-WEIGHT: normal; FONT-SIZE: 11px; COLOR: #666666; LINE-HEIGHT: 14px; FONT-STYLE: normal; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif

}

.title {

FONT-SIZE: 24px; COLOR: #5b7a99; LINE-HEIGHT: 28px

}

.subtitle {

FONT-SIZE: 18px; COLOR: #666666; LINE-HEIGHT: 21px

}

.titleHighlight {

FONT-WEIGHT: bold; COLOR: #5b7a99

}

.subtitleHighlight {

COLOR: #5b7a99

}

LABEL {

FONT-SIZE: 11px; COLOR: #333333; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif

}

.labelTitle {

FONT-WEIGHT: bold

}

BODY {

BACKGROUND-POSITION: left top;

SCROLLBAR-FACE-COLOR: #adbdcc;

SCROLLBAR-SHADOW-COLOR: #6c88a3;

SCROLLBAR-3DLIGHT-COLOR: #6c88a3;

SCROLLBAR-ARROW-COLOR: #5b7a99;

SCROLLBAR-TRACK-COLOR: #d7dee6;

BACKGROUND-REPEAT: repeat-y;

SCROLLBAR-DARKSHADOW-COLOR: #c1d1e0;

SCROLLBAR-BASE-COLOR: #adbdcc;

BACKGROUND-COLOR: #ffffff

}

.inputRadioButton {

BORDER-RIGHT: 0px; BORDER-TOP: 0px; BORDER-LEFT: 0px; BORDER-BOTTOM: 0px; TEXT-ALIGN: center

}

.cheqbox {

BORDER-RIGHT: 0px solid; BORDER-TOP: 0px solid; BORDER-LEFT: 0px solid; BORDER-BOTTOM: 0px solid

}

.linkTop {

COLOR: #5b7a99; TEXT-DECORATION: none

}

.linkTop:hover {

COLOR: #304b6b; TEXT-DECORATION: none

}

.linkHighlight:hover {

COLOR: #b92088; TEXT-DECORATION: none

}

.linkMenu {

COLOR: #5b7a99; TEXT-DECORATION: none

}

.linkMenu:hover {

COLOR: #849CB3; TEXT-DECORATION: none

}

.linkText {

COLOR: #5b7a99; TEXT-DECORATION: none

}

.linkText:hover {

COLOR: #b92088; TEXT-DECORATION: none

}

.linkTrack {

COLOR: #666666; TEXT-DECORATION: none

}

.linkTrack:hover {

COLOR: #b92088; TEXT-DECORATION: none

}

a:link {

font-family: Verdana;

font-size: 11px;

color: #5b7a99;

text-decoration: none;

}

a:visited {

font-family: Verdana;

font-size: 11px;

color: #5b7a99;

text-decoration: none;

}

a:hover {

font-family: Verdana;

font-size: 11px;

color: #5b7a99;

text-decoration: none;

}

a:active {

font-family: Verdana;

font-size: 11px;

color: #5b7a99;

text-decoration: none;

}

.rodape {

font-family: Verdana, Arial, Helvetica, sans-serif;

font-size: 9px;

color: #666666;

text-decoration: none;

}

.style4 {font-size: 11px; font-weight: normal; font-family: Verdana;}

–>

// –>

Salve Comunidade,

Muitos usuários tem dificuldades em utilizar camadas, esta semana iremos abordar um pouco este assunto, falaremos de como configurar a posição e visibilidade de camadas.

As propriedades de camada são ajustadas a partir do inspetor Property e, até certo ponto, o painel Layers (F2) . Muitas das propriedades de camada também podem ser manipuladas usando Javascript ou VBScript, se você estiver no jogo. Exiba o inspetor Property e o painel Layer para editar a sua camada.

Layer 1, Layer 2 e assim por diante, entrando com um novo nome na caixa Layer ID do inspetor Property. Fique com nomes que cemeçam com uma letra e nãp contém quaisquer caracteres estranhos. Números podem ser usados, exceto como primeiro caractere no nome;

L e T no inspetor Property, para indicar a posição da camada a partir da esquerda e do alto da camada pai, quando aninhada, ou da janela Document quando a camada não está aninhada. Entre com os valores W e H, para a largura e altura da camada, respectivamente.

Z-Index do inspetor Property. O índice-z de uma camada determina o seu lugar acima ou abaixo de outras camadas. Camadas como números mais altos são colocadas acima de camadas com números mais baixos. Você também pode clicar o valor de índice-z, no painel Layers, para mudar o valor, ou simplemente, arrastar as camadas para cima e para baixo no painel Layers, para reorganizá-las.

4- Ajuste a visibilidade da camada, selecionando uma opção do menu pull-down Vis, no inspetor Property. Selecione Invisible para ocultar, inicialmente a camada ou para ocultar temporariamente a camada, enquanto você está trabalhando na página em Dreamweaver. Escolha Visible para exibir sempre a camada. Escolha Inherit para herdar a visibilidade da camada pai.

Uma dica:

É possível especificar as medidas para L, T, W e H em pixels, centímetros, milímetros, polegadas, pontos, porcentagem ou paicas. A unidade de medida padrão é pixels. Entre com os valores sem espaços entre o número e a designação de unidade de medida. Use px para pixels, cm para centímetros, mm para milímetros, in para polegadas, pt para pontos % para porcentagem e pc para paicas.

As dúvidas sobre Dreamweaver deverão ser tiradas em nosso fórum, clicando aqui.

Fazendo um site em Fireworks e exportando para Dreamweaver parte 4

Felipemacena — Wed, 21 Apr 2004 00:00:00 +0000

Salve Comunidade,

Terminando a série de matérias sobre Fazendo um site no Fireworks e exportando para o Dreamweaevr veremos aqui como fatiá-lo e como montamos ele no Dreamweaevr.

Utilizando a ferramenta Slice Tool (K)

vamos fatiando o nosso site de maneira que fique de uma forma hierárquica e de fácil montagem no Dreamweaver.

Começaremos definindo o Topo;

Note que ja definimos um nome para o nosso Slice, mas de que forma isso acontece? Boa pergunta, note que do lado direito da área do Fireworks você tem todas as camadas da sua imagem, e a medida que você fatia o site vai aparecendo mais camadas na parte superior da aba Layer denominadas Web Layer, de um duplo clique em cima do nome e digite o nome que a sua imagem fatiada vai asumir, isso é muito importante.

Faça o mesmo procedimento para o Rodapé e a imagem dos edifícios no centro do layout.

Na parte central do site teremos que pensar em algo mais complicado, pois temos um sistema de notícias, que provavalmente vai ficar sendo atualizado, desta forma teremos que deixar m espaço vazio para que sejam colocadas as notícias. Intão faremos da seguinte forma:

Vejam que temos as mesmas imagens nos topos das notícias e abaixo delas.

Dreamweaver colocamos a mesma em tres cédulas diferentes. Faremos uma atia na parte posterior das notícias e uma no local onde irá ficar em branco ao exportar para o Dreamweaver.

Fatiamos a linha na vertical:

Dreamweaver para começar a brincadeira de montar o nosso layout. Crie uma tabela com 3 linhas e 3 colunas:

Export Selected Slice… salvando-a com o mesmo nome que você atribui no Fireworks.

CTRL+ALT+M).

Posicione o cursor dentra da primeira linha da tabela e vá em Insert > Image (CTRL+ALT+I) e navegue até a pasta onde estivera miagem e de um duploclique nela. Adicione uma linha abaixo da primeira da seguinte forma:

Posicione o mouse dentro desta linha e insira a imagem dos prédios. Insira mais uma linha abaixo da imagem dos prédios e aplique uma cor de fundo (#F5EAC2). O próximo passo é mesclar as duas colunas da terceira linha, e criar três colunas para inserirmos as tabelas de notícias.

#F6EAC2). O nosso layout está montado, agora vamos adicionar links ao nosso menu, usando a opção Image Map, localizado na aba Properties abaixo e a esquerda da tela do Dreamweaver.

Fazendo um site no Fireworks e exportando para o Dreamweaver.

Dúvidas.

Configurações de Padrões de Camadas

Felipemacena — Tue, 20 Apr 2004 00:00:00 +0000

“http://www.w3.org/TR/html4/loose.dtd”>

.Banner {

border-top-width: 0px;

border-right-width: 0px;

border-bottom-width: 1px;

border-left-width: 0px;

border-top-style: solid;

border-right-style: solid;

border-bottom-style: solid;

border-left-style: solid;

border-top-color: #CCCCCC;

border-right-color: #CCCCCC;

border-bottom-color: #CCCCCC;

border-left-color: #CCCCCC;

font-family: verdana;

font-size: 1px;

}

.BannerCenter {

text-align: center;

}

.FundoLateralDireita {

background-color: #e0e0e0;

border-top-width: 0px;

border-right-width: 1px;

border-bottom-width: 0px;

border-left-width: 1px;

border-top-style: solid;

border-right-style: solid;

border-bottom-style: solid;

border-left-style: solid;

border-top-color: #CCCCCC;

border-right-color: #CCCCCC;

border-bottom-color: #CCCCCC;

border-left-color: #CCCCCC;

}

.Botao {

font-family: Verdana;

font-size: 10px;

background-color: #D0D0D0;

color: #666666;

border: 1px solid #666666;

}

.InputText {

font-family: Verdana;

font-size: 10px;

color: #000000;

border: 1px inset #adbdcc;

background-color: #f7f8fa;

}

.BuscaInterna {

font-family: Arial, Helvetica, sans-serif;

font-size: 12px;

font-weight: bold;

color: #566E9C;

text-align: center;

}

.FundoLateralEsquerdo {

background-color: #e0e0e0;

border-top-width: 0px;

border-right-width: 1px;

border-bottom-width: 0px;

border-left-width: 1px;

border-top-style: solid;

border-right-style: solid;

border-bottom-style: solid;

border-left-style: solid;

border-top-color: #CCCCCC;

border-right-color: #CCCCCC;

border-bottom-color: #CCCCCC;

border-left-color: #CCCCCC;

}

.NewsLetter {

font-family: Verdana;

font-size: 11px;

font-weight: normal;

color: #666666;

padding-left: 5px;

}

.TxtNeg {

font-family: Verdana;

font-size: 11px;

font-weight: bold;

color: #666666;

}

.TxtNegCenter {

font-family: Verdana;

font-size: 10px;

font-weight: bold;

color: #666666;

text-align: center;

}

.LinhaFooter {

border-top-width: 0px;

border-right-width: 0px;

border-bottom-width: 1px;

border-left-width: 0px;

border-top-style: solid;

border-right-style: solid;

border-bottom-style: solid;

border-left-style: solid;

border-top-color: #CCCCCC;

border-right-color: #CCCCCC;

border-bottom-color: #CCCCCC;

border-left-color: #CCCCCC;

font-family: verdana;

font-size: 1px;

background-color: #CCCCCC;

}

.Atualizacao {

font-family: Verdana;

font-size: 10px;

font-weight: bold;

color: #FF9900;

}

.BordaDireita {

border-top-width: 5px;

border-right-width: 1px;

border-bottom-width: 5px;

border-left-width: 1px;

border-top-style: solid;

border-right-style: solid;

border-bottom-style: solid;

border-left-style: solid;

border-top-color: #FFFFFF;

border-right-color: #C0C0C0;

border-bottom-color: #FFFFFF;

border-left-color: #FFFFFF;

}

.AlinhamentoEsquerdo {

text-align: left;

border-top-width: 5px;

border-right-width: 1px;

border-bottom-width: 5px;

border-left-width: 0px;

border-top-style: solid;

border-right-style: solid;

border-bottom-style: solid;

border-left-style: solid;

border-top-color: #FFFFFF;

border-right-color: #FFFFFF;

border-bottom-color: #FFFFFF;

border-left-color: #FFFFFF;

}

.RodapeTabelas {

border-top-width: 0px;

border-right-width: 0px;

border-bottom-width: 0px;

border-left-width: 0px;

border-top-style: solid;

border-right-style: solid;

border-bottom-style: solid;

border-left-style: solid;

border-top-color: #CCCCCC;

border-right-color: #CCCCCC;

border-bottom-color: #CCCCCC;

border-left-color: #CCCCCC;

}

.TituloArtigo {

font-family: Arial, Helvetica, sans-serif;

font-size: 12px;

font-weight: bold;

color: #354460;

}

.TXT {

font-family: Verdana;

font-size: 11px;

font-weight: normal;

color: #666666;

}

.RodapeTabelas1 {

border-top-width: 0px;

border-right-width: 0px;

border-bottom-width: 0px;

border-left-width: 0px;

border-top-style: solid;

border-right-style: solid;

border-bottom-style: solid;

border-left-style: solid;

border-top-color: #CCCCCC;

border-right-color: #CCCCCC;

border-bottom-color: #CCCCCC;

border-left-color: #CCCCCC;

}

.TituloArtigo1 {

font-family: Verdana;

font-size: 11px;

font-weight: bold;

color: #003399;

padding-left: 5px;

}

.LinhaArtigos {

border-top-width: 1px;

border-right-width: 0px;

border-bottom-width: 0px;

border-left-width: 0px;

border-top-style: solid;

border-right-style: solid;

border-bottom-style: solid;

border-left-style: solid;

border-top-color: #FF9900;

border-right-color: #FF9900;

border-bottom-color: #FF9900;

border-left-color: #FF9900;

}

.Titulos {

font-family: Arial, Helvetica, sans-serif;

font-size: 14px;

text-transform: uppercase;

color: #566E9C;

border-bottom-width: 1px;

border-bottom-style: solid;

border-bottom-color: #566E9C;

border-left-style: solid;

border-left-color: #566E9C;

font-weight: bold;

vertical-align: middle;

padding-left: 5px;

border-left-width: 3px;

height: 20px;

}

.TitulosSub {

font-family: Verdana, Arial, Helvetica, sans-serif;

font-size: 10px;

text-transform: uppercase;

color: #666666;

border-bottom-width: 1px;

border-bottom-style: solid;

border-bottom-color: #566E9C;

border-left-style: solid;

border-left-color: #566E9C;

font-weight: bold;

vertical-align: middle;

padding-left: 5px;

border-left-width: 7px;

height: 20px;

border-right-width: 5px;

border-right-style: solid;

border-right-color: #FFFFFF;

}

.numerodacoluna { font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 11px; color:#3366CC}

.titulodamateria { font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 13px; color:#000000; font-weight:bolder}

.texto { font-family: Verdana, Arial, sans-serif; font-size: 10px; color: #666666}

.textodiferente { font-family:Verdana, Arial, Helvetica, sans-serif; font-size:10px; color:#6699CC}

.TabelaListaConteudo {

background-color: #F7f8fa;

border: 1px solid #adbdcc;

}

.TxtNegAlgDir {

font-family: Verdana;

font-size: 11px;

font-weight: bold;

color: #666666;

text-align: right;

}

.estilofonte {

font-family: Verdana, Arial, Helvetica, sans-serif;

color: #849CB3;

font-size: 11px;

}

TABLE {

FONT-WEIGHT: normal; FONT-SIZE: 11px; COLOR: #666666; LINE-HEIGHT: 14px; FONT-STYLE: normal; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif

}

.title {

FONT-SIZE: 24px; COLOR: #5b7a99; LINE-HEIGHT: 28px

}

.subtitle {

FONT-SIZE: 18px; COLOR: #666666; LINE-HEIGHT: 21px

}

.titleHighlight {

FONT-WEIGHT: bold; COLOR: #5b7a99

}

.subtitleHighlight {

COLOR: #5b7a99

}

LABEL {

FONT-SIZE: 11px; COLOR: #333333; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif

}

.labelTitle {

FONT-WEIGHT: bold

}

BODY {

BACKGROUND-POSITION: left top;

SCROLLBAR-FACE-COLOR: #adbdcc;

SCROLLBAR-SHADOW-COLOR: #6c88a3;

SCROLLBAR-3DLIGHT-COLOR: #6c88a3;

SCROLLBAR-ARROW-COLOR: #5b7a99;

SCROLLBAR-TRACK-COLOR: #d7dee6;

BACKGROUND-REPEAT: repeat-y;

SCROLLBAR-DARKSHADOW-COLOR: #c1d1e0;

SCROLLBAR-BASE-COLOR: #adbdcc;

BACKGROUND-COLOR: #ffffff

}

.inputRadioButton {

BORDER-RIGHT: 0px; BORDER-TOP: 0px; BORDER-LEFT: 0px; BORDER-BOTTOM: 0px; TEXT-ALIGN: center

}

.cheqbox {

BORDER-RIGHT: 0px solid; BORDER-TOP: 0px solid; BORDER-LEFT: 0px solid; BORDER-BOTTOM: 0px solid

}

.linkTop {

COLOR: #5b7a99; TEXT-DECORATION: none

}

.linkTop:hover {

COLOR: #304b6b; TEXT-DECORATION: none

}

.linkHighlight:hover {

COLOR: #b92088; TEXT-DECORATION: none

}

.linkMenu {

COLOR: #5b7a99; TEXT-DECORATION: none

}

.linkMenu:hover {

COLOR: #849CB3; TEXT-DECORATION: none

}

.linkText {

COLOR: #5b7a99; TEXT-DECORATION: none

}

.linkText:hover {

COLOR: #b92088; TEXT-DECORATION: none

}

.linkTrack {

COLOR: #666666; TEXT-DECORATION: none

}

.linkTrack:hover {

COLOR: #b92088; TEXT-DECORATION: none

}

a:link {

font-family: Verdana;

font-size: 11px;

color: #5b7a99;

text-decoration: none;

}

a:visited {

font-family: Verdana;

font-size: 11px;

color: #5b7a99;

text-decoration: none;

}

a:hover {

font-family: Verdana;

font-size: 11px;

color: #5b7a99;

text-decoration: none;

}

a:active {

font-family: Verdana;

font-size: 11px;

color: #5b7a99;

text-decoration: none;

}

.rodape {

font-family: Verdana, Arial, Helvetica, sans-serif;

font-size: 9px;

color: #666666;

text-decoration: none;

}

.style4 {font-size: 11px; font-weight: normal; font-family: Verdana;}

–>

// –>

Salve Comunidade,

Bem vai ser sempre um assunto para muita polêmica, as famosas LAYERS, esta semana veremos como Configurar Padrões de Camadas.

Os padrões Layer determinam o tamanho da camada quando você usa o comando Insert > Layer para acrescentar uma camada ao documento. ë possível especificar alguns atributos padrões a camadas na caixa de diálogo Preferences, a qual também é onde você especifica as guias HTML padrão para usar em camadas.

No código fonte HTML, as camadas são designadas usando as guias de abertura e fechamento

…

ou … . O método usado depende do browser e da plataforma nos quais você está desenvolvendo suas páginas WEB.

A guia

oferece o suporte mais amplo entre os browsers em todas as plataformas.

1. Selecione Edit > Preferences (CTRL+U) e depois, selecione Layers da lista Category.

Opções de visibilidade.

Inherit – herda a visibilidade da camada pai, a qual permite que você oculte múltiplas camadas, mudando a visibilidade da camada pai.

Visible – exibe a camada e todo o seu conteúdo.

Hidden – toma a camada e seu conteúdo invisível.

Uma dica: se você tiver a opção Nest When Clicked Within a Later marcada, tome cuidado para não arrastar uma camada diretamente dentro de outra, no painel Layers, pois fazer isto cria uma camada aninhada.

4. Especifique uma largura e altura para a camada padrão. Estes valores são usados quando você seleciona Insert > Layer para acrescentar camadas. O valor padrão é de 200 pixel de largura por 115 pixels de altura.

Dúvidas.

Exportação e Importação de conteúdo XML

Felipemacena — Thu, 15 Apr 2004 00:00:00 +0000

“http://www.w3.org/TR/html4/loose.dtd”>

.Banner {

border-top-width: 0px;

border-right-width: 0px;

border-bottom-width: 1px;

border-left-width: 0px;

border-top-style: solid;

border-right-style: solid;

border-bottom-style: solid;

border-left-style: solid;

border-top-color: #CCCCCC;

border-right-color: #CCCCCC;

border-bottom-color: #CCCCCC;

border-left-color: #CCCCCC;

font-family: verdana;

font-size: 1px;

}

.BannerCenter {

text-align: center;

}

.FundoLateralDireita {

background-color: #e0e0e0;

border-top-width: 0px;

border-right-width: 1px;

border-bottom-width: 0px;

border-left-width: 1px;

border-top-style: solid;

border-right-style: solid;

border-bottom-style: solid;

border-left-style: solid;

border-top-color: #CCCCCC;

border-right-color: #CCCCCC;

border-bottom-color: #CCCCCC;

border-left-color: #CCCCCC;

}

.Botao {

font-family: Verdana;

font-size: 10px;

background-color: #D0D0D0;

color: #666666;

border: 1px solid #666666;

}

.InputText {

font-family: Verdana;

font-size: 10px;

color: #000000;

border: 1px inset #adbdcc;

background-color: #f7f8fa;

}

.BuscaInterna {

font-family: Arial, Helvetica, sans-serif;

font-size: 12px;

font-weight: bold;

color: #566E9C;

text-align: center;

}

.FundoLateralEsquerdo {

background-color: #e0e0e0;

border-top-width: 0px;

border-right-width: 1px;

border-bottom-width: 0px;

border-left-width: 1px;

border-top-style: solid;

border-right-style: solid;

border-bottom-style: solid;

border-left-style: solid;

border-top-color: #CCCCCC;

border-right-color: #CCCCCC;

border-bottom-color: #CCCCCC;

border-left-color: #CCCCCC;

}

.NewsLetter {

font-family: Verdana;

font-size: 11px;

font-weight: normal;

color: #666666;

padding-left: 5px;

}

.TxtNeg {

font-family: Verdana;

font-size: 11px;

font-weight: bold;

color: #666666;

}

.TxtNegCenter {

font-family: Verdana;

font-size: 10px;

font-weight: bold;

color: #666666;

text-align: center;

}

.LinhaFooter {

border-top-width: 0px;

border-right-width: 0px;

border-bottom-width: 1px;

border-left-width: 0px;

border-top-style: solid;

border-right-style: solid;

border-bottom-style: solid;

border-left-style: solid;

border-top-color: #CCCCCC;

border-right-color: #CCCCCC;

border-bottom-color: #CCCCCC;

border-left-color: #CCCCCC;

font-family: verdana;

font-size: 1px;

background-color: #CCCCCC;

}

.Atualizacao {

font-family: Verdana;

font-size: 10px;

font-weight: bold;

color: #FF9900;

}

.BordaDireita {

border-top-width: 5px;

border-right-width: 1px;

border-bottom-width: 5px;

border-left-width: 1px;

border-top-style: solid;

border-right-style: solid;

border-bottom-style: solid;

border-left-style: solid;

border-top-color: #FFFFFF;

border-right-color: #C0C0C0;

border-bottom-color: #FFFFFF;

border-left-color: #FFFFFF;

}

.AlinhamentoEsquerdo {

text-align: left;

border-top-width: 5px;

border-right-width: 1px;

border-bottom-width: 5px;

border-left-width: 0px;

border-top-style: solid;

border-right-style: solid;

border-bottom-style: solid;

border-left-style: solid;

border-top-color: #FFFFFF;

border-right-color: #FFFFFF;

border-bottom-color: #FFFFFF;

border-left-color: #FFFFFF;

}

.RodapeTabelas {

border-top-width: 0px;

border-right-width: 0px;

border-bottom-width: 0px;

border-left-width: 0px;

border-top-style: solid;

border-right-style: solid;

border-bottom-style: solid;

border-left-style: solid;

border-top-color: #CCCCCC;

border-right-color: #CCCCCC;

border-bottom-color: #CCCCCC;

border-left-color: #CCCCCC;

}

.TituloArtigo {

font-family: Arial, Helvetica, sans-serif;

font-size: 12px;

font-weight: bold;

color: #354460;

}

.TXT {

font-family: Verdana;

font-size: 11px;

font-weight: normal;

color: #666666;

}

.RodapeTabelas1 {

border-top-width: 0px;

border-right-width: 0px;

border-bottom-width: 0px;

border-left-width: 0px;

border-top-style: solid;

border-right-style: solid;

border-bottom-style: solid;

border-left-style: solid;

border-top-color: #CCCCCC;

border-right-color: #CCCCCC;

border-bottom-color: #CCCCCC;

border-left-color: #CCCCCC;

}

.TituloArtigo1 {

font-family: Verdana;

font-size: 11px;

font-weight: bold;

color: #003399;

padding-left: 5px;

}

.LinhaArtigos {

border-top-width: 1px;

border-right-width: 0px;

border-bottom-width: 0px;

border-left-width: 0px;

border-top-style: solid;

border-right-style: solid;

border-bottom-style: solid;

border-left-style: solid;

border-top-color: #FF9900;

border-right-color: #FF9900;

border-bottom-color: #FF9900;

border-left-color: #FF9900;

}

.Titulos {

font-family: Arial, Helvetica, sans-serif;

font-size: 14px;

text-transform: uppercase;

color: #566E9C;

border-bottom-width: 1px;

border-bottom-style: solid;

border-bottom-color: #566E9C;

border-left-style: solid;

border-left-color: #566E9C;

font-weight: bold;

vertical-align: middle;

padding-left: 5px;

border-left-width: 3px;

height: 20px;

}

.TitulosSub {

font-family: Verdana, Arial, Helvetica, sans-serif;

font-size: 10px;

text-transform: uppercase;

color: #666666;

border-bottom-width: 1px;

border-bottom-style: solid;

border-bottom-color: #566E9C;

border-left-style: solid;

border-left-color: #566E9C;

font-weight: bold;

vertical-align: middle;

padding-left: 5px;

border-left-width: 7px;

height: 20px;

border-right-width: 5px;

border-right-style: solid;

border-right-color: #FFFFFF;

}

.numerodacoluna { font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 11px; color:#3366CC}

.titulodamateria { font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 13px; color:#000000; font-weight:bolder}

.texto { font-family: Verdana, Arial, sans-serif; font-size: 10px; color: #666666}

.textodiferente { font-family:Verdana, Arial, Helvetica, sans-serif; font-size:10px; color:#6699CC}

.TabelaListaConteudo {

background-color: #F7f8fa;

border: 1px solid #adbdcc;

}

.TxtNegAlgDir {

font-family: Verdana;

font-size: 11px;

font-weight: bold;

color: #666666;

text-align: right;

}

.estilofonte {

font-family: Verdana, Arial, Helvetica, sans-serif;

color: #849CB3;

font-size: 11px;

}

TABLE {

FONT-WEIGHT: normal; FONT-SIZE: 11px; COLOR: #666666; LINE-HEIGHT: 14px; FONT-STYLE: normal; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif

}

.title {

FONT-SIZE: 24px; COLOR: #5b7a99; LINE-HEIGHT: 28px

}

.subtitle {

FONT-SIZE: 18px; COLOR: #666666; LINE-HEIGHT: 21px

}

.titleHighlight {

FONT-WEIGHT: bold; COLOR: #5b7a99

}

.subtitleHighlight {

COLOR: #5b7a99

}

LABEL {

FONT-SIZE: 11px; COLOR: #333333; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif

}

.labelTitle {

FONT-WEIGHT: bold

}

BODY {

BACKGROUND-POSITION: left top;

SCROLLBAR-FACE-COLOR: #adbdcc;

SCROLLBAR-SHADOW-COLOR: #6c88a3;

SCROLLBAR-3DLIGHT-COLOR: #6c88a3;

SCROLLBAR-ARROW-COLOR: #5b7a99;

SCROLLBAR-TRACK-COLOR: #d7dee6;

BACKGROUND-REPEAT: repeat-y;

SCROLLBAR-DARKSHADOW-COLOR: #c1d1e0;

SCROLLBAR-BASE-COLOR: #adbdcc;

BACKGROUND-COLOR: #ffffff

}

.inputRadioButton {

BORDER-RIGHT: 0px; BORDER-TOP: 0px; BORDER-LEFT: 0px; BORDER-BOTTOM: 0px; TEXT-ALIGN: center

}

.cheqbox {

BORDER-RIGHT: 0px solid; BORDER-TOP: 0px solid; BORDER-LEFT: 0px solid; BORDER-BOTTOM: 0px solid

}

.linkTop {

COLOR: #5b7a99; TEXT-DECORATION: none

}

.linkTop:hover {

COLOR: #304b6b; TEXT-DECORATION: none

}

.linkHighlight:hover {

COLOR: #b92088; TEXT-DECORATION: none

}

.linkMenu {

COLOR: #5b7a99; TEXT-DECORATION: none

}

.linkMenu:hover {

COLOR: #849CB3; TEXT-DECORATION: none

}

.linkText {

COLOR: #5b7a99; TEXT-DECORATION: none

}

.linkText:hover {

COLOR: #b92088; TEXT-DECORATION: none

}

.linkTrack {

COLOR: #666666; TEXT-DECORATION: none

}

.linkTrack:hover {

COLOR: #b92088; TEXT-DECORATION: none

}

a:link {

font-family: Verdana;

font-size: 11px;

color: #5b7a99;

text-decoration: none;

}

a:visited {

font-family: Verdana;

font-size: 11px;

color: #5b7a99;

text-decoration: none;

}

a:hover {

font-family: Verdana;

font-size: 11px;

color: #5b7a99;

text-decoration: none;

}

a:active {

font-family: Verdana;

font-size: 11px;

color: #5b7a99;

text-decoration: none;

}

.rodape {

font-family: Verdana, Arial, Helvetica, sans-serif;

font-size: 9px;

color: #666666;

text-decoration: none;

}

.style4 {font-size: 11px; font-weight: normal; font-family: Verdana;}

–>

// –>

Salve Comunidade,

XML é a abreviação de EXtensible Markup Language (Linguagem extensível de formatação). Trata-se de uma linguagem que é considerada uma grande evolução na internet. Porém, para quem não é programador ou não trabalhe com o uso de linguagens e ferramentas para a Web, é quase imperceptível as vantagens do XML. Este artigo se dispõe a tornar isso mais claro.

O XML é uma especificação técnica desenvolvida pela W3C (World Wide Web Consortium – entidade responsável pela definição da área gráfica da internet), para superar as limitações do HTML, que é o padrão das páginas da Web.

A linguagem XML é definida como o formato universal para dados estruturados na Web. Esses dados consistem em tabelas, desenhos, parâmetros de configuração, etc. A linguagem então, trata de definir regras que permitem escrever esses documentos de forma que sejam adequadamente visíveis ao computador.

Vamos dar uma pincelada em como exportar um conteúdo XML. VOcê pode usar os recursos de exporta Extensible Markup Language (XML) para exportar as regiões editáveis de um gabarito como um documento XML. Ao usar esta função, é possível exportar o seu conteúdo para um formato que pode ser modificado fora do Dreamweaver, usando um editor de texto.

1 – Abra um documento que use um gabarito com regiões editáveis.

2- Selecione File > Export > Export Editable Regions as XML.

Quando a caixa de diálogo Export Editable as XML aparecer, selecione uma guia de notação e click OK.

E como segundo tópico vamos saber como se importa um conteúdo XML. Conteúdo XML pode ser importado para um documento que estja usndo um gabarito.

1- Selecione File > Import XML into Tamplete.

Dúvidas.

Criação de um novo arquivo a partir de um gabarito

Felipemacena — Wed, 25 Feb 2004 00:00:00 +0000

“http://www.w3.org/TR/html4/loose.dtd”>

.Banner {

border-top-width: 0px;

border-right-width: 0px;

border-bottom-width: 1px;

border-left-width: 0px;

border-top-style: solid;

border-right-style: solid;

border-bottom-style: solid;

border-left-style: solid;

border-top-color: #CCCCCC;

border-right-color: #CCCCCC;

border-bottom-color: #CCCCCC;

border-left-color: #CCCCCC;

font-family: verdana;

font-size: 1px;

}

.BannerCenter {

text-align: center;

}

.FundoLateralDireita {

background-color: #e0e0e0;

border-top-width: 0px;

border-right-width: 1px;

border-bottom-width: 0px;

border-left-width: 1px;

border-top-style: solid;

border-right-style: solid;

border-bottom-style: solid;

border-left-style: solid;

border-top-color: #CCCCCC;

border-right-color: #CCCCCC;

border-bottom-color: #CCCCCC;

border-left-color: #CCCCCC;

}

.Botao {

font-family: Verdana;

font-size: 10px;

background-color: #D0D0D0;

color: #666666;

border: 1px solid #666666;

}

.InputText {

font-family: Verdana;

font-size: 10px;

color: #000000;

border: 1px inset #adbdcc;

background-color: #f7f8fa;

}

.BuscaInterna {

font-family: Arial, Helvetica, sans-serif;

font-size: 12px;

font-weight: bold;

color: #566E9C;

text-align: center;

}

.FundoLateralEsquerdo {

background-color: #e0e0e0;

border-top-width: 0px;

border-right-width: 1px;

border-bottom-width: 0px;

border-left-width: 1px;

border-top-style: solid;

border-right-style: solid;

border-bottom-style: solid;

border-left-style: solid;

border-top-color: #CCCCCC;

border-right-color: #CCCCCC;

border-bottom-color: #CCCCCC;

border-left-color: #CCCCCC;

}

.NewsLetter {

font-family: Verdana;

font-size: 11px;

font-weight: normal;

color: #666666;

padding-left: 5px;

}

.TxtNeg {

font-family: Verdana;

font-size: 11px;

font-weight: bold;

color: #666666;

}

.TxtNegCenter {

font-family: Verdana;

font-size: 10px;

font-weight: bold;

color: #666666;

text-align: center;

}

.LinhaFooter {

border-top-width: 0px;

border-right-width: 0px;

border-bottom-width: 1px;

border-left-width: 0px;

border-top-style: solid;

border-right-style: solid;

border-bottom-style: solid;

border-left-style: solid;

border-top-color: #CCCCCC;

border-right-color: #CCCCCC;

border-bottom-color: #CCCCCC;

border-left-color: #CCCCCC;

font-family: verdana;

font-size: 1px;

background-color: #CCCCCC;

}

.Atualizacao {

font-family: Verdana;

font-size: 10px;

font-weight: bold;

color: #FF9900;

}

.BordaDireita {

border-top-width: 5px;

border-right-width: 1px;

border-bottom-width: 5px;

border-left-width: 1px;

border-top-style: solid;

border-right-style: solid;

border-bottom-style: solid;

border-left-style: solid;

border-top-color: #FFFFFF;

border-right-color: #C0C0C0;

border-bottom-color: #FFFFFF;

border-left-color: #FFFFFF;

}

.AlinhamentoEsquerdo {

text-align: left;

border-top-width: 5px;

border-right-width: 1px;

border-bottom-width: 5px;

border-left-width: 0px;

border-top-style: solid;

border-right-style: solid;

border-bottom-style: solid;

border-left-style: solid;

border-top-color: #FFFFFF;

border-right-color: #FFFFFF;

border-bottom-color: #FFFFFF;

border-left-color: #FFFFFF;

}

.RodapeTabelas {

border-top-width: 0px;

border-right-width: 0px;

border-bottom-width: 0px;

border-left-width: 0px;

border-top-style: solid;

border-right-style: solid;

border-bottom-style: solid;

border-left-style: solid;

border-top-color: #CCCCCC;

border-right-color: #CCCCCC;

border-bottom-color: #CCCCCC;

border-left-color: #CCCCCC;

}

.TituloArtigo {

font-family: Arial, Helvetica, sans-serif;

font-size: 12px;

font-weight: bold;

color: #354460;

}

.TXT {

font-family: Verdana;

font-size: 11px;

font-weight: normal;

color: #666666;

}

.RodapeTabelas1 {

border-top-width: 0px;

border-right-width: 0px;

border-bottom-width: 0px;

border-left-width: 0px;

border-top-style: solid;

border-right-style: solid;

border-bottom-style: solid;

border-left-style: solid;

border-top-color: #CCCCCC;

border-right-color: #CCCCCC;

border-bottom-color: #CCCCCC;

border-left-color: #CCCCCC;

}

.TituloArtigo1 {

font-family: Verdana;

font-size: 11px;

font-weight: bold;

color: #003399;

padding-left: 5px;

}

.LinhaArtigos {

border-top-width: 1px;

border-right-width: 0px;

border-bottom-width: 0px;

border-left-width: 0px;

border-top-style: solid;

border-right-style: solid;

border-bottom-style: solid;

border-left-style: solid;

border-top-color: #FF9900;

border-right-color: #FF9900;

border-bottom-color: #FF9900;

border-left-color: #FF9900;

}

.Titulos {

font-family: Arial, Helvetica, sans-serif;

font-size: 14px;

text-transform: uppercase;

color: #566E9C;

border-bottom-width: 1px;

border-bottom-style: solid;

border-bottom-color: #566E9C;

border-left-style: solid;

border-left-color: #566E9C;

font-weight: bold;

vertical-align: middle;

padding-left: 5px;

border-left-width: 3px;

height: 20px;

}

.TitulosSub {

font-family: Verdana, Arial, Helvetica, sans-serif;

font-size: 10px;

text-transform: uppercase;

color: #666666;

border-bottom-width: 1px;

border-bottom-style: solid;

border-bottom-color: #566E9C;

border-left-style: solid;

border-left-color: #566E9C;

font-weight: bold;

vertical-align: middle;

padding-left: 5px;

border-left-width: 7px;

height: 20px;

border-right-width: 5px;

border-right-style: solid;

border-right-color: #FFFFFF;

}

.numerodacoluna { font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 11px; color:#3366CC}

.titulodamateria { font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 13px; color:#000000; font-weight:bolder}

.texto { font-family: Verdana, Arial, sans-serif; font-size: 10px; color: #666666}

.textodiferente { font-family:Verdana, Arial, Helvetica, sans-serif; font-size:10px; color:#6699CC}

.TabelaListaConteudo {

background-color: #F7f8fa;

border: 1px solid #adbdcc;

}

.TxtNegAlgDir {

font-family: Verdana;

font-size: 11px;

font-weight: bold;

color: #666666;

text-align: right;

}

.estilofonte {

font-family: Verdana, Arial, Helvetica, sans-serif;

color: #849CB3;

font-size: 11px;

}

TABLE {

FONT-WEIGHT: normal; FONT-SIZE: 11px; COLOR: #666666; LINE-HEIGHT: 14px; FONT-STYLE: normal; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif

}

.title {

FONT-SIZE: 24px; COLOR: #5b7a99; LINE-HEIGHT: 28px

}

.subtitle {

FONT-SIZE: 18px; COLOR: #666666; LINE-HEIGHT: 21px

}

.titleHighlight {

FONT-WEIGHT: bold; COLOR: #5b7a99

}

.subtitleHighlight {

COLOR: #5b7a99

}

LABEL {

FONT-SIZE: 11px; COLOR: #333333; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif

}

.labelTitle {

FONT-WEIGHT: bold

}

BODY {

BACKGROUND-POSITION: left top;

SCROLLBAR-FACE-COLOR: #adbdcc;

SCROLLBAR-SHADOW-COLOR: #6c88a3;

SCROLLBAR-3DLIGHT-COLOR: #6c88a3;

SCROLLBAR-ARROW-COLOR: #5b7a99;

SCROLLBAR-TRACK-COLOR: #d7dee6;

BACKGROUND-REPEAT: repeat-y;

SCROLLBAR-DARKSHADOW-COLOR: #c1d1e0;

SCROLLBAR-BASE-COLOR: #adbdcc;

BACKGROUND-COLOR: #ffffff

}

.inputRadioButton {

BORDER-RIGHT: 0px; BORDER-TOP: 0px; BORDER-LEFT: 0px; BORDER-BOTTOM: 0px; TEXT-ALIGN: center

}

.cheqbox {

BORDER-RIGHT: 0px solid; BORDER-TOP: 0px solid; BORDER-LEFT: 0px solid; BORDER-BOTTOM: 0px solid

}

.linkTop {

COLOR: #5b7a99; TEXT-DECORATION: none

}

.linkTop:hover {

COLOR: #304b6b; TEXT-DECORATION: none

}

.linkHighlight:hover {

COLOR: #b92088; TEXT-DECORATION: none

}

.linkMenu {

COLOR: #5b7a99; TEXT-DECORATION: none

}

.linkMenu:hover {

COLOR: #849CB3; TEXT-DECORATION: none

}

.linkText {

COLOR: #5b7a99; TEXT-DECORATION: none

}

.linkText:hover {

COLOR: #b92088; TEXT-DECORATION: none

}

.linkTrack {

COLOR: #666666; TEXT-DECORATION: none

}

.linkTrack:hover {

COLOR: #b92088; TEXT-DECORATION: none

}

a:link {

font-family: Verdana;

font-size: 11px;

color: #5b7a99;

text-decoration: none;

}

a:visited {

font-family: Verdana;

font-size: 11px;

color: #5b7a99;

text-decoration: none;

}

a:hover {

font-family: Verdana;

font-size: 11px;

color: #5b7a99;

text-decoration: none;

}

a:active {

font-family: Verdana;

font-size: 11px;

color: #5b7a99;

text-decoration: none;

}

.rodape {

font-family: Verdana, Arial, Helvetica, sans-serif;

font-size: 9px;

color: #666666;

text-decoration: none;

}

.style3 {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; color: #6699CC; font-weight: bold; }

–>

Salve Comunidade!

Terminando nossa série de matérias sobre Gabaritos (Templates) falaremos aqui sobre Criação de um novo arquivo a partir de um gabarito.

Após o gabarito ter sido criado, você cria simplesmente um novo documento a partir daquele gabarito. Se editar o gabarito em algum ponto depois que ele tiver sido aplicado a página Web, ao salvar o gabarito modificado, você é solicitado a atualizar todos os arquivos que usam aquele gabarito. Por outro lado, você pode destacar o gabarito do arquivo, para evitar mudanças a ele afetarem um documento em particuar.

1- Selecione File > New from Templates e selecione o gabarito da caixa de diálogo que aparece na tela;

2- Selecione Modify > Templates para selecionar as regiões editáveis pelos seus nomes, que aparecem no fundo do menu. A região editável selecionada é destacada na janela Document;

3- Selecione Modify > Templates > Update Current Page para atualizar páginas manualmente, uma de cada vez.

OBS: estilos, linhas de tempo e comportamentos personalizados são totalmente suportados em regiões de gabaritos, embora qualquer docuemnto que use um gabarito não possa ter a sua própria folha de estilo, linhas de tempo ou comportamentos. É preciso usar folha de estilo, linhas de tempo e comportamentos definidos para o gabarito.

Dúvidas.

Uuário:
Senha: