Web<code>Free

Novo Blog

2013-09-21T03:15:00.000-03:00

O WebCodeFree mudou para Wordpress.

Novo endereço:

http://www.webcodefree.com.br/

CADASTRO PHP - PARTE 02

2013-04-03T11:08:00.001-03:00

CADASTRANDO UM REGISTRO NO BANCO DE DADOS

CADASTRANDO UM REGISTRO NO BANCO DE DADOS COM PHP - PARTE 02

Dando prosseguimento a ultima postagem de PHP, estaremos realizando a inserção de dados na base de dados Mysql atraves de um formulário web.

O primeiro passo é criar um formulário HTML.

<html>

<head>

<title>Exemplo de Cadastro com PHP e Mysql</title>

</head>

<body>

<h3> Cadastro de Veículos </h3>

Modelo: <br>

Cor: <br>

<option value"amarelo"> Amarelo </option>

<option value"branco"> Branco </option>

<option value"prata"> Prata </option>

<option value"preto"> Preto </option>

<option value"verde"> Verde </option>

<option value"vermelho"> Vermelho </option>

</select> <br>

Fabricante: <br>

<option value"Citroen"> Citroen</option>

<option value"Chevrolet"> Chevrolet</option>

<option value"Pegeout"> Pegeout</option>

<option value"Renault"> Renault</option>

<option value"Volkswagen"> Volkswagen</option>

</select> <br>

Ano: <br>

Valor: <br>

</form>

</body>

</html>

Com o código acima criamos um simples formulario html, que transmitirá os seus dados através de um método de envio POST, quando os dados são enviados através do corpo de uma mensagem http, para um script do php chamado salvarveiculo.php os dados serão enviados atraves dos campos: txtmodelo, cbocor, txtano, cbofabricante e txtvalor, após a criação do formulário criaremos um script semelhante a primeira postagem realizando somente algumas alterações para capturar as informações passadas pelos campos do formulário html.

<?php

// INCLUINDO O ARQUIVO DE CONEXÃO CRIADA NA POSTAGEM PARTE 1
include 'conexao.config';

// DADOS A SEREM SALVOS NA TABELA tb_veiculo
$modelo = $_POST["txtmodelo"];
$cor = $_POST["cbocor"];
$ano = $_POST["txtano"];
$valor = $_POST["txtvalor"];
$fabricante = $_POST["cbofabricante "];

/* O $_POST[''] é uma entidade global do php que tem como função recuperar dados passados por um formulário atraves de um métodos POST, sendo necessário passar para ele o nome do campo INPUT que você deseja recuprar o valor. Observação, a entidade global $_POST só funciona se for descrita em maiúsculo, caso contrário o php interpreta o mesmo como uma simples variável.*/

// VARIAVEL COM A STRING DO COMANDO SQL
$query = "insert into tb_veiculo(modelo, cor, ano, fabricante, valor) values ('$modelo', '$cor', $ano, '$fabricante', $valor)";

// EXECUTANDO A STRING COM O COMANDO INSERT
mysql_query($query) or die(mysql_error());

// VERIFICANDO SE O REGISTRO FOI SALVO
if(mysql_affected_rows()==1){
echo "Veículo $modelo Salvo com Sucesso !!!";
}else{
echo "Erro ao Salvar o Veículo";
}

// ENCERRANDO A CONEXÃO COM A BASE DE DADOS.
mysql_close();

?>

Após criar o script php o mesmo deve ter o mesmo nome definido no atributo action do formulário html action="salvarveiculo.php" , por fim ao executar a inserção dos dados através do formulário os mesmos serão inserdidos na base de dados Mysql.

BACKUP DE BASE DE DADOS NO PhpMyAdmin

2013-01-14T01:36:00.002-02:00

Realizar BackUp de Base de Dados no phpMyAdmin

1º Primeiramente iremos acessar o painel de controle do nosso host e ir a área de administração de banco de dados o chamado “phpMyAdmin”, veja figura:

2º No lado direito dessa tela nós temos todos os bancos criados, no meu, por exemplo, existe 4 banco s criados, veja figura:

3º Agora nós vamos clicar no banco em que queremos fazer o backup, logo após clicado aparecerá uma tela como esta, veja figura, nela esta mostrando todas as tabelas criadas para este banco, eu selecionei o banco chamado blog, nele existe 10 tabelas criadas, veja figura:

4º Agora vamos selecionar todas as tabelas deste banco, no link chamado “marcar todos”, veja figura:

5º Após marcarmos todas as tabelas, acima vamos clicar em “exportar”, veja figura:

6º Após clicarmos em exportar nos vamos ter uma tela de configuração para exportação, nela irá conter todos os formatos que podemos exportar, locais para aonde podemos exportar, ou seja, podemos exportar direto para o Server, e também podemos exportar compactado como .zip, e .gzip, veja figura:

7º Nesse exemplo vamos exportar como SQL, pois para importar novamente para outro host ou outro banco de dados fica bem mais fácil, logo após selecionado a opção de formato, e compactação vamos clicar no botão executar, fazendo isso ele irá aparecer a tela do zip aonde vai pedir para salvar este arquivo em algum diretório em seu computador, clique em salvar.

Pronto você acaba de fazer o backup do seu banco de dados.

Fonte: oficinadanet.com.br

INSERÇÃO DE IMAGENS

2013-01-14T01:16:00.000-02:00

Imagens

A utilização de imagens em páginas HTML dá uma nova dimensão a página na distribuição de informação através de documentos HTML, tornando assim a informação mais atraente aos olhos do leitor, chamando muitas vezes mais a atenção do que os próprios textos descritos na página.

Uma página web deve trabalhar com as seguintes extensões de imagens: .png, .gif, .jpg, devido a aceitação destes nos navegadores utilizados nos dias hoje.

O arquivos de imagens podem estar presentes no mesmo diretório dos seus arquivos .html, porém recomenda se que os mesmo estejam em um diretório separado, devido a organização de seu site.

Para inserirmos uma imagem em uma página HTML utilizamos a tag <IMG> junto ao atributo SRC, que tem como função especificar o caminho do diretório da imagem a ser inserida.

Sintaxe:

Atributos do Comando <IMG>

· scr: Define o caminho do diretório onde se encontra a imagem a ser inserida.

· align: Alinhamento da imagem em relação ao texto.

· width: Largura da imagem.

· height: Altura da imagem.

· alt: Insere uma legenda na imagem.

Exemplo Prático:

LISTAS EM HTML

2013-01-14T01:11:00.003-02:00

Listas

As listas são formas de estruturar documentos em forma de sumário, menu ou resumo de conteúdo. São muito boas na hora da criação menus ou tópicos de uma página HTML. Existem dois tipos de listas: as ordenadas e as não ordenadas. As listas ordenadas obedecem a uma ordem numérica, e as não ordenadas não obedecem a nenhuma ordem.

LISTAS ORDENADAS

Para definirmos uma lista ordenada, utilizamos a tag <OL> </OL>que determina o marcador ordenado para a nossa lista. Para definir os itens da lista por sua vez utilizamos o marcador <LI></LI>.

Sintaxe:

<ol>

</ol>

Podemos escolher o tipo de marcador de nossa lista, podendo ser numérico (1,2,3), romano, (I, II, III) ou caracter (a, b, c). Para isso utilizamos o atributo type na tag <OL></OL>.

Sintaxe:

</ol>

</ol>

</ol>

Exemplo Prático:

LISTAS NÃO ORDENADAS

