Loading presentation...

Present Remotely

Send the link below via email or IM

Copy

Present to your audience

Start remote presentation

  • Invited audience members will follow you as you navigate and present
  • People invited to a presentation do not need a Prezi account
  • This link expires 10 minutes after you close the presentation
  • A maximum of 30 users can follow your presentation
  • Learn more about this feature in our knowledge base article

Do you really want to delete this prezi?

Neither you, nor the coeditors you shared it with will be able to recover it again.

DeleteCancel

Make your likes visible on Facebook?

Connect your Facebook account to Prezi and let your likes appear on your timeline.
You can change this under Settings & Account at any time.

No, thanks

Tutorial Oficial da Prezi - Tendo controle do Editor CSS

Ajuda em como utilizar o CSS. Este tutorial te ensinará como editar CSS e trocar cores, bordas e dar transparência.
by

Prezi em Português

on 12 June 2015

Comments (0)

Please log in to add your comment.

Report abuse

Transcript of Tutorial Oficial da Prezi - Tendo controle do Editor CSS

RECURSOS
UTEIS SOBRE CÓDIGOS HEXADECIMAIS
MUDAR
COR DE FUNDO
COR DE
LINHAS / SETAS
MUDAR COR DE MOLDURA

FAZER UMA FORMA TRANSPARENTE
Como editar
DICAS

http://color.hailpixel.com/
http://www.colorpicker.com/
http://cloford.com/resources/colours/500col.htm
Buscar a seleção que controla as molduras.

{começam com
frames.
}
Em seguida selecione s seguintes linhas:
gradStartColor: #número;
gradeEndColor: #número;
O número é o código hexadecimal da cor atribuída a moldura. Para alterar a cor, você precisa alterar este número.
gradStartColor: #
número
;

Clique em
Apply.
Dica!
Tente usar cores diferentes para o início (StartColor) e final (EndColor).
As linhas e setas sempre compartilham as mesmas cores.
{começar por
line-arrow.style
}
Procure as seguintes seções e altere o número de código hexadecimal que você deseja.
gradStartColor: #
número
;
gradEndColor: #
número
;
Mude também o código hexadecimal para a linha:
cor: #
número
;
Você pode usar até 5 estilos!
{estas seções começam por
shape.style
}
Para as formas, siga os mesmo passos que para as linhas e as setas.
Lembre-se de clicar em
Apply.
MUDAR
A COR DA BORDA
ATENÇÃO
As bordas não são mostradas nas linhas, mas eles são mostradas nas setas.
Dependendo da espessura, a borda pode fazer com que um retângulo tenha esquinas arredondadas.
As bordas são dimensionadas, ajustando o tamanho de um objecto.
As linhas NÃO mostram transparência; as setas sim.
Vá para a seção que controla a configuração da forma.
{você sabe o que fazer}
Desta vez, vamos adicionar as seguintes linhas:
gradStartAlpha: número entre 0-1;
gradeEndAlpha: número entre 0-1;
Para esta seção, vamos usar pontos decimais para especificar o nível de transparência.
{
.5
=
50%
transparente,
.6
=
60%
, etc.}

Siga os mesmo passos que para as molduras e setas.
Experimente com níveis diferentes de transparência gradEndAlpha e gradStartAlpha e conseguirá mais efeitos.
Não se esqueça de clicar em
Apply.
MUDAR O TAMANHO DA BORDA
Vá para a seção do tipo de objeto que você deseja editar.
{formas, moldura ou setas}
Localize a seguinte linha
borderColor: #número;

Substitua o código hexadecimal pelo número da cor que você deseja.
{Se a linha não for padrão,
adicione-a
}
borderColor: #número;

{formas, molduras e setas}
Vá para a seção do tipo de objeto que você deseja editar.
Procure a seguinte linha:
borderThickness: número;

{Se a linha não for padrão,
adicione-a
}
Ajuste o número para alcançar a espessura da borda que você deseja.
borderThickness:
número
;

{quanto maior o número = mais grossa}
Clique em
Apply.
Clique em
Apply.
Clique em
Apply.
Você pode remover a transparência de uma moldura, estabelecendo gradEndAlpha e gradStartAlpha 1.
CSS
Full transcript