My Opera e .CSS – Dica #1: Background

Eae pessoal, como não posso traduzir por causa que não estou no meu pc, ou seja não tenho páginas, eu vou postar lá de vez em quando algumas dicas de personalização do blog, pros que se interessam nisso.

Vamos editar o arquivo de estilo .CSS de sua página. Para tal, vá em Personalizar Aparência > Personalizar > Editar CSS

Lá haverá uma caixa em que você poderá postar seus códigos .css para editar seu blog. Na verdade você apenas irá alterar o que vem por padrão na página

BACKGROUND
Vamos aprender a por uns efeitos no plano de fundo do my opera, o background.

O elemento background serve pra qualquer elemento da página, mas como vamos fazer o plano de fundo, ele se encaixa na função body{}

Exemplo:

body { 
background-attachment: scroll;
background-clip: border-box;
background-color: rgb(17, 17, 17);
background-image: url("http://static.myopera.com/community/graphics/themes/114/bg.gif");
background-origin: padding-box;
background-position: 0% 0%;
background-repeat: repeat;
background-size: auto;
}

Códigos disponíveis:

  • background-attachment
    fixed; Fixa a imagem na tela. Por mais que você role o scroll do mouse o fundo não vai se mexer.
    scroll, inherite ou local; Tem basicamente a mesma função. O fundo não fica fixo na tela, somente à página. Se você rolar o mouse, ela vai desaparecer.
    ====================
  • background-clip
    border-box, padding-box, content-box ou inherite; Essa função não faz muita coisa. Na verdade, a olhos nus não faz nada
    ====================
  • background-color
    Há várias cores pré-definidas para o background-color em .css, mas você mesmo pode escolher a sua cor:
    rgb(*, *, *); (onde * é o valor) escolha uma cor apartir da tabela RGB
    #******; (onde ****** são os 6 códigos) Via código HTML de cor. Ex: #000000 (preto)
    ====================
  • background-image
    url("***"); Onde *** é o link da imagem
    none; Sem imagem de background.
    ====================
  • background-origin
    border-box, padding-box, content-box ou inherite; Essa função também não faz muita coisa.
    ====================
  • background-position
    Aqui é de onde vai começar o seu background (pelo canto superior esquerdo)
    center, left, right, top ou bottom; Respectiamente: centro, esquerda, direita, emcima ou embaixo.
    *px *px; Configure a posição por pixeis na horizontal e na vertical. Onde * é o valor em numeros.
    *% *%; Configura a posição pela porcentagem do tamanho da imagem na horizontal e na vertical. Onde * é o valor em numeros
    ====================
  • background-repeat
    no-repeat; O fundo não repete.
    repeat-x; O fundo repete-se horizontalmente
    repeat-y; O fundo repete-se verticalmente
    repeat, round ou inherite; O fundo repete-se horizontal e verticalmente
    space; O fundo repete-se horizontal e verticalmente, porém com espaços entre as repetições.
    ====================
  • background-size
    auto; A imagem usará seu tamanho original
    cover; A imagem se redimensionará proporcionalmente de forma que sua altura seja a mesma da página
    contain; A imagem se redimensionará proporcionalmente de forma que sua largura seja a mesma da página

Até a próxima!