Para definirmos uma lista não ordenada, precisamos utilizar a tag <UL></UL>. Para definir os itens da lista por sua vez utilizamos o marcador <LI></LI>.

Sintaxe:

<ul>

</ul>

Podemos escolher o tipo de marcador de nossa lista, podendo ser um quadrado ou um círculo.

Sintaxe:

</ul>

</ul>

</ul>

Exemplo Prático:

Lista de Definição

Uma lista de definição é utilizada quando existem diversos tópicos curtos acompanhados de alguma descrição para o mesmo. Uma lista de definição é composta de três tags básica: <dl>, <dt>, <dd>, onde a tag <dl> delimita a área da lista, <dt> define um tópico e <dd> define a descrição do tópico.

Sintaxe:

<dl>

<dt> Tópico 1

<dd> Definição do Tópico 1</dd>

</dt>

<dt> Tópico 2

<dd> Definição do Tópico 2</dd>

</dt>

</dl>

Exemplo Prático:

BLOCOS DE TEXTO EM HTML

2013-01-14T01:03:00.000-02:00

Blocos de Textos

Na linguagem HTML, utilizamos os blocos de textos para destacar algum texto da página dos demais, podendo assim atribuir uma formatação ou estilo personalizado a cada bloco.

O Comando <PRE>

O comando <PRE> </PRE> preserva os espaços, quebra de linhas e tabulações adicionadas ao documento HTML, sendo muito utilizado na hora de representar listagens e planilhas.

Sintaxe:

<pre> Texto Pré-formatado</pre>

Exemplo Prático:

O Comando <BLOCKQUOTE>

O comando <BLOCKQUOTE> </BLOCKQUOTE> é utilizado para destacar um bloco de texto. Em alguns navegadores o bloco destacado fica em itálico, porem em outros é adicionado uma tabulação ao bloco de texto, destacando-o dos demais.

Sintaxe:

<blockquote> Texto Destacado </blockquote>

Exemplo Prático:

O Comando <ADDRESS>

O comando <ADDRESS> </ADDRESS> marca o inicio e o fim de um bloco de endereço utilizado para especificar a autoria do documento HTML.

Sintaxe:

<address> Texto do Endereço </address>

Exemplo Prático:

PROPRIEDADES CSS - BORDER

2013-01-03T01:02:00.001-02:00

Propriedades Border

A propriedade Border define os tipos de bordas que podem ser associados a uma página, bloco de texto ou a um elemento.

As propriedades para as bordas são as listadas abaixo:

Propriedade	Efeito
border-width:	espessura da borda.
border-style:	cor da borda
border-top-width:	espessura da borda superior
border-top-style:	estilo da borda superior
border-top-color:	cor da borda superior;
border-right-width	espessura da borda direita
border-right-style	estilo da borda direita
border-right-color	cor da borda direita
border-bottom-width	espessura da borda inferior
border-bottom-style	estilo da borda inferior
border-bottom-color	cor da borda inferior
border-left-width	espessura da borda esquerda
border-left-style	estilo da borda esquerda
border-left-color	cor da borda esquerda
border-top	maneira abreviada para todas as propriedades da borda superior
border-right	maneira abreviada para todas as propriedades da borda direita
border-bottom	abreviada para todas as propriedades da borda inferior
border-left	maneira abreviada para todas as propriedades da borda esquerda
border	maneira abreviada para todas as quatro bordas

Valores válidos para as propriedades das bordas

color:

código hexadecimal: #FFFFFF
código rgb: rgb(255,235,0)
nome da cor: red, blue, green...etc

style:

none: nenhuma borda
hidden: equivalente a none
dotted: borda pontilhada
dashed: borda tracejada
solid: borda contínua
double: borda dupla
groove: borda entalhada
ridge: borda em ressalto
inset: borda em baixo relevo
outset: borda em alto relevo

width:

thin: borda fina
medium: borda média
thick: borda grossa
length: uma medida reconhecida pelas CSS (px, pt, em, cm, ...)

Existem vários estilos de bordas, definidos pela marcação border-style.

Visualize no exemplo abaixo:

<title>Efeitos de Borda com CSS</title>

<style type="text/css">

#borda1{

         border-color:#06F;

         border-width:thin;

         border-style:solid;

         width:250px;

         height:50px;

         float:left;

         margin-bottom:10px;

#borda2{

         border-color:#06F;

         border-width:thin;

         border-style:dashed;

         width:250px;

         height:50px;

         float:right;

         clear:right;

         margin-bottom:10px;

#borda3{

         border-color:#06F;

         border-width:thin;

         border-style:dotted;

         width:250px;

         height:50px;

         float:left;

         clear:left;

         margin-bottom:10px;

#borda4{

         border-color:#06F;

         border-style:double;

         width:250px;

         height:50px;

         float:right;

         clear:right;

         margin-bottom:10px;

#borda5{

         border-color:#06F;

         border-width:thin;

         border-style:groove;

         width:250px;

         height:50px;

         float:left;

         clear:left;

         margin-bottom:10px;

#borda6{

         border-color:#06F;

         border-width:thin;

         border-style:inset;

         width:250px;

         height:50px;

         float:right;

         clear:right;

         margin-bottom:10px;

#borda7{

         border-color:#06F;

         border-width:thin;

         border-style:ridge;

         width:250px;

         height:50px;

         float:left;

         clear:left

         margin-bottom:10px;

#borda8{

         border-color:#06F;

         border-style:outset;

         width:250px;

         height:50px;

         float:right;

         clear:right;

         margin-bottom:10px;

</style>

</head>

<body>

<div id="borda1">Borda Solid</div>

<div id="borda2">Borda Dashed</div>

<div id="borda3">Borda Dotted</div>

<div id="borda4">Borda Double</div>

<div id="borda5">Borda Groove</div>

<div id="borda6">Borda Inset</div>

<div id="borda7">Borda Ridge</div>

<div id="borda8">Borda OutSet</div>

</body>

</html>

Resultado:

Podemos também redimensionar a espessura de nossas bordas, usando a marcação border-width.

Podemos mudar de um modo geral o individual segue o exemplo baixo.

<title>Efeitos de Borda com CSS</title>

<style type="text/css">

#borda1{

         border-color:#F00;

         border-width:3px;

         border-style:solid;

         width:250px;

         height:50px;

         float:left;

         margin-bottom:10px;

#borda2{

         border-color:#06F;

         border-left-width::5px;

         border-left-color:#F00;

         border-style:solid;

         width:250px;

         height:50px;

         float:right;

         clear:right;

         margin-bottom:10px;

#borda3{

         border-color:#06F;

         border-right-width:5px;

         border-right-color:#F00;

         border-style:solid;

         width:250px;

         height:50px;

         float:left;

         clear:left;

         margin-bottom:10px;

#borda4{

         border-color:#06F;

         border-style:solid;

         border-bottom-width:5px;

         border-bottom-color:#F00;

         width:250px;

         height:50px;

         float:right;

         clear:right;

         margin-bottom:10px;

#borda5{

         border-color:#06F;

         border-width:thin;

         border-top-width:5px;

         border-top-color:#F00;

         border-style:solid;

         width:250px;

         height:50px;

         float:left;

         clear:left;

         margin-bottom:10px;

</style>

</head>

<body>

<div id="borda1">Todas as Bordas</div>

<div id="borda2">Borda Esquerda</div>

<div id="borda3">Borda Direita</div>

<div id="borda4">Borda Inferior</div>

