!Up Person Technology - INFORMÁTICA
Como publicar um site
Contato
O segredo da riqueza
Muito simples no falar;
Perguntou-me de jeito meigo:
- Como faço para enricar?
Respirei fundo dizendo, com o maior amor que pude passar;
- Neste mundo meu amigo muitos costumam afirmar:
"Que ninguém enriquece ao trabalhar";
Ele me olhou intrigado e uma lágrima deixou escapar;
Enxuguei com gentileza aquela lagrima a rolar;
Completei com agilidade, para a sua esperança não evaporar:
- Isso não é verdade, pois as pessoas podem enricar;
Seja com muito trabalho ou por habilidades a empenhar;
Ele olhou-me com entusiasmo e um pedido deixou escapar:
- Me explique com paciência, pois eu quero empenhar;
Eu sorri por um breve instante e tratei de responder;
Aquele menino sigelo o que ele queria saber;
- Disse isso meu amigo, pois sei que podes vencer;
O segredo da vitória está em você aprender ;
Ele me deu um longo sorriso e positívo voltou a me pedir;
- Ensina-me o que sabes;
Pois riquezas um dia quero possuir;
E é por isso meus amigos que hoje estou aqui;
Publicando este blogger simples;
Tão fácil de compreender;
Para que todos um dia possam enriquecer.
| LIVRO MINUTOS DE SABEDORIA |
APOSTÍLAS
Introdução
(11)930507665
aektecnologica@gmail.com
uppersontecnologia@gmail.com
PROGRAMAÇÃO PASCAL
PERGUNTAS INTRODUTÓRIAS
1- Quem desenvolveu a linguagem Pascal?
2- Por que a linguagem Pascal?
3- O que é necessário para iniciar o estudo?
4- O que é um Programa?
5- O que é um algoritmo?
6- O que é um fluxograma?
7- Quais são as três estruturas de controle básicas de um programa em Pascal?
8- Quais são as palavras inglesas principais para iniciar um programa em Pascal?
9- O que são comentários?
10- O que é compilação e execução de um programa?
11- Quais são os operadores aritméticos em uma programação Pascal?
12-Quais caracteres são usados em Pascal?
13- O que são estruturas de controle simples ou sequencial?
14- Como faço para achar a raiz quadrada e o quadrado de um número em Pascal?
15- Quais são os tipos de dados?
16- Poderia falar mais sobre o tipo booleano (boolean)?
17- O que são estruturas de controle Seleção ou Condicional?
18- Exercícios
19- O que é um acumulador?
20- O que é um contador?
21- O que são Estruturas de Repetição?
22- Quais os tipos de estruturas de contrôlo repetitiva?
23- O que são laços condicionais (conditional looping)?
24- O que são laços incondicionais (inconditional looping) ou simples laços?
25- Para o que é usada a ESTRUTURA FOR?
26- O que é a ESTRUTURA WHILE-DO (Repetição com precondição ou poscondição)?
27- O que é a ESTRUTURA REPEAT-UNTIL?
28- O que é uma instrução GOTO?
29- O que são identificadores?
30- O que é uma constante?
31- Apostila completa em PDF de Técnicas de Programação e Linguagem Pascal.
1-Quem desenvolveu a linguagem Pascal? INÍCIO
Foi desenvolvida no início dos anos 70 por Nicklaus Wirth, na Universidade Técnica de Zurique, Suíça.
2- Por que a linguagem Pascal? INÍCIO
Pois é uma linguagem que possui um método ordenado e disciplinado de programação. O seu uso, leva ao desenvolvimento de programas que são lógicos, bem organizados, com uma escrita clara e praticamente isenta de erros.
3- O que é necessário para iniciar o estudo? INÍCIO
Precisa-se ter um software, ou seja, um programa "Turbo Pascal ou ANSI Pascal", que pode ser conseguido na internet gratuítamente, que inclui um editor e um depurador interativo.
4- O que é um Programa? INÍCIO
É um conjunto de instruções apropriadas fornecidas ao computador, para processar um conjunto de dados. Estas instruções, depois de darem entrada no computador, são armazenadas numa parte da sua memória.
5- O que é um algoritmo?INÍCIO
È um procedimento para resolver um problema, definido por uma sequência finita e ordenada de passos executáveis.
Podemos dizer que é uma lista, como por exemplo as suas tarefas mensais descritas.
6- O que é um fluxograma? INÍCIO
É uma descrição precisa e detalhada de um algoritmo, feita numa notação que combina elementos gráficos e textuais.
Em um fluxograma, os passos de um algoritmo são representados por símbolos e a ordem de execução desses passos é representada por setas conectando os símbolos. Cada símbolo pode conter uma anotação indicando sua finalidade específica.
EXEMPLO 1: (Algoritmo, Fluxograma e Programa em Pascal):
Dadas as duas notas de um aluno, calcule sua média aritmética e informe a sua situação (aprovado ou reprovado), levando em conta que a média para aprovação deve ser pelo menos 6,0.
RESOLUÇÃO:
NOTA: A seta significa a tecla Enter
Analisando a tela de execução, podemos perceber que os seguintes passos são necessários para resolver o exemplo 1: (Algoritmo)
1º passo: Exibe uma mensagem ao usuário, solicitando a digitação das notas.
2º passo: Lê os dados digitados pelo usuário e os armazena nas variáveis a e b.
3º passo: Calcula a média dos valores em a e b, armazenando o resultado em c.
4º passo: Exibe uma mensagem indicando que a média é o valor guardado em c.
5º passo: Se o valor da variável c for maior ou igual a 6,0, exibe a mensagem "Aprovado"; senão, exibe a mensagem "Reprovado".
Nota: Variável é todo dado manipulado pelo computador e que pode ser alterado pelo algoritmo, armazenado em alguma posição da memória, deve ser representada por um nome iniciado com letra e composto exclusivamente por letras, dígitos e sublinhas, devem ser escritos sem aspas (" ").
7- Quais são as três estruturas de controle básicas de um programa em Pascal? INÍCIO
São:
Sequêncial ou simples- São executados sequencialmente, na ordem em que são especificados.
Seleção ou condicional- São executados dependendo de uma determinada condição. (estruturadas)
Repetição- São executados dependendo de uma determinação condição, repetindo o necessário.(estruturadas)
8- Quais são as palavras inglesas principais para iniciar um programa em Pascal? INÍCIO
PROGRAM- É a primeira palavra usada em um programa em Pascal, significa em português PROGRAMA. Usa esta palavra seguida de um nome para o programa (sua escolha), finalizando com um ponto e vírgula (;)
VAR- É a segunda palavra usada na linguagem Pascal, significa variável, como já foi dito deve ser representada por um nome iniciado com letra e composto exclusivamente por letras, dígitos e sublinhas, devem ser escritos sem aspas (" ") ou apóstrofos (' ') e separadas por vírgulas. Seguidos de dois ponto (:), tipo de dados (Inteiro (Integer), Real (Real), Carácter (char)...) e dois pontos (;).
Nota: A variável pode ser modificada em qualquer momento.
BEGIN- Significa em português INÍCIO. É o início da execução do programa em Pascal (a partir desta parte, começa a ser exibido ao usúario o programa), esta palavra não deve ser precedida por ponto e vírgula (;).
WRITE ou WRITELN- É usada para escrever os dados de saída (dados que serão lidos pelos usuários), podem ser cadeia de caracteres (nomes), variáveis (declaradas), expressões e outros, os dados devem ser separados por vírgulas, se houver mais de um; Devem ser colocados dentro de parentes ( ( ) ) e de apóstrofos (' '), devem conter ponto e vírgula (;) após a sua declaração.
Nota: A diferença entre o uso de WRITE e WRITELN se dá pela apresentação na tela, WRITE dados e resposta são dispostos na mesma linha e WRITELN dados em uma linha e resposta em outra.
READ ou READLN- É usada para fornecer ao programa os dados de entrada (dados armazenados no computador), ou seja sempre serão utilizados as variáveis que foram declaradas, os dados devem ser separados por vírgulas, devem ser colocados dentro de parentes ( ( ) ) e não devem ser colocados dentro de apóstrofos (' ') devem conter ponto e vírgula (;) após a sua declaração.
Nota: A diferença entre o uso de READ e READLN se dá pela apresentação na tela, READ resultado é disposto na mesma linha e READLN resultado em outra.
END- É a palavra que indica o fim de um programa ou de uma seção, deve conter ponto final no final da palavra (.) (se for o fim do programa) ou ponto e vírgula (;)(se o programa for continuar)
9- O que são comentários? INÍCIO
É a introdução de lembretes (textos ou palavras entre os símbolos "(* *)"), para o próprio programador (não é mostrado para o usuário), são ignorados pelo computador.
10- O que é compilação e execução de um programa? INÍCIO
Compilação- é a verificação de erros feita pelo computador.
Execução- é feita após compilar o programa, introduzindo as entradas necessárias, testando assim a eficiência do programa.
Deve-se editar e gravar o programa, teclando a seguir as teclas Ctrl-F9 ou escolher a opção RUM do menu RUM, assim o programa poderá ser compilado e executado.
Nota: Só acontecerá a execução se a compilação for bem sucedida, caso contrário aparecerá mensagens de erro, sobreposta à listagem do programa indicando onde há erro e o tipo de erro.
11- Quais são os operadores aritméticos em uma programação Pascal? INÍCIO
| Operador Aritmético | Objetivo | Tipo de operandos | Tipo de resultado |
|---|---|---|---|
| Operador Aritmético | Objetivo | Tipo de operandos | Tipo de resultado |
|---|---|---|---|
Nota:
1- Os operadores de divisão (/ e DIV) e o operador MOD requerem que o segundo operador não seja zero.
2- Nos dados tipo REAL, não usa-se os operadores aritméticos (DIV) e (MOD).
12-Quais caracteres são usados em Pascal? INÍCIO
Utiliza-se letras de A a Z (tanto maiúsculas como minusculas), dígitos de 0 a 9. Os símbolos especiais são os seguintes:
13- O que são estruturas de controle simples ou sequencial? INÍCIO
É a estrutura mais simples que um programa pode ter. Nessa estrutura os passos do programa são executados, um a um, na ordem em que são especificados. É fundamental para a construção de todo e qualquer programa. É composta por:
Entrada de dados- que lê os dados digitados pelo usuários e os armazenam em posições de memória representadas por variáveis.
Processamento- que calcula expressões compostas por constantes e variáveis e armazena seus resultados em outras variáveis.
Saída de dados- que exibe no vídeo os resultados dos cálculos efetuados.
14- Como faço para achar a raiz quadrada e o quadrado de um número em Pascal? INÍCIO
Usa-se a função sqrt para raiz e sqr para a potência.
15- Quais são os tipos de dados? INÍCIO
1- DADOS DO TIPO SIMPLES
a) Padrão
Inteiro (INTEGER);
Real (REAL);
Carácter (CHAR);
Booleano (boolean).
b) Definidos pelo utilizador
Ordenados (SUBCONJUNTOS ORDENADOS);
Subconjuntos (SUBCONJUNTOS ENUMERADOS).
2- DADOS DO TIPO CADEIA (STRING)
3- DADOS DO TIPO ESTRUTURADO
Matrizes (ARRAYS);
Registros (RECORDS;
Conjuntos (SETS);
Ficheiros (FILES).
4- DADOS DO TIPO APONTADOR (POINTER).
16- Poderia falar mais sobre o tipo booleano (boolean)? INÍCIO
São quantidades que são ou verdadeiro (TRUE) ou falsas (FALSE). Nesta categoria estão incluídas constantes tipo booleano, variáveis, funções e expressões.
Nota: Usa-se as palavras inglesas OR (OU), AND (E) e NOT (não), para aplicar comparações.
17- O que são estruturas de controle Seleção ou Condicional? INÍCIO
É a estrutura que permite indicar passos que devem ser executados de forma mutuamente exclusiva, dependendo de uma determinada condição.
São divididas em duas estruturas:
- IF ou IF-THEN;
- CASE.
ESTRUTURA IF ou IF-THEN
Em português a palavra IF significa SE e THEN significa ENTÃO.
O valor deve ser específicado para que tenha uma condição lógica (ou verdadeiro ou falso)
Esta estrutura é dividida em duas formas diferentes (1ª- usa-se apenas o IF-THEN e 2ª- Usa-se IF-THEN e ELSE (Senão), pode ser simples ou estruturas, embora seja muitas vezes uma instrução composta. Podemos dizer que:
IF- Expressão booleana (expressão de escolha);
THEN- Instrução 1;
ELSE- Instrução 2.
Este programa calcula a média de um certo aluno, sendo a nota mínima para a aprovação 6,0
Este programa calcula o indíce de massa corpórea, sendo o mínimo 30
Nota: Lembrem-se que a variável é escolhida por vocês. veja que após a instrução THEN e ELSE não deve ser colocado ponto e vírgula(;) e também antes de ELSE. A instrução ELSE pode ser usada várias vezes em um mesmo programa.
ESTRUTURA CASE
Em português a palavra CASE significa CASO e OF significa DE (Caso de).
A opção é escolhida dentro de um grupo de instruções conhecidas como seletor.
Este programa informa o sexo escolhido por extenso
Este programa informa o dia do ridízio de veículos, a partir da placa fornecida pelo usuário.
Este programa informa o dia do ridízio de veículos, a partir da placa fornecida pelo usuário.
18- Exercícios (sequência) INÍCIO
A- Dado um número real qualquer, informe qual é o seu dobro?
B- Dado o total de vendas de um vendedor, calcule a sua comissão. Suponha que a comissão do vendedor seja de 10% (0,10%) do total das vendas.
C- Dados as medidas de uma sala em metros (comprimento e largura), informe a sua área em metros quadrados.
D- Dados um salário e um percentual de reajuste, calcule o salário reajustado. Considere que o percentual de reajuste é dado por um número real entre 0 e 1. Por exemplo, se o reajuste for de 15%, o usuário deve digitar o número 0,15.
E- Dados o valor da compra e o percentual de desconto, calcule o valor a ser pago. Considere que o percentual de desconto é um número real entre 0 e 1.
F- Dados um valor em real e a cotação do dolar, converta esse valor em dólares.
G- Dada uma distância percorrida (em quilômetros), bem como o total de combustível gasto (em litros), informe o consumo médio do veículo.
H- Dadas as medidas de uma sala em metros (comprimento e largura), bem como o preço do metro quadrado de carpete, informe o custo total para forrar o piso da sala.
I- O índice de massa corpórea (IMC) de uma pessoa é igual ao seu peso (em quilogramas) dividido pelo quadrado de sua altura (em metros). Dados o peso e a altura de uma pessoa, informe o valor de seu IMC.
J- Dado o tamanho de um arquivo (em bits), bem como a velocidade da conexão (em bits por segundo), informe o tempo necessário para o download do arquivo.
L- Dados um capital C, uma taxa de juros mensal fixa J e um período de aplicação em meses M, informe o montante F no final do período.
NOTA: Caso a execução do programa esteja rápida, digite mais um WRITELN com um ponto e vírgula no final do programa antes do END final, assim você terá chance de verificar a execução.
INÍCIOÉ uma variável que ocorre em ambos os lados de uma atribuição e que, antes de ser usada pela primeira vez é iniciada com um valor específicado.
20- O que é um contador?INÍCIO
É um tipo de acumulador, cujo valor aumenta ou diminui de 1 em 1.
21- O que são Estruturas de Repetição?INÍCIO
São instruções consecutivas executadas repetidamente até que uma condição lógica tenha sido satisfeita.
22- Quais os tipos de estruturas de contrôlo repetitiva?INÍCIO
São três:
1ª FOR-TO-DO;
2ª WHILE-DO;
3ª REPEAT-UNTIL.
23- O que são laços condicionais (conditional looping)?INÍCIO
Ocorre quando não são conhecido antecipadamente o número de repetições necessárias.
24- O que são laços incondicionais (inconditional looping) ou simples laços?INÍCIO
Ocorre quando são conhecido antecipadamente o número de repetições necessárias.
25- Para o que é usada a ESTRUTURA FOR (repetição contada)?INÍCIO
É usada para efetuar um laço incondicional em Pascal, ou seja, serve para repetir a execução de um comando por um determinado número de vezes.
Usa-se um CONTADOR para determinar o total de repetições desejadas.
Como funciona:
1º O contador é iniciado com um valor específico;
2º O contador é testado: se o total de repetições ainda não foi atingido, a repetição continua, caso contrário, ela termina. A cada nova repetição o contador é alterado 1 em 1.
NOTA:
1- A variável de contrôlo (contador) não pode ser tipo REAL, deve ser do tipo inteira ou uma definida pelo utilizador;
2- O valor 1 deve ser maior que o valor 2, pois se for menor não será executado a tarefa e se for igual executará apenas uma vez;
3- Para exibir a variável de contrôlo em ordem decrescente, basta trocar o TO por DOWNTO, decrarando os valores 1 e 2 de forma inversa, ou seja, o valor 1 maior que o valor 2.
26- O que é a ESTRUTURA WHILE-DO (Repetição com precondição ou poscondição)?INÍCIO
É uma estrutura de contrôlo repetitiva, que é usada para efetuar laços condicionais, ou seja, não são conhecido antecipadamente o número de repetições necessárias.
Como funciona:
1º O contador é iniciado com um valor específico;
2º O contador é testado: até que uma determinada condição se torne falsa.
NOTA:
1- Não pode ter valor composto, pois a expressão booleana se torna falsa, terminando assim o laço;
2- Não pode conter um valor menor que o valor declarado para iniciar o contador, como no exemplo o valor não pode ser menor que 1;
3- Pode-se fazer um programa onde o usuário confirma ou nega a continuação da execução.
27- O que é a ESTRUTURA REPEAT-UNTIL?INÍCIO
É uma estrutura parecida com a WHILE-DO, é também uma estrutura de contrôlo repetitiva, que é utilizada para efetuar laços condicionais, ou seja, não são conhecido antecipadamente o número de repetições necessárias.
Como funciona:
1º O contador é iniciado com um valor específico;
2º O contador é testado: até que uma determinada condição se torne falsa.
NOTA:
1- Não pode ter valor composto, pois a expressão booleana se torna falsa, terminando assim o laço;
2- Não pode conter um valor menor que o valor declarado para iniciar o contador, como no exemplo o valor não pode ser menor que 1.
28- O que é uma instrução GOTO?INÍCIO
Uma instrução em Pascal é constituída por uma instrução propriamente dita ou por um grupo de instruções que fazem que o computador efetue uma determinada tarefa.
Há dois tipos básicos em Pascal:
1- Simples- são únicas e incondicionais;
2- Estruturada- consiste em uma sequência de duas ou mais instruções consecutivas, encaixadas dentro das palavras BEGIN e END, separadas por ponto e vírgula. As instruções individuais que formam a instrução composta podem ser simples ou estruturadas.
Dentro destas instruções estruturadas, WRITE por exemplo é uma instrução simples.
Assim a instrução GOTO é de tipo simples, que é usada para alterar a sequência de um programa, transferindo o seu contrôlo para uma determinada parte do programa.
29- O que são identificadores?INÍCIO
Um identificador é um nome dado a um elemento de um programa, tal como uma constante, uma variável, um procedimento ou um programa
Os identificadores consistem em letras ou dígitos dispostos por qualquer ordem, deve ser iniciado com letras maiúsculas ou minúsculas.
30- O que é uma constante?INÍCIO
Constante é um valor que não pode ser alterado durante a execução do
programa, sendo que seu tipo é definido por seu conteúdo.
Sintaxe:
const
identificador = expressão;
31- Apostila completa em PDF de Técnicas de Programação e Linguagem Pascal. INÍCIO
PERGUNTAS INTRODUTÓRIAS
1- O que significa a sigla HTML?
2- O que preciso para iniciar o estudo em HTML?
3- O que um iniciante precisa fazer para começar o estudo do HTML?
4- O que são códigos fonte?
5- O que é uma TAG ou etiqueta?
6- O que são comentários?
7- Quais são as TAGs mais importantes do HTML?
8- Qual é a palavra inglesa usada para colocar cor no fundo, nos textos, nas tabela e em outros lugares da página?
9- Como formatar letras e textos em HTML?
10- Como colocar cor no fundo de uma página?
11- Como colocar imagens em uma página?
12- Como posso colocar listas em uma página?
13- Como posso colocar tabelas em uma página?
14- Como posso colocar LINK em uma página?
15- Como posso colocar uma mensagem sobre uma imagem ao passar o cursor?
16- Como posso colocar uma mensagem sobre um texto ao passar o cursor (abreviatura)?
17- Por quê todos os códigos fontes que vejo na web não começam apenas com a tag HTML?
18- Para que serve a TAB BDO?
19- Para que serve a TAG CODE?
20- Para que serve a TAG DEL?
21- Para que serve a TAG INS?
22- Para que serve a TAG DFN?
23- Para que serve a TAG KBD?
24- Para que serve a TAG OBJECT?
Respostas
1- O que significa a sigla HTML? INÍCIO
HTML- São siglas de Hypertext Markup Language, palavras inglesas que siguinificam em português Linguagem de Marcação de Hipertexto.
É uma linguagem voltada para a criação de páginas na web (sites).
Com ela é possível criar marcações no conteúdo da página.
2- O que preciso para iniciar o estudo em HTML? INÍCIO
Para escrever as páginas em HTML, pode-se usar:
2.1- Software de uso específico
- FronPage;
- DreamWave;
- Nvu.
2.2- Editores de texto simples
- NotPad;
- WordPad;
- Kwrite;
- Kedit;
- Emacs;
- Bloco de notas.
NOTA: Nesse nosso estudo vamos usar o bloco de notas, pois é de fácil acesso.
Ao salvar os documentos em HTML, deve-se usar a extensão ponto (.) HTML.
Veja o exemplo abaixo:
3- O que um iniciante precisa fazer para começar o estudo do HTML? INÍCIO1
Deve-se criar uma nova pasta em seu documento, onde serão guardados todos os documentos, que serão usados nas páginas, como por exemplo imagens e arquivos com extensão HTML.
4- O que são códigos fonte? INÍCIO
É o resultado da construção de um site, para exibí- lo abra uma página na web, vá na BARRA DE MENUS/ clique em EXIBIR/ clique em CÓDICO FONTE ou use o lado direito do mouse na página e clique em EXIBIR CÓDIGO FONTE DA PÁGINA. Muitos sites possuem o seu códico fonte aberto permitindo a copia para um editor de texto.
NOTA: A cópia deste conteúdo não significa que terá um site completo, pois um site é composto por várias páginas, com muitos HIPERTEXTOS e HIPERLINKS e também vários sites possuem a maioria das suas páginas com extensão CSS (conteudo externa a página).
- HIPERTEXTO- é uma palavra cujo siguinificado está ligado à ideia de um texto que apresenta vários caminhos leituras, cujas partes estão interligadas através de LINKS.
- HIPERLINKS ou LINKS- São elementos clicáveis que nos permite acessar outras páginas ou arquivos na web.
5- que é uma TAG ou etiqueta? INÍCIO
São palavras ou letras colocadas entre os sinais (<) menor que e (>) maior que, a maioria precisam de TAGs de aberturas e fechamentos, a TAG de fechamento utiliza o caractere barra ( / ). Veja o exemplo abaixo:
6- O que são comentários? INÍCIO
É um texto explicativo que pode ser inserido no código. Este texto não interfere no código e não é executado e nem exibido pelo browser (navegador). Sua função é servir de lembrete ou explicação.
É colocado entre os sinais menor que (<) e maior que (>), acrescentando antes do texto um ponto de interrogação (!), seguido de dois traços (--) e após o texto coloca-se dois traços (--).
Veja abaixo:
7- Quais são as TAGs mais importantes do HTML? INÍCIO
ESTRUTURA BÁSICA
A sequência de uma página construída com a linguagem HTML, deve seguir uma sequência das seguintes TAGs:
- HTML- TAG que inicia o HTML ( Não aparece na página);
- HEAD- TAG que inicia o cabeçalho da página (Não aparece na página);
- TITLE- TAG que informa o título da página (Faz parte do cabeçalho ou seja não aparece na página apenas na barra de título);
- BODY- TAG que mostra o corpo da página, nela é colocada os títulos, as imagens, os texto que devem ser exibidos na página.
NOTA: Todas estas TAGs devem conter uma TAG de abertura e uma TAG de fechamento, de acordo com o exemplo à cima.
8- Qual é a palavra inglesa usada para colocar cor no fundo, nos textos, nas tabela e em outros lugares da página? INÍCIO
Usa-se a palavra color seguida do sinal de igual (=), seguida dos valores, entre aspas (").
Veja o exemplo abaixo:
Muitas TAGs possuem atributos, veremos mais para frente.
NOTA: Os valores do atributo color pode ser escritos em inglês (cor em inglês), mas é indicado o uso destes valores em hexadecimas, pois serão mostrados por todos os browser (navegadores>. Veja a tabela abaixo:
| TABELA DE CORES ATRAVÉS DE VALORES HEXADECIMAIS | ||
|---|---|---|
|
| ||
|
| ||
|
| ||
|
| ||
|
| ||
9- Como formatar letras e textos em HTML? INÍCIO
DEFININDO FONTES
Usa-se a TAG FONT para definir tamanhos, cores e tipos diferentes. Veja abaixo:
- SIZE: indica o tamanho da fonte que varia de 1 a 7, sendo 3 o valor padrão da maioria dos browser (navegadores).
- FACE: indica o nome da fonte utilizada. As fontes padrões da maioria dos browser (navegadores) são: ARIAL, TIMES NEW ROMAN, GEORGIA, COURIER, VERDANA.
- COLOR : define a cor da fonte do texto, com o valor escrito em inglês ou em hexadecimal
Veja abaixo:
NOTA: Os atributos e os seus valores, podem ser usados separadamente.
ESTILO DE TEXTOS
São inseridos entre os textos, devem conter uma TAG de abertura e uma TAG de fechamento. Veja abaixo:
Veja o código fonte abaixo:
ALINHAMENTO
O alinhamento é feito pela TAG P seguida do ATRIBUTO ALIGN e o VALOR entre aspas ("). Veja abaixo:
TEXTO PRÉ FORMATADO
Mostra o texto como foi digitado, usa-se a TAG PRE de abertura antes do texto e a TAG PRE de fechamento após o texto. Veja abaixo:
PARÁGRAFO
usa-se a TAG P logo após o texto que deseja que se tenha um parágrafo (pula para outra linha com um certo espaço). Veja abaixo:
Não é necessário uma TAG de fechamento
QUEBRA DE LINHA
Usa-se a TAG BR após o texto que deseja que se tenha uma quebra de linha (pula para outra linha sem espaço). Veja abaixo:
Não é necessário uma TAG de fechamento
SEPARADOR DE LINHA
Usa-se a TAG HR após o texto que deseja que se tenha uma linha HORIZONTAL. Veja abaixo:
Não é necessário uma TAG de fechamento
NOTA: Não esqueça de colocar as TAGs de parágrafo ou de quebra de linha, antes de acrescentar a TAG HR. No decorrer do nosso estudo você verá como introduzir cor, largura e espessura na linha horizontal. Veja abaixo alguns exemplos:
Introdução de uma linha horizontal centralizada com o tamanho de 50% de largura, espessura "7" e cor vermelha. veja abaixo:
Introdução de uma linha horizontal com o tamanho de 100% de largura, espessura "4" e cor preta. veja abaixo:
Introdução de uma linha horizontal centralizada com o tamanho de 70% de largura, espessura "5" e cor azul. veja abaixo:
CABEÇALHO
São usados para títulos e sub-títulos de uma texto da página. A
linguagem HTML possui seis níveis de cabeçalhos, numerados de 1 a 6; quanto menor o nível, maior será
o destaque, são exibidos em letras maiores e em negrito. Use-se a TAG H seguda de um número que começa pelo 1, deve possuir uma TAG de abertura e uma TAG de fechamento. Veja abaixo:
| |
| |
| |
Texto | |
| |
|
NOTA: Pode-se colocar cor no título para isso basta usar a TAG FONT com o atributo color e o valor.
10- Como colocar cor no fundo de uma página? INÍCIO
Usa-se o atributo bgcolor seguido do sinal de (=) e o valor (cor) entre aspas ("), dentro da TAG BODY. Veja abaixo:
Veja abaixo o código fonte:
Fundo Vermelho |
11- Como colocar imagens em uma página? INÍCIO
Usa-se a TAG IMG e o atributo SRC, seguido do sinal de igual (=) e o valor (deve ser o nome da imagem e sua extensão jpg, gif...). Veja abaixo:
NOTA: Esta TAG deve ter abertura e fachamento, caso não tenha nenhum texto, está deve ser fechada na sequencia da abertura.
DIMENSIONANDO IMAGENS
Usamos dois atributos seguidos dos seus valores:
- Widht=”n”: indica a largura da imagem em pixels ou em percentagens;
- Height=”n”: indica a altura da imagem em pixels ou em percentagens.
Veja abaixo:
ALINHAMENTO EM RELAÇÃO AO NAVEGADOR
Usa-se o atributo ALIGN seguido do sinal de igual (=) e o valor(uma posição direita, esquerda, centro...) entre aspas (").
- LEFT: alinha a imagem a esqueda. (posição padrão dos navegadores).
- RIGHT: alinha a imagem a direita.
NOTA: Para alinhar ao centro use a TAG CENTER antes da TAG de abertura IMG, não esquecendo de fechá-la logo após a TAG de fechamento IMG.
ALINHAMENTO EM RELAÇÃO AO TEXTO
Em relação ao texto podemos utilizar os seguintes alinhamentos: TOP, BOTTOM e MIDDLE.
Onde:
- TOP: alinha o texto com o topo da imagem;
- MIDDLE: alinha o texto com o centro da imagem;
- BOTTOM: alinha o texto com o rodapé da imagem.
NOTA: Estes textos devem ser escritos após a TAG de abertura. veja o codigo abaixo:
IMAGEM COM FUNDO
Usa-se o atributo background mais o sinal de igual (=) e o valor (nome do arquivo de imagem e a extensão jpg, gif...) entre aspas ("), dentro da TAG BODY. Veja abaixo:
NOTA: Usa-e o atributo bgpropertieis caso queira manter a imagem fixa na página.
12- Como posso colocar listas em uma página? INÍCIO
Usa-se a TAG UL seguida da seguinte TAG:
- LI- para listas não numeradas;
Usa-se a TAG OL seguida da seguinte TAG:
- OL- para listas numeradas.
Veja o código abaixo:
|
13- Como posso colocar tabelas em uma página? INÍCIO
Usa-se a TAG TABLE seguida das seguintes TAGs:
- TR- define as linhas de uma tabela;
- TH- define a célula título de uma tabela, é exibida em negrito;
- TD- define as células de uma tabela.
Para colocar borda em uma tabela, deve-se usar o atributo BORDER, seguido do sinal de igual (=) e o valor (que deve ser um número pequeno), entre aspas ("), dentro da TAG TABLE.
Para colocar cor na borda deve-se acrescentar o atributo BORDERCOLOR, seguido do sinal de igual (=) e o valor (que deve ser uma cor, igual na cor do fundo), entre aspas ("), dentro da TAG TABLE .
Para colocar cor dentro de uma tabela ou célula, de-se usar o atributo BGCOLOR, seguido do sinal de igual (=) e o valor (que deve ser uma cor igual na cor do fundo)), entre aspas ("), dentro da TAG que deseja por a cor.
Para alinhar uma tabela deve-se usar o atributo ALIGN, seguido do sinal de igual (=) e o valor (que deve ser uma posição como vimos no alinhamento ou se for centralizar use a TAG CENTER antes da TAG de abertura da tabela (TABLE) ), entre aspas ("), dentro da TAG TABLE.
Para definir um tamanho para uma tabela ou célula, deve-se usar os atributos width ou height, seguido do sinal de igual (=) e o valor (que deve ser um número (pixels ou em percentagens, como vimos na questão 11)), entre aspas ("), dentro da TAG TABLE
Para definir o espaço entre as células, usa-se o atributo CELLSPACING.
Para definir a margem dentro das células, usa-se o atributo CELLPADDING.
Para definir junções de células, usa-se o atributo COLSPAN mais o sinal de igual (=) e o valor entre aspas (") para expandir uma célula e usa-se o atributo ROWSPAN mais o sinal de igual (=) e o valor entre aspas (") para expandir uma linha.
Veja abaixo:
| TABELA |
|---|
| Primeira linha |
| Segunda linha |
| Terceira linha |
| Quarta linha |
| Quinta linha |
| CÉLULAS | ||
|---|---|---|
| 1 | 2 | 3 |
| CÉLULAS | 1 | 2 | 3 |
| 1 | 2 | 3 |
14- Como posso colocar LINK em uma página? INÍCIO
Como já foi falado link é um meio de interligação de páginas ou conteúdo de uma página.
ANCORAS
São links que utilizamos quando queremos interligar conteúdos da mesma página.
Para criarmos uma âncora selecionamos um local da página para inserí-la. Veja abaixo:
Com essa tag você inserirá uma imagem ou texto que indicará ao usuário que ao clicar neste
tipo de link, este irá guiá-lo até o local onde foi inserida a âncora.Veja abaixo:
NOTA: Se for uma pergunta e uma resposta, utilizamos o segundo exemplo na pergunta e o primeiro exemplo na resposta, assim quando clicarmos na pergunta, logo a página será direcionada para a resposta.
INTERLINGANDO URL's
Para criarmos um link para qualquer endereço localizado na internet, utilizamos uma URL.
URL é a abreviação de Uniform Resource Locator, que tem a função de especificar a
localização de páginas ou arquivos em servidores da WEB.
A URL é composta de duas partes:
- O protocolo Internet do documento;
- O endereço do servidor da página.
- O protocolo: é o tipo de servidor que está sendo acessado;
- HTTP: = Hiper Text Transfer Protocol, é um servidor da www.
- FTP: = File Transfer Protocol, é um serviço para a troca de arquivos, programas entre o servidor e o computador remoto.
- Servidor: = Entenda como servidor o computador onde a página está localizada.
- Arquivo: = o arquivo que deseja ser visualizado, podendo ser um diretório e o nome do arquivo.
LINKS PARA E-MAILS
É possível colocar links para e-mail em páginas HTML. Ao clicar sobre o link do e-mail, abrirá o
programa de envio de e-mail, podendo ser este o OULTLOOK EXPRESS ou outro que estiver configurado
no computador.
Onde:
- mailto = informa ao navegador que o link é para e-mails;
- endereço = deverá ser informado o e-mail que será direcionada as mensagens.
INTERLIGANDO DOCUMENTOS EM OUTROS DIRETÓRIOS
Para interligar documentos em outros diretórios é necessário apenas indicar o caminho
completo da localização do mesmo.
NOTA: A barra utilizada para separar diretórios é a barra convencional ( / );
O diretório atual será sempre o ponto de partida para buscarmos arquivos em outro
diretório;
Caso o arquivo esteja localizado em outros níveis de diretórios, utilizamos “.. / ”.
15- Como posso colocar uma mensagem sobre uma imagem ao passar o cursor? INÍCIO
Usa-se o atributo ALT mais o sinal de igual (=) e a mensagem entre aspas ("), dentro da TAG IMG. Veja abaixo:
16- Como posso colocar uma mensagem sobre um texto ao passar o cursor (abreviaturas)? INÍCIO
Usa-se a TAG ABBR seguida do atributo title mais o sinal de igual (=) e a definição da abreviatura entre aspas ("). Veja abaixo:
17- Por quê todos os códigos fontes que vejo na web não começam apenas com a tag HTML? INÍCIO
Isso ocorre, pois o HTML que apresentamos é apenas um modo fácil de aprender, ou seja, o HTML possui atualizações, como por exemplo:
HTML 4.01- é mais antiga e a sua declaração na tag HTML é:
HTML 5- é mais moderno e usa um um código totalmente reduzido. veja abaixo:
18- Para que serve a TAG BDO? INÍCIO
Define a direção do texto na tela, usa-se o atributo dir seguido do sinal de igual (=) e entre aspas (") os valores ,que podem ser:
- ltr- left to right = da esquerda para a direita;
- rtl- right to left = da direita para a esquerda.
Veja abaixo:
TEXTO TEXTO TEXTO |
NOTA: veja que o valor ltr são os tipos de textos apresentados pelos navegadores.
19- Para que serve a TAG CODE? INÍCIO
É usada para apresentar texto com fonte monoespaçada (caracteres que possuem o mesmo tamanho).
20- Para que serve a TAG DEL? INÍCIO
É usada para apresentar texto riscado, tem o mesmo efeito da TAG STRIKE.
21- Para que serve a TAG INS? INÍCIO
Apresenta um texto sublinhado é parecida com a TAG U é quase sempre usada com a TAG DEL.
22- Para que serve a TAG DFN? INÍCIO
Usa-se para definir um texto como definição, parecido com a TAG I (texto em itálico).
23- Para que serve a TAG KBD? INÍCIO
Usa-se para indicar uma tecla para o usuário possa executar alguma ação. Veja abaixo:
24- Para que serve a TAG OBJECT? INÍCIO
Serve para incorporar objetos de mídia externos. Usa-se o atributo data seguido do nome do arquivo e a sua extensão (PDF, ÁUDIO, TXT, CSS, HTML, JAVA, MP3, MP4, WAV,VÍDEO, JPG, PNG, SWF...), entre aspas ("). Veja abaixo:
PERGUNTAS INTRODUTÓRIAS
1- Qual é o significado da abreviação em inglês de CSS?
2- Qual é o significado de CSS em português?
3- Quem criou o CSS?
4- Qual é o significado da abreviação em inglês de W3C?
5- Qual é o significado de W3C em português?
6- Qual é o conceito de CSS?
7- Onde edito os códigos CSS?
8- O que preciso para aprender o CSS?
9- Como insiro os códigos CSS?
10- Quais são as partes da sintaxe do CSS?
11- Por que devo usar o CSS, se o HTML faz todas estas mudanças (layout)?
12- Como coloco cor de fundo em uma página com o método importado?
13- Como coloco imagem em uma página com o método importado?
Respostas
1- Qual é o significado da abreviação em inglês de CSS? INÍCIO
Cascading Style Sheets.
2- Qual é o significado de CSS em português? INÍCIO
Folha de Estilo em Cascata.
3- Quem criou o CSS? INÍCIO
Foi criada pelo W3C, um consórcio formado por empresas de tecnológia que criam padrões de apresentação de conteúdos na web.
4- Qual é o significado da abreviação em inglês de W3C? INÍCIO
World Wide Web Consortium.
5- Qual é o significado de W3C em português? INÍCIO
consórcio de Rede Larga para o Mundo.
6- Qual é o conceito de CSS? INÍCIO
É uma linguagem que serve para construir loyouts (esquemas), ou seja, para definir aparência de sites.
7- Onde edito os códigos CSS? INÍCIO
Podem ser editados no editor simples de texto (Bloco de Notas).
8- O que preciso para aprender o CSS? INÍCIO
É preciso ter conhecimento em HTML.
Usando HTML para colocar cor no fundo podemos fazer assim:
Com CSS o mesmo resultado será obtido assim:
9- Como insiro os códigos CSS? INÍCIO
Podem ser iseridos de duas (2) formas:
- Dentro do documento:
- In-line- Usa-se o atributo STYLE dentro da tag do HTML que deseja aplicar.
- Interno- Usa-se a TAG STYLE, depois da TAG de abertura HEAD e antes da TAG de fechamento HEAD
- Fora do documento:
- Importado- Para utilizar este método deve-se editar o código CSS em um bloco de notas e salvar com a extensão .CSS, este documento é um arquivo externo a página. Este método é o mais usado, pois torna o trabalho mais dinâmico e rápido.
PROCEDIMENTO:
- Faça dois (2) documentos no bloco de notas, salve na mesma pasta, o primeiro com a extensão" .html" e o outro com a extensão ".css", veja o exemplo à baixo: Documento 1
- Agora abra a pasta e o documento index.htm, você terá uma página com o fundo vermelho.
Salve este documento como index.html
Documento 2
Salve este documento como estilo.css
NOTA: Use letras minúsculas para editar os códigos CSS.
São três (3):
- Seletor- indica qual tag do HTML será aplicada a propriedade.
- Propriedade- é um elemento que está ligada à tag. No HTML o chamamos de "atributo".
- Valor- é ligado à propriedade, ou seja é a caracteristica que será atribuida à propriedade.
11- Por que devo usar o CSS, se o HTML faz todas estas mudanças (layout)? INÍCIO
- Com o CSS você pode mudar todo o seu site em apenas um minuto;
Imagine que você quer modificar o fundo de todas as páginas de seu site (tudo da mesma cor);
Com o HTML você teria que mudar o código fonte de cada página, com o CSS você mudaria apenas o valor da propriedade no documento (arquivo) ".CSS" - O CSS é mais sofisticado;
- Os códigos ficam ocultos no CSS evitando cópia total do seu código fonte.
Para modificar as cores dos textos, com o método importado siga os passos:
- Faça dois (2) documentos no bloco de notas, salve na mesma pasta, o primeiro 31.html e o outro 31.css.
Salve este documento com extensão HTML
Documento 2
Salve este documento com extensão CSS
NOTA: Caso queira que todas as suas páginas, usem o arquivo CSS específico introduza o mesmo endereço para todas, caso contrário use um novo nome para o arquivo CSS para cada uma.
13- Como coloco imagem em uma página com o método importado? INÍCIO
Basta aplicar a propriedade background-image ao elemento body e especificar o caminho para onde está gravada a imagem.
NOTA: Usa-se a propriedade background-attachment: fixed; para que a imagem fique fixa.
Pode-se usar mais de uma propriedade para um elemento. Veja:
Foi colocada um fundo e uma imagem no elemento body
Antes de ler este conteúdo, leia a apostíla de introdução ao HTML 4.01, neste mesmo blogger.
<A>- Criar hiperlinks.
Para publicar na web o cliente deve em primeiro lugar fazer o endereço de seu domínio (nome na internet) no site www.registro.com, que será cobrado uma taxa anual de aproximadamente R$30,00.
Deve-se Fazer as pastas (em HTML e CSS) e escolher um provedor específico, onde será cobrado uma taxa mensal.
| SERVIÇOS DE HOSPEDAGEM OFERECIDOS PELOS PRINCIPAIS PROVEDORES DO PAÍS: |
| |||||
|---|---|---|---|---|---|---|
|
| ||||||
|
|
| |||||
|
| ||||||
|
| ||||||
|
|
| |||||
Informações retirada da revista W | ||||||