17 Replies to “My Opera e .CSS – Dica #1: Background”

  1. Legal mas, contenha-se Bean, ninguém vai conseguir acompanhar seu blog se continuar fazendo postagens enormes todo dia que que tomar banho!! Você toma banho com muito mais frequência agora!!

  2. Filipe writes:Boa Bean, mas da pra combinar todas essas propriedades em uma única linha, ex:body { background: #fff url(‘img_tree.png’) no-repeat right top;}

  3. #include
    #include
    #include
    #include

    main(){

    char array[10][60];
    char busca[60];
    int acum[10]={0,0,0,0,0,0,0,0,0,0};
    int i=0,j,k=0;

    sprintf(array[0],”asa”);
    sprintf(array[1],”arvore”);
    sprintf(array[2],”arrancar”);
    sprintf(array[3],”arranjar”);
    sprintf(array[4],”arremessar”);
    sprintf(array[5],”bola”);
    sprintf(array[6],”bosta”);
    sprintf(array[7],”shit”);
    sprintf(array[8],”eae”);
    sprintf(array[9],”fuck”);

    do{

    printf (“nntInsira a palavra que voce quer buscar: %s”,busca);
    busca[i]=getch();
    system (“cls”);

    for (j=0;j0)){
    printf (“nt%s”,array[j]);
    acum[j]++;
    busca[i-1]=00;
    k=1;
    }
    }

    else if ((busca[i]==array[j][i])&&(acum[j]>0)&&(busca[i]!=127)&&(busca[i]!=8)){
    printf (“nt%s”,array[j]);
    acum[j]++;
    }

    }
    }
    if (k==0) i++;
    else { i=i-1; k=0;}
    }while(busca[i-1]!=’r’);
    }
    Ele tá imperfeito ainda, porque não consigo fazer ele apagar o que digita, mas a ideia inicial de ir filtrando as palavras já funciona 😀

  4. Originally posted by bean-gt:Mas isso é culpa dos ácaros! Malditos ácaros! Eles estão em mim por toda a parte! Eu não os vejo, mas estão!Bah, mas isso é fácil de se lidar, é só você ficar sem tomar banho por três meses, então você vai feder tanto que vai matar todos o ácaros em um raio de um frutometro de distância!! (True Story.) E Bean, também anda aprendendo linguagens de programação? Por que eu ultimamente também! Meu pai tem uns livros que ensinam Java, C++ e HTML, e você? (Atualmente uso o Bloodshed Dev-C++ para “praticar”)

  5. Woah!! 5000 linhas??!! Que legal!! 😀 Não entendi o que é a coisa pequena, mas você parece orgulhoso dela, então deve ser algo legal!

  6. Originally posted by caiozet:Legal mas, contenha-se Bean, ninguém vai conseguir acompanhar seu blog se continuar fazendo postagens enormes todo dia que que tomar banho!! Você toma banho com muito mais frequência agora!!Mas isso é culpa dos ácaros! Malditos ácaros! Eles estão em mim por toda a parte! Eu não os vejo, mas estão!Originally posted by anonymous:Boa Bean, mas da pra combinar todas essas propriedades em uma única linha, ex:body { background: #fff url(‘img_tree.png’) no-repeat right top;}yep, só deixei em linhas separadas pro pessoal poder compreender melhorE assim o código fica mais limpo tambem

  7. Bom, em C não dá pra se fazer muita coisa, masO trabalho final de Linguagem de Programação I que eu fiz com um colega teve 5000 linhas de código! /o/ficou algo realmente bome quanto a coisas pequenas, eu fiz um código que conforme você vai digitando, vai aparecendo (nomes em um agenda, por exemplo)

  8. Legal! 😀 Então no fim do ano que vem (se o mundo não acabar) você já poder programar que nem o Notch! O criador do jogo Minecraft! Sei disso por que ele fez live streaming dele mesmo programando um jogo do zero em 48 horas! Para o concurso Ludum Dare 48!! Aliás, que faculdade você frequenta? (Ou o que te ensinam nesse prédio cheio de grãos?)

  9. essas palavrasasa
    arvore
    arrancar
    arranjar
    arremessar
    bola
    bosta
    shit
    eae
    fuckpor exemplo, se você digitar ‘a’, na tela devem aparecer:asa
    arvore
    arrancar
    arranjar
    arremessarse depois voce digitar ‘r’, devem aparecer:arvore
    arrancar
    arranjar
    arremessarcompreende? vai filtrando.E sim, está programado pra fechar quando digita enteraqui:}while(busca[i-1]!=’r’);

  10. Ainda não compreendi nada, até testei no DEV C++ aqui, deve ser por que eu não entendo quase nada de C++ mesmo.. :ko: Digitei algumas coisas, apaguei umas coisas, e tentei digitar “fuck”, mas ainda não compreendi, e quando eu clico enter ele fecha. Vou tentar de outra forma.

  11. Ha, eu já tinha entendi bem agora a pouco, antes de você comentar isso, mas agora entendi melhor. 😀 Vou brincar um pouco com ele agora…

  12. Originally posted by bean-gt:Eu faço Ciência da Computação, a universidade não tem importância Era pra eu ter começado Ciência da Computação em 2009, mas problemas $$Técnicos$$ me impediram, to correndo atrás ainda…

Leave a Reply

Your email address will not be published. Required fields are marked *