<div id="borda5">Borda Superior</div>

</body>

</html>

Resultado:

PROPRIEDADES CSS - MARGIN

2013-01-03T00:50:00.000-02:00

Propriedades Margin

As margens nos elementos HTML

A propriedade para margens, define um valor para espessura das margens dos elementos HTML. As propriedades para margens são as listadas abaixo:

Propriedade	Efeito
margin-top:	Define a margem superior.
margin-right:	define a margem direita;
margin-bottom:	define a margem inferior;
margin-left:	define a margem esquerda;
margin:	maneira abreviada para todas as margens;

Valores válidos para a propriedade Margin

auto: valor default da margem
length: uma medida reconhecida pelas CSS (px, pt, em, cm, ...)
%: porcentagem da largura do elemento pai

Vamos a seguir analisar cada uma delas detalhadamente através de exemplos práticos.

Margem Superior – margin-top

<html>

<head>

<style type="text/css">

p {margin-top: 2cm;}

</style>

</head>

<body>

<p>Uma margem superior de 2cm</p>

</body>

</html>

Este é o efeito da folha de estilo acima:

Uma margem superior de 2cm

Margem Direita – margin-right

<html>

<head>

<style type="text/css">

p {margin-right: 300px;}

</style>

</head>

<body>

<p>Uma margem direita de 300px nesta

 frase mais longa dentro do parágrafo</p>

</body>

</html>

Este é o efeito da folha de estilo acima:

Uma margem direita de 300px nesta frase mais longa dentro do parágrafo

Margem Inferior – margin-bottom

<html>

<head>

<style type="text/css">

p {margin-bottom: 2em;}

</style>

</head>

<body>

<p>Uma margem inferior de 2.0em</p>

</body>

</html>

Este é o efeito da folha de estilo acima:

Uma margem inferior de 2.0em

Margem Esquerda – margin-left

<html>

<head>

<style type="text/css">

p {margin-left: 10%;}

</style>

</head>

<body>

<p>Uma margem esquerda de 10%</p>

</body>

</html>

Este é o efeito da folha de estilo acima:

Uma margem esquerda de 10%

Todas as quatro margens em uma declaração única

A propriedade da margin permitem que você controle o espaçamento em volta dos elementos HTML. São válidos valores negativos para margem, com o objetivo de sobrepor elementos.

<html>

<head>

<style type="text/css">

<!--

p {margin: 20px 40px 80px 5px;}

-->

</style>

</head>

<body>

<p>Uma margem superior de 20px, uma margem direita de 40px,

uma margem inferior de 80px e uma margem esquerda de 5px</p>

</body>

</html>

Este é o efeito da folha de estilo acima:

Uma margem superior de 20px, uma margem direita de 40px, uma margem inferior de 80px e uma margem esquerda de 5px

PROPRIEDADES CSS - TEXT

2013-01-03T00:45:00.000-02:00

Propriedades Text

As propriedades para textos, definem as características (os valores na regra CSS) dos textos inseridos dentro dos elementos HTML.

As propriedades para textos são as listadas abaixo:

Propriedade	Efeito
`color:`	Cor da fonte;
`letter-spacing:`	Espaçamento entre letras;
`word-spacing`	Espaçamento entre palavras;
`text-align:`	Alinhamento do texto;
`text-decoration:`	Decoração do texto;
`text-indent:`	Recuo do texto;
`text-transform:`	Forma das letras;
`direction:`	Direção do texto;
`white-space:`	Como o browser trata os espaços em branco;

Valores válidos para as propriedades de Text.

color:

código hexadecimal: #FFFFFF
código rgb: rgb(255,235,0)
nome da cor: red, blue, green...etc

letter-spacing:

normal: é o espaçamento default
lenght: uma medida reconhecida pelas CSS (px, pt, em, cm, ...) São válidos valores negativos

word-spacing:

normal: é o espaçamento default
lenght: uma medida reconhecida pelas CSS (px, pt, em, cm, ...) São válidos valores negativos

text-align:

left: alinha o texto a esquerda
right: alinha o texto a direita
center: alinha o texto no centro
justify: força o texto a ocupar toda a extensão da linha da esquerda a direita

text-decoration:

none: nenhuma decoração
underline: coloca sublinhado no texto
overline: coloca um sobrelinhado no texto
line-through: coloca uma linha em cima do texto
blink: faz o texto piscar

text-indent:

lenght: uma medida reconhecida pelas CSS (px, pt, em, cm, ...)
% : porcentagem da largura do elemento pai

text-transform:

none: texto normal
capitalize: todas as primeiras letras do texto em maiúsculas
uppercase: todas as letras do texto em maiúsculas
lowercase: todas as letras do texto em minúsculas

direction:

ltr: texto escrito da esquerda para a direita
rtl: texto escrito da direita para a esquerda

white-space:

normal: os espaços em branco serão ignorados pelo browser
pre: os espaços em branco serão preservados pelo browser
nowrap: o texto será apresentado todo ele numa linha única na tela. Não há quebra de linha até ser encontrada uma tag <br>

Exemplos:

`1- Espaçamento nas Letras` `letter-spacing`	`2- Espaçamento nas Palavras` `word-spacing`
`<html>` `<head>` `<style type="text/css">` `h2 {letter-spacing: 1.2em;}` `p {letter-spacing: 0.4cm;}` `</style>` `</head>` `<body>` `<h2> Este é o cabeçalho</h2>` `<p> Este é o parágrafo</p>` `</body>` `</html>`	`<html>` `<head>` `<style type="text/css">` `h2 {word-spacing: 1.8em;}` `p {word-spacing: 80px;}` `</style>` `</head>` `<body>` `<h2> Este é o cabeçalho</h2>` `<p> Este é o parágrafo</p>` `</body>` `</html>`
`3- Alinhamento do Texto` `text-align`	`4- Decoração do Texto` `text-decoration`
`<html>` `<head>` `<style type="text/css">` `h1 {text-align: left;}` `h2 {text-align: center;}` `h3 {text-align: right;}` `p {text-align: justify;}` `</style>` `</head>` `<body>` `<h1>Este é o cabeçalho 1</h1>` `<h2>Este é o cabeçalho 2</h2>` `<h3>Este é o cabeçalho 3</h3>` `<p>Este é o parágrafo cujo texto ...</p>` `</body>` `</html>`	`<html>` `<head>` `<style type="text/css">` `h1 {text-decoration: underline;}` `h2 {text-decoration: line-through;}` `h3 {text-decoration: overline;}` `a {text-decoration: none;}` `</style>` `</head>` `<body>` `<h1>Texto com sublinhado</h1>` `<h2>Texto com linha em cima</h2>` `<h3>Texto com sobrelinhado</h3>` `<p>` `<a href="#"> Este é um link sem sublinhado</a>` `</p>` `</body>` `</html>`
`5- Recuo do Texto` `text-indent`	`6- Forma das Letras` `text-transform`
`<html>` `<head>` `<style type="text/css">` `<!--` `h3 {text-indent: 80px;}` `p {text-indent: 3em;}` `-->` `</style>` `</head>` `<body>` `<h3>Texto com recuo de 80 pixel</h3>` `<p>Texto com recuo de 3.0em</p>` `</body>` `</html>`	`<html>` `<head>` `<style type="text/css">` `<!--` `h1 {text-transform: none;}` `h2 {text-transform: capitalize;}` `h3 {text-transform: uppercase;}` `h4 {text-transform: lowercase;}` `-->` `</style>` `</head>` `<body>` `<h1>Texto com letras como digitadas</h1>` `<h2>Texto com primeira letra das palavras, maiúsculas</h2>` `<h3>Texto com todas letras, maiúsculas</h3>` `<h4>Texto com letras minúsculas</h4>` `</body>` `</html>`

ESTILOS DE FONTES

2013-01-03T00:30:00.000-02:00

Estilos de Fontes

Para especificarmos estilos da fonte de nossa página web utilizaremos a tag <FONT> </FONT> para definir estilos tais como a cor, o nome da fonte e o tamanho da mesma.

Atributos do Comando <FONT>

color: Define a cor da fonte, podendo ser o nome da cor em inglês (red, Green, blue...) ou a numeração hexadecimal da mesma. (#CC00FF).
face: Define o tipo da fonte a ser aplicada (verdana, tahoma, arial, calibri, etc.)
size: Define o tamanho da fonte, deve ser especificado entre 1 e 7.

Sintaxe:

<font color=“red”> Texto </font>

<font face=“calibri”> Texto </font>

<font size=“6”> Texto </font>

<font color=“red” face=“calibri” size=“6”> Texto </font>

Exemplo Prático:

Letreiros

Para a criação de letreiros correntes na página, utilizamos a tag <MARQUEE></MARQUEE>.

Sintaxe:

<marquee> Texto Pré-formatado</marquee>

Atributos do Comando <MARQUEE>

scrollamount: Especifica a velocidade do letreiro.
direction: Define a direção do letreiro.
behavior: Define tipo de movimento do letreiro.
border: Define uma borda para o letreiro.
bordercolor: Define a cor da borda.
bgcolor: específica a cor de fundo do letreiro

Exemplo Prático:

CABEÇALHOS E ESTILOS DE TEXTO

2013-01-03T00:21:00.002-02:00

Níveis de Cabeçalho

Os cabeçalhos o títulos são linhas do documento que aparecem com um tamanho de letra diferenciado do restante do texto ou parágrafo com finalidade de identificar o inicio de uma seção, tópico ou parágrafo. Existem 6 níveis de cabeçalhos possíveis no HTML.

Sintaxe:

<h1> Título de Nível 1 </h1>

<h2> Título de Nível 2 </h2>

<h3> Título de Nível 3 </h3>

<h4> Título de Nível 4 </h4>

<h5> Título de Nível 5 </h5>

<h6> Título de Nível 6 </h6>

Exemplo Prático:

Atributos do Comando <H>

O atributo utilizado pelo pra de tags <h> </h> é o align, que é utilizado para alinhar o parágrafo em relação ao corpo do documento HTML.

Sintaxe:

<h1 align=“left”> Título Alinhado a Esquerda </h1>

<h2 align=“right”> Título Alinhado a Direita </h2>

<h3 align=“center”> Título Centralizado </h3>

<h4 align=“justify”> Título Justificado </h4>

Estilos de Textos

Podemos adicionar algumas formatações básicas ao texto de nossa página HTML, tais como, alterar a sua forma ou tipo da fonte, negrito, itálico, sublinhado, etc.

Abaixo segue uma lista com os comandos básicos:

Efeito	Sintaxe	Função
Negrito	<b> Texto </b>	Aplica o estilo negrito
Itálico	<i> Texto </i>	Aplica o estilo itálico
Sublinhado	<u> Texto </u>	Aplica o estilo sublinhado
Strong	<strong> Texto </strong>	Efeito similar ao uso do Negrito
Typewriter	<tt> Texto </tt>	Espaçamento de texto regular
Big	<big> Texto </big>	Aumenta e aplica negrito
Small	<small> Texto </small>	Reduz a fonte
Sobrescrito	<sup> Texto </sup>	Aplica o estilo sobrescrito
Subscrito	<sub> Texto </sub>	Aplica o estilo subscrito
Pulsante	<blink> Texto </blink>	Faz o texto pulsar

Exemplo Prático:

QUEBRA DE LINHA E PARAGRAFOS

2013-01-03T00:13:00.001-02:00

Quebra de Linha e Parágrafos

Quebra de Linha – O Comando <BR>

O comando <br> tem como função quebrar uma linha do texto, forçando que o mesmo continue na linha seguinte.

Sintaxe Comando <br>:

Parágrafos – O Comando <P>

A principal diferença entre um documento gerado através de um editor de texto e uma página web, é que uma página web não reconhece o fim de cada parágrafo. Para definição de parágrafos em páginas web devemos utilizar o par de tags <p> </p> para delimitar o escopo de nosso parágrafo.

Sintaxe:

<p> Texto do parágrafo </p>

Exemplo Prático:

Atributos do Comando <P>

O atributo utilizado pelo pra de tags <p> </p> é o align, que é utilizado para alinhar o parágrafo em relação ao corpo do documento HTML.

Sintaxe:

<p align=“left”> Texto Alinhado a Esquerda </p>

<p align=“right”> Texto Alinhado a Direita </p>

<p align=“center”> Texto Centralizado </p>

<p align=“justify”> Texto Justificado </p>

Exemplo Prático:

CADASTRO PHP - PARTE 01

2012-09-09T00:24:00.002-03:00

CADASTRANDO UM REGISTRO NO BANCO DE DADOS

CADASTRANDO UM REGISTRO NO BANCO DE DADOS COM PHP - PARTE 01

Para salvar um registro em um banco de dados Mysql utilizando o PHP, devemos criar um script de conexão com banco e um script para executar o comando sql de INSERT na nossa base de dados. Nesta primeira parte do tutorial criaremos o banco de dados, a tabela, o script de conexão e um script para persistir a informação na nossa base de dados.

Construindo a base de dados e a tabela.

Execute o script a seguir no mysql para gerar a nossa base de dados.

create database bd_ExemploBlog;

use bd_ExemploBlog;

create table tb_veiculo(
id int primary key auto_increment,
modelo varchar(35),
fabricante varchar(35),
cor varchar(35),
ano int,
valor double );

Construindo o script de conexão com Banco

Crie um arquivo PHP com a seguinte programação.

<?php

// Caminho da Base de Dados Mysql
$caminho="localhost:3306/";

// Usuário de acesso a Base de Dados
  $usuario="root";

// Senha de acesso a Base de Dados
  $senha="123456";

// Nome da Base de Dados a ser utilizada
  $banco="bd_ExemploBlog";

   // Função mysql_connect() é responsável pela conexão com o servidor Mysql.
  mysql_connect($caminho,$usuario,$senha) or die (mysql_error());

   // Função mysql_select_db() é responsável por selecionar a base de dados a ser utilizada.
  mysql_select_db($banco);

?>

Ao fim salve o script com o nome conexao.config, no diretório htdocs do seu servidor Apache.

Construindo o script de persistência no Banco

Para salvar um registro na nossa base de dados devemos usar uma String com o comando INSERT e o função mysql_query( ) para executar o INSERT na base de dados. Neste primeira parte do tutorial de persistência no banco veremos um exemplo simples, sem o uso de formulários html para o envio de informações. Segue o script de persistência.

<?php

// INCLUINDO O ARQUIVO DE CONEXÃO
include 'conexao.config';

// DADOS A SEREM SALVOS NA TABELA tb_veiculo
$modelo = "C3";
$cor = "Preto";
$ano = 2009;
$valor = 45000.00;
$fabricante = "Citroen";

// VARIAVEL COM A STRING DO COMANDO SQL
$query = "insert into tb_veiculo(modelo, cor, ano, fabricante, valor) values ('$modelo', '$cor', $ano, '$fabricante', $valor)";

// EXECUTANDO A STRING COM O COMANDO INSERT
mysql_query($query) or die(mysql_error());

// VERIFICANDO SE O REGISTRO FOI SALVO
if(mysql_affected_rows()==1){
echo "Veículo $modelo Salvo com Sucesso !!!";
}else{
echo "Erro ao Salvar o Veículo";
}

// ENCERRANDO A CONEXÃO COM A BASE DE DADOS.
mysql_close();

?>

Após executar o script acima o registro informado é salvo na base de dados. Para verificar execute um SELECT na tabela tb_veiculo.

ANDROID

2012-08-15T00:13:00.002-03:00

Em breve estarei publicando no Blog minhas atividades envolvendo a tecnologia Android.

Aguarde.

O Android é um sistema operacional baseado no núcleo Linux para dispositivos móveis, atualmente a Google lidera as pesquisas de desenvolvimento de aplicações que utilizam esta plataforma de sistema operacional para dispositivos móveis. O Android é um dos sistemas operacionais que mais crescem no mercado de dispositivos móveis, tais como TV, Celulares e Tablets.

Site Oficial: http://www.android.com

Portal dos Desenvolvedores: http://developer.android.com

FUNÇÕES DO MYSQL NO PHP

2012-08-14T23:35:00.001-03:00

PRINCIPAIS FUNÇÕES DO MYSQL NO PHP

CRIAÇÃO DE PROGRAMAS COM PHP + MYSQL - PARTE 02

1. FUNÇÕES BÁSICAS DO MYSQL NO PHP

mysql_connect()

Estabelece uma conexão com um Banco de Dados MySQL.

mysql_pconnect()

Estabelece uma conexão persistente com um Banco de Dados MySQL.

mysql_select_db()

Junto com a mysql_connect e a mysql_query, eu diria que está forma o grupo das 3 funções básicas. É com ela que o usuário seleciona o banco de dados onde irá trabalhar. Obs: é somente o banco de dados, e não a tabela de dados.

mysql_query()

Executa uma função em um Banco de Dados MySQL. Caso o link não for especificado, a última conexão aberta com o MySQL será usada. Se nenhum link foi aberto, a função irá tentar abrir um utilizando a função mysql_connect() sem nenhum argumento.

mysql_affected_rows()

Retorna o número de linhas afetadas com a última query usando INSERT, UPDATE ou DELETE associado com o link_identifier. Se o link de identificação não for especificado, o último link aberto pelo mysql_connect() é assumido.

mysql_error()

Retorna o erro da última função do MySQL ou não retorna nada caso não ocorrer erro na função.

mysql_fetch_array()

Cria uma array com os resultados de uma consulta SELECT no MySQL. Retorna FALSE em caso de erro.

mysql_fetch_object()

Cria um objeto com os resultados de uma consulta SELECT no MySQL. Retorna FALSE em caso de erro.

mysql_result()

Retorna o resultado de campo único. O identificador de campo pode ser deslocamento de campo (0), nome de campo [FirstName] ou nome de tabela de ponto (myfield.mytable).

mysql_num_rows()

Retorna o número de linhas de uma consulta. Esse comando é valido apenas para consultas com SELECT.

mysql_close()

Fecha uma conexão, não persistente, aberta em um Banco de Dados MySQL.

2. FUNÇÕES AVANÇADAS DO MYSQL NO PHP

mysql_db_query()

Seleciona uma base de dados e executa uma consulta nela. Se o link identificador opcional não for especificado, a função tentará encontrar um link aberto para o servidor MySQL e se nenhum link for encontrado a função tentará criar um utilizando a função mysql_connect() como se ela tivesse sido chamada sem parâmetros.

mysql_create_db()

Cria um novo banco de dados no server associado com o link.

mysql_change_user()

Muda o usuário entrado da conexão ativa atual, ou a conexão dada pelo parâmetro mais link_identifier que é opcional. Se um banco de dados for especificado, esta optará pelo banco de dados atual(default) depois que o usuário foi mudado. Se a autorização nova do usuário e da senha falhar, o usuário conectado atual permanece ativo.

mysql_drop_db()

Tenta remover uma base de dados inteira do servidor associado com o link identificador especificado.

mysql_errno()

Para buscar o código do erro. Repare que esta função somente retorna o código do erro da última função MySQL que foi executada (não incluíndo mysql_error() e mysql_errno()), então se você desejar utilizá-lo, tenha certeza que você verificou o último valor antes de chamar outra função MySQL..

mysql_fetch_assoc()

É equivalente a chamar mysql_fetch_array() com MYSQL_ASSOC para o segundo parametro, que é opcional. Somente retorna uma matriz associativa. Este é o jeito que mysql_fetch_array() funcionava originalmente. Se você precisa dos índices numéricos assim como o associativo, use mysql_fetch_array().

mysql_fetch_field()

Retorna um objeto representando o campo com a posição especificada.

mysql_fetch_lengths()

Retorna o tamanho dos campos da consulta em um array.

mysql_fetch_row()

Funciona para organizar os resultados em strings.

mysql_free_result()

Libera toda memória associada com o result.

mysql_get_client_info()

Retorna a versão atual do MySQL instalada no servidor.

mysql_info()

Retorna informação detalhada sobre a última query usando o link_identifier dado. Se link_identifier não é especificado, a última conexão aberta é usada.

mysql_insert_id()

É bastante util quando necessita saber qual foi o ID gerado por uma QUERY INSERT anterior, não precisando executar algum outro select ou depender de variáveis postadas.

mysql_list_dbs()

Retorna os bancos de dados disponíveis na última conexão aberta com o MySQL.

mysql_list_fields()

Lista os campos de uma tabela do MySQL.

mysql_list_processes()

Lista os processos atuais no MySQL.

mysql_list_tables()

Dado um Banco de Dados, esta função lista as tabelas do mesmo.

mysql_num_fields()

Retorna o número de campos de um resultado.

mysql_ping()

Checa se a conexão com o servidor mysql está ou não funcionando. Se ela não estiver funcionando, uma reconexão será feita automaticamente. Esta função pode ser usada em scripts que ficam com a conexão parada por um longo tempo, para checar se o servidor fechou a conexão e reconectar se necessário. mysql_ping() retorna TRUE se a conexão estiver funcionando, ou então FALSE se não estiver.

mysql_stat()

Retorna o status atual do servidor mysql.

mysql_tablename()

Retorna o nome da tabela para o campo especificado.

CONEXÃO COM O BANCO DE DADOS NO PHP

2012-08-14T23:24:00.001-03:00

CONEXÃO COM O BANCO DE DADOS

CRIAÇÃO DE PROGRAMAS COM PHP + MYSQL - PARTE 01

Para efetuarmos uma conexão com o banco de dados MYSQL usando a linguagem php, devemos informar o caminho do banco de dados e sua devida porta, o usuário e a senha do mesmo além de informar em qual banco de dados estarão realizando as operações de manipulação do banco de dados.

Para conectar no banco usaremos o comando mysql_concet( ), passando como parâmetros o caminho do banco, sua porta, seu usuário e sua senha.

Sintaxe:

mysql_connect('caminho do banco : porta',' usuário ',' senha ');

Exemplo de Conexão com Mysql:

Antes de criarmos o script de conexão deveremos criar o banco de dados no prompt de comando do MYSQL.

Execute a DDL a seguir:

create database livrariaweb;

Após criarmos o banco no MYSQL, criaremos o script php abaixo.

<?php

// Caminho e Porta do Banco de Dados

$caminho = "localhost:3306/";

// Usuário Administrador do Banco de Dados

$usuario = "root";

// Senha do Administrador

$senha = "123456";

// Nome do Banco de Dados

$banco = "livrariaweb";

// Variável de $conexão recebendo a conexão com o Banco de Dados

$conexao = mysql_connect($caminho,$usuario,$senha) or die (mysql_error());

// Selecionando o Banco de Dados

mysql_select_db($banco);

// Teste Lógico para verificar a conexão com o banco

if ( $conexao == true ){

echo 'Banco Conectado com Sucesso !!!';

}

Else{

echo 'Erro ao Conectar no Banco de Dados !';

}

A criar o script salve-o com o nome conectarBanco.php.

No script acima a variável $conexao receberá da função mysql_connect( ) um valor booleano, esse valor pode ser true caso o caminho, usuário e senha forem verdadeiro ou false caso uma dessas condições forem falsas.

Ao finalizar o script teste o mesmo e verifique se a conexão foi estabelecida com sucesso, no próximos post criaremos uma tabela no banco se salvaremos um registro através do php.

Introdução a Linguagem HTML

2012-08-14T23:07:00.001-03:00

Introdução a Linguagem HTML

O HTML (HyperText Markut Language) é uma linguagem dedicada a modelagem de páginas web. Um arquivo HTML consiste de um texto comum de códigos especiais chamados tags. As tags do HTML representam as marcações da linguagem HTML. O HTML é bastante simples e tem como finalidade formatar o texto exibindo em um navegador e criar ligações entre documentos web, por isso é conhecido com Hypertext ou seja hipertexto.

As primeiras versões do HTML foram definidas com regras sintáticas flexíveis, o que ajudou aqueles sem familiaridade com a publicação na Web. Atualmente a sintaxe do HTML é muito mais rígida, permitindo um código mais preciso. Através do tempo, a utilização de ferramentas para autoria de HTML aumentou, assim como a tendência em tornar a sintaxe cada vez mais rígida. O padrão da linguagem HTML é mantido pelo W3C - World Wide Web Consortion, que é orgão que mantêm os padrões de algumas linguagens web.

O que é uma página web?

Uma página web é um arquivo disponibilizado na web, geralmente no formato HTML e com ligações de hipertexto (Links) que possibilitam a navegação entre páginas ou entre sessões de uma mesma página. As páginas podem possuir recursos gráficos como imagens, animações, vídeos e sons. Uma página web é visualizada através do uso de um browser ou navegador.

Como se cria uma página web?

Para construirmos páginas HTML precisamos de um Editor de texto (exemplo, Bloco de Notas, Notepad ++, Nvu, Adobe Dreamweaver) e de um navegador (exemplo: Google Chrome, Mozilla Firefox, Opera, Safari, NetScape e em último caso Internet Explorer).

Por ser uma linguagem de marcação, a sintaxe do HTML na maioria dos casos exige uma tag de início e uma de final daquele bloco.

Os arquivos criados no editor de texto deverá ser salvo com a extensão .html ou .htm . Salve os seus arquivos em um diretório de sua preferência e para abri-los basta um duplo clique.

Estrutura Básica do HTML

A estrutura básica de um documento HTML é especificada através do uso de pares de tags, para delimitar o conteúdo que sofrerá alguma alteração. Além da definição de pares de tags o HTML também trabalha com algumas tags individuais.

Os pares de tags devem obedecer a seguinte estrutura:

<NOME DA TAG > TEXTO </NOME DA TAG>

As tags dever ser endentadas, ou seja, uma não deve atrapalhar o fechamento da outra.

Sintaxe Básica do HTML:

Definição do Comandos:

§ <HTML> : Delimita o inicio e fim de uma página ou documento HTML.

§ <HEAD> : Delimita o inicio e fim do bloco de cabeçalho de uma página HTML.

§ <TITLE> : Delimita o texto a ser exibido na barra de títulos da janela do navegador.

§ <BODY> : Delimita o inicio e fim do corpo do documento HTML. É nele que a maioria das tags da linguagem HTML são definidas.

WEB SERVICES SEMÂNTICOS

2012-07-26T21:33:00.000-03:00

WEB SERVICES SEMÂNTICOS

Você sabe o que é WEB 3.0? Já ouviu falar em Web Semântica, logo abaixo segue um resumo que eu fiz para apresentação do meu Projeto Final da Universidade Unigranrio.

Web Services Semânticos

Possibilita que máquinas possam tomar decisões com base em requisições dos usuários e nos dados armazenados na web, estejam eles em banco de dados ou em arquivos XML. Permitindo a interação entre sistemas computacionais e humanos no gerenciamento e na utilização destes dados previamente armazenados.

Web Semântica

A Web como conhecemos hoje é definida como sintática onde computadores apresentam informações e quem interpreta são os humanos. É uma extensão da web atual que permitirá aos computadores e humanos trabalharem em cooperação.

A Web Semântica é um modelo que promete organizar as informações contidas na web. A web deixará de ter um status de apresentador de informações para um status de interpretador. A organização e utilização dos dados de forma inteligente passam a ser o grande diferencial da Web Semântica.

Permitir que pessoas explorem, associem e conectem informações para obter novos conhecimentos é a promessa da Web Semântica.

Interliga significados de palavras, tem como finalidade conseguir atribuir um significado (sentido), aos conteúdos publicados na web de modo que o mesmo seja perceptível tanto pelo homem como pela máquina.

Ontologias

Modelo de dados que representam um conjunto de conceitos dentro de um domínio e os relacionamento entre esses conceitos.

É utilizada para realizar inferências entre conceitos.

É utilizada em : Inteligência Artificial, Engenharia de Software, Arquitetura da Informação, Web Semântica.

Descrevem: Indivíduos (Objetos Básicos), Classes (Conjuntos, Coleções ou Tipos de Objetos), Atributos (Propriedades, Características e Parâmetros que um Objeto pode compartilhar), Relacionamentos.

OWL ( Web Ontology Language )

Linguagem de Ontologias da Web.

Adiciona ao modelo RDF vocabulário para descrever classes, fatos sobre estas classes, relacionamentos entre classes e instâncias e características destas relações.

Adiciona semântica de modelagem de dados que são mais poderosas do que nos Banco de Dados convencionais. Modelos de Negócios são mantidos sintaticamente e semanticamente dentro de uma estrutura OWL.

Baseado em RDF.

RDF ( Resource Description Framework )

É uma especificação padrão de dados e modelagem utilizada para codificar metadados.

Linguagem de representação de informação na internet.

São modelos ou fontes de dados (metadata);

Tem como objetivo criar um modelo Simples de Dados, usar vocabulários URI-Based e uma sintaxe XML-Based e suportar o uso de XML.

Componentes Básicos: Recurso (URI), Propriedade, Valor.

Quem usa a Web Semântica hoje?

Páginas Web de Consumidores

Yahoo

Hakia (buscador)

BBC Online

DBPedia

FreeBase (por metaWeb)

Softwares de Negócios

Thomson Reuters Calais

Banco de Dados Oracle

IBM Registry

Down Jones Client Solutions

Microsoft

É um resumo bem básico, porém dá pra ter uma noção do que esta tecnologia é capaz.

Para quem se interessou sobre o tema e gostaria de saber mais. Leiam a definição de Web Semântica no portal do Consorcio W3C.

Não poderia deixar de citar o nome dos meus amigos que contribuíram para o crescimento de nossos estudos.

Grupo do Projeto Final:
Fabiano Costa
Paulo Ricardo
Renan Santos

Fonte de Pesquisa do Resumo:

Livro: Web Semântica para Leigos, 2010 por J. Pollock
Revista: SQL Magazine, Edição 98, Ano 8.

MANIPULAÇÃO DE ARQUIVOS COM PHP

2012-06-29T11:12:00.001-03:00

MANIPULAÇÃO DE ARQUIVOS COM PHP - PARTE 1

Muito tempo desde a última postagem, então vamos dar prosseguimento ao conteúdo de PHP. Trataremos de manipulação de arquivos.

O PHP possui duas funções destinadas a incluir arquivos dentro de uma página php. Essas funções são o include( ); e o require( );. Ambas incluem arquivos de fontes externas dentro de uma página PHP.

Segundo o W3C a função include e require são usadas para inserir códigos úteis em outros arquivos php, no fluxo de execução do mesmo.

O include e o require são identicos, exceto pelos casos de falha:

require, produzirá um erro fatal (E_COMPILE_ERROR) caso o mesmo não encontre o script a ser incorporado.
include, somente produzirá um aviso (E_WARNNIG) e o mesmo continuará.

Sintaxe:

require ' ';

<?php

require 'nome_arquivo';

include ' ';

<?php

include 'nome_arquivo';

Exemplo Prático

Crie um script com o nome veiculo.php e implemente o código a seguir:

<?php

$modelo = "Camaro";

$placa = "DDD-1000";

$cor = "Amarelo";

$valor = 120000;

$ano = 2012;

Crie um script com o nome exibirveiculo.php e implemente o código a seguir:

<?php

include "veiculo.php";

echo "<h3>Dados do Veículo </h3>"

echo "Veiculo : $modelo";

echo "<br>";

echo "Placa : $placa";

echo "<br>";

echo "Cor : $cor";

echo "<br>";

echo "Valor : $valor";

echo "<br>";

echo "Ano : $ano";

Forum de Software Livre

2012-05-29T15:05:00.004-03:00

http://forumsoftwarelivre.com.br/2012/

IV Fórum de Software Livre de Duque de Caxias

Local: Universidade Unigranrio

30 de Junho de 2012

Inscreva-se.

PROPRIEDADES CSS - FONT

2012-05-09T11:41:00.001-03:00

PROPRIEDADES CSS

As propriedades no Css são utilizadas para especificar formatações ao seus seletores, sejam eles seletores class, id ou tags. No Css existem propriedades que definem o estilo de fonte, textos, plano de fundo, margens internas, margens externas, imagens, formulários, links, etc.

Veremos cada uma delas começando pela Propriedade Font.

PROPRIEDADES FONT

As propriedades para as fontes, definem as características (os valores na regra CSS) das letras que constituem os textos dentro dos elementos HTML.

As propriedades básicas para fontes e que abordaremos nesta postagem são as listadas abaixo:

color: Define a cor da fonte.
font-family: Define a família de fontes que você pode utilizar em sua página.
font-size: Define o tamanho da fonte.
font-style: Define o estilo da fonte.
font- variant: Fontes maiúsculas de menor altura.
font-weight: Define quanto mais escura a fonte é (negrito).
font: Usada para definir todas propriedades em uma única declaração.

Valores usados para cada propriedade:

color:

código hexadecimal: #FFFFFF
código rgb: rgb(255,235,0)
nome da cor: red, blue, green...etc

font-family:

nome da família de fontes : define-se pelo nome da fonte, p. ex:"verdana", "helvetica", "arial", etc.
nome da família genérica: define-se pelo nome genérico, p. ex:"serif", "sans-serif", "cursive", etc.

font-size:

xx-small, x-small, small, médium, large, x-large, xx-large, smaller, larger,
length: uma medida reconhecida pelas CSS (px, pt, em, cm, ...)
%

font-style:

normal: fonte normal na vertical
italic: fonte inclinada
oblique:fonte obliqua

font-variant:

normal: fonte normal
small-caps: transforma em maiúsculas de menor altura

font-weight:

normal, bold, bolder, lighter
100, 200, 300, 400, 500, 600, 700, 800, 900

Exemplo:

<head>

<style type="text/css">

p {

font-family: arial, helvetica, serif;

color: #FF0000;

font-size: 14px;

font-style: italic;

}

p.seletor1 {

font-variant: small-caps;

font-weight: bold;

}

</style>

</head>

<body>

<p>
Esse texto está estilizado com Css </p>

<br>

<p
class=”seletor1”>

Esse
texto está estilizado com Css usando o font-variant e

font-weight.

</p>

</body>

SELETORES CSS

2012-05-07T17:59:00.001-03:00

SELETORES CSS

Seletores HTML - Atributos

Os seletores HTML são utilizados para definir estilos nas tags da linguagem de marcação HTML.

Sintaxe:

[elemento] : { bloco de declarações}

Exemplo:

body {

color: #000;

background: #fff;

font-weight: bold;

}



h1, h2, h3, h4, h5, h6

{

color:
#0f0;

}

p{

font-family: calibri, Tahoma, arial;

color: gainsboro;

size: 12px;

}

Seletores CLASS

Você não está restrito somente aos elementos HTML (tags) para aplicar regras de estilo. Você pode "inventar" um nome e com ele criar uma classe a qual definirá as regras CSS.

Exemplo:

.seletor1 {

font-size:
14px;

color:
#0066FF;

font-family: Arial, Serif;

}

E o mais interessante das classes, é que elas podem ser aplicadas a qualquer elemento HTML. E mais ainda, você pode aplicar estilos diferentes para o mesmo tipo de elemento da HTML, usando classes diferentes para cada um deles.

Exemplo:

p.seletor1 {

font-size:
14px;

color:
#000;

font-family:
Arial, Serif;

}

p.seletor2 {

font-size:
12px;

color:
#0ff;

font-family: Verdana, Arial;

}

Utilização:

<p class ="seletor1">

este parágrafo será na cor preta, fonte Arial e
tamanho 14px.

</p>

<p class ="seletor2">

este parágrafo será na cor azul, fonte Verdana e
tamanho 12px.

</p>

Seletores ID

O seletor ID difere do seletor classe, por ser ÚNICO. Um seletor ID de determinado nome só pode ser aplicado a UM e somente UM elemento HTML dentro do documento.

Você pode "inventar" um nome e com ele criar um ID ao qual definirá as regras CSS. Um determinado ID só pode ser aplicado a UM elemento HTML.

A sintaxe para o seletor ID é mostrada a seguir. Um nome qualquer que você "inventa" precedido do sinal # ("tralha" ou "jogo-da-velha"):

Exemplo:

#meuID {

propriedade: valor;

}

#banner{

width:100%;

height:250px;

}

FORMULÁRIOS

2012-05-07T17:42:00.002-03:00

FORMULÁRIOS HTML (PARTE 01)

Os formulários HTML são utilizados para fazer interação com páginas HTML, através de envio de informações (dados) e requisições. Os formulários podem enviar informações através de métodos os mais comuns são o GET e o POST. Leia mais sobre formulários na apostila de HTML.

Sintaxe:

</form>

name: o identificador do formulário.
action: nome do script que receberá os dados do formulário ao ser submetido.
method: método de envio dos dados: get ou post;

Métodos GET e POST

GET: O método GET utiliza a própria URL para enviar dados ao servidor, quando enviamos um formulário pelo método GET, o navegador pega as informações do formulário e coloca junto com a URL de onde o formulário vai ser enviado e envia, separando o endereço da URL dos dados do formulário por um “?” (ponto de interrogação).

POST: O método POST envia os dados colocando-os no corpo da mensagem. Ele deixa a URL separada dos dados que serão enviados e com isso podemos enviar qualquer tipo de dados por esse método.

Exemplo:

<HTML>

<HEAD>

<TITLE> Criação de Formulários em HTML </TITLE>

</HEAD>

<BODY>

Matricula: <br><input type="text" name="txtmatricula" size="10"> <br>

Aluno: <br><input type="text" name="txtsenha" size="30"> <br>

Curso: <br><input type="text" name="txtcurso" size="30"> <br>

</form>

</BODY>

</HTML>

Recuperando valores dos Formulários

$_GET

O comando $_GET é uma entidade superglobal do php que tem como função recuperar dados enviados através de uma URL através do método get do HTML

Exemplo:

$nome = $_GET[“txtnome”]; // Recupera o valor passado por uma input chamada txtnome

$_POST

O comando $_GET é uma entidade superglobal do php que tem como função recuperar dados enviados através de uma mensagem HTTP através do método post do HTML.

Exemplo:

$mat = $_POST[“txtmat”]; // Recupera o valor passado por uma input chamada txtmat

Exemplo Prático:

Construa o formulário HTML a seguir e salve o mesmo no diretório C:/Xampp/htdocs com o seguinte nome: formaluno.html.

<TITLE>Criação de Formulários em HTML

</TITLE></HEAD>

<BODY>

Matricula:<br>

<br>Aluno:<br>

<br>Curso:<br>

<br>

</form>

</BODY>

</HTML>

Após Construir o formulário HTML devemos criar o script que receberá os dados enviados pelo mesmo. O nome do script está definido no atributo action do formulário html (action="exibirdados.php") . Crie o script a seguir e salve o mesmo no diretório C:/Xampp/htdocs com o seguinte nome: exibirdados.php

<?php

$mat = $_POST["txtmat"];

$nome = $_POST["txtnome"];

$curso = $_POST["txtcurso"];

echo "Matricula: ".$mat."<br>";

echo "Nome: ".$nome."<br>";

echo "Curso: ".$curso."<br><br>";

echo "Dados Recuperados Com Sucesso usando o método POST";

FUNÇÕES NO PHP

2012-05-07T17:08:00.000-03:00

FUNÇÕES

Uma função é um bloco de código, que geralmente contém um conjunto de instruções para determinada tarefa. Não são pesadas, nem tornam o código lento, uma vez que ficam inativas até serem chamadas em algum momento do código. Reduzem drasticamente o trabalho de redigitar códigos, e seus conseqüentes erros, pois uma vez construída, pode ser utilizada em qualquer lugar de seus scripts, e caso precise alteração, você não precisará trocar em todos os scripts, apenas no seu arquivo de funções.

Sintaxe:

function nomedafuncao() {

//conteúdo

}

Exemplo:

function exibirMensagem(){

echo “Bem Vindo ao Site”;

}

exibirMensagem();

Passagem de parâmetros

Uma função pode receber e retornar valores, tais como números, strings ou até mesmo conexões com banco de dados.

Sintaxe:

function nomedafuncao($parametro){

// conteúdo

}

Exemplo:

function somar($num1,$num2){

return $num1 + $num2;

}

echo somar(7,5);

$nt1 = (double)7.2;

$nt2 = (double)8.2;

echo “<br>”.somar($nt1,$nt2);

Passagem de parâmetros por referência

Na passagem de parametros por referência, faz-se o uso do modificado “&” para realizar a alteração dos valores de variáveis.

Exemplo1:

function mais($numero) {

$numero += 5;

}

$a = 3;

mais($a); //$a continua valendo 3

Exemplo2:

function mais5(&$num1, $num2) {

$num1 += 5;

$num2 += 5;

}

$a = $b = 1;

mais5($a, $b); /* Neste caso, só $a terá seu valor alterado, pois a passagem por referência está definida na declaração da função. */

mais5($a, &$b); /* Aqui as duas variáveis terão seus valores alterados. */

Argumentos pré-definidos

Exemplo:

function somar($num1=10,$num2=2){

return $num1 + $num2;

}

echo somar(); // Exibe o resultado 12

echo somar(1,3); // Exibe o resultado 4

ESTRUTURAS DE CONTROLE

2012-05-07T17:01:00.001-03:00

ESTRUTURA DE REPETIÇÃO

§ Estrutura de Repetição for

É um comando que repete uma instrução determinado número de vezes até que alguma condição seja satisfeita.

Sintaxe:

for( inicialização; condição; contador ){

< comando 1 >;

< comando 2 >;

< comando N >;

}

Exemplo: Exibir números de 1 à 10.

for( $i=0; $i<=10; $i++ ){

echo $i;

}

§ Estrutura de Repetição foreach

O comando foreach é uma estrutura de repetição utilizada para percorrer os elemento de um array.

Sintaxe:

foreach(array as $valor)

{

< comando 1 >;

< comando 2 >;

< comando N >;

}

Ou:

foreach(array as $chave => $valor) # Exibe o valor e seu índice no array.

{

< comando 1 >;

< comando 2 >;

< comando N >;

}

Exemplo:

<?php

# Array de Times

$times = array('botafogo','flamengo','fluminense','vasco');

foreach ($times as $chave => $rio) {

echo "Chave: $chave; Times: $rio<br>\n";

}

<?php

$times = array('botafogo','flamengo','fluminense','vasco');

foreach ($times as $rio) {

echo "Times: $rio<br>\n";

}

§ Estrutura de Repetição While

O while é o comando de repetição (laço) mais simples. Ele testa uma condição e executa um comando, ou um bloco de comandos, até que a condição testada seja falsa. Assim como o if, o while também possui duas sintaxes alternativas:

Sintaxe:

while (< condição >)

<comando>;

while (< condição >){

< comando 1 >;

< comando 2 >;

< comando N >;

}

Exemplo:

<?php

$i = 1;

while ($i <=10)

echo $i++;

§ Estrutura de Repetição do..while

O laço do..while funciona de maneira bastante semelhante ao while, com a simples diferença que a expressão é testada ao final do bloco de comandos. O laço do..while possui apenas uma sintaxe, que é a seguinte:

Sintaxe:

do {

< comando 1 >;

< comando 2 >;

< comando N >;

} while ( condição );

Exemplo:

<?php

$i = 0;

do {

echo ++$i;

} while ($i < 10);

Quebras de Fluxo

Break

O comando break pode ser utilizado em laços de do, for e while, além do uso já visto no comando switch. Ao encontrar um break dentro de um desses laços, o interpretador PHP pára imediatamente a execução do laço, seguindo normalmente o fluxo do script.

Exemplo:

while ($x > 0) {

if ($x == 20) {

echo "erro! x = 20";

break;

}

Continue

O comando continue também deve ser utilizado no interior de laços, e funciona de maneira semelhante ao break, com a diferença que o fluxo ao invés de sair do laço volta para o início dele.

Exemplo:

for ($i = 0; $i < 100; $i++) {

if ($i % 2) continue;

echo " $i ";

}