Ir para conteúdo
MARCEL MENDES

HTML e CSS duvida com tabela

Recommended Posts

Boa noite

Gostaria de uma ajuda, sou iniciante, estou tentando fazer uma tabela que eu fiz em Excel, só que eu queria fazer em PHP ou Java script, alguém pode me ajudar a dar o pontapé inicial por onde começo! Sei que vai precisar de um banco de dados,

O que eu gostaria de fazer é o seguinte, o usuário admin entra na área restrita, que eu já fiz o login e sistema de cadastro em php, ele lança o time que vai competir e colocar gerar volante, ai o usuário normal quando abrir o volante no login dele faz o jogo e coloca enviar ou validar jogo, depois em uma data especifica o admin lança o resultado por uma outra página e coloca gerar vai gerar uma página de classificação de quem fizer mais pontos, assim colocação 1º João 2º Rafael etc... quantos mais resultados você acertar mais ponto você vai obter!

 

Segue a tabela abaixo, para melhor visualização.

tabela.PNG.1726d5e192e1d4be02f477f6c8d44377.PNG

Assim coluna 1 flamengo x botafogo eu marquei que botafogo vai ganhar, aonde você visualiza por um (X) se eu marcasse no meio seria empate e no lado esquerdo seria que o flamengo que sairia vitorioso. Bom sou iniciante e está difícil, mais quero aprender e por onde posso começar alguma ajuda desde já agradeço abraço a todos. 

 

Compartilhar este post


Link para o post
Compartilhar em outros sites

Da uma olhada nesse código aproveitei sua duvida pra treinar grid, vai ver nesse código um pouco de "sass" e a utilização de template e o uso dos elementos " dl, dd, dt " junto com grid layout. basicamente usei javascript, eu particularmente não gostaria de usar PHP com Javascript, nessa situação tendo em mente que existem muitos frameworks javascript, só usaria javascript no front.

 

https://jsfiddle.net/wanderval/6aLobnwg/2/

Compartilhar este post


Link para o post
Compartilhar em outros sites
6 horas atrás, wanderval disse:

Da uma olhada nesse código aproveitei sua duvida pra treinar grid, vai ver nesse código um pouco de "sass" e a utilização de template e o uso dos elementos " dl, dd, dt " junto com grid layout. basicamente usei javascript, eu particularmente não gostaria de usar PHP com Javascript, nessa situação tendo em mente que existem muitos frameworks javascript, só usaria javascript no front.

 

https://jsfiddle.net/wanderval/6aLobnwg/2/

Wandarval, primeiramente queria muito agradecer, não sei quanto tempo levou para fazer isso, mais fico show trabalho incrível. 

Compartilhar este post


Link para o post
Compartilhar em outros sites
Em 27/07/2019 at 21:24, wanderval disse:

Da uma olhada nesse código aproveitei sua duvida pra treinar grid, vai ver nesse código um pouco de "sass" e a utilização de template e o uso dos elementos " dl, dd, dt " junto com grid layout. basicamente usei javascript, eu particularmente não gostaria de usar PHP com Javascript, nessa situação tendo em mente que existem muitos frameworks javascript, só usaria javascript no front.

 

https://jsfiddle.net/wanderval/6aLobnwg/2/

Fiz o formularia que o admin vai fazer os jogos.

 

Coloquei os links mais não está puxando ! 

<script src="volante_user.js"></script>
<link rel="stylesheet" type="text/css" href="volante_user.css">

Compartilhar este post


Link para o post
Compartilhar em outros sites

eu tenho e-mail, mas acho mais fácil você me mandar mensagem privadas por aqui facilita eu sempre entro aqui.

eu aconselho você estudar pela plataforma udemy, o código que fiz foi utilizado apenas javascript sem uso de jquery, mas poderia ter cido construido usando framework ai iria ficar show, mas tudo ao seu tempo.

 

1- faça um curso de java script puro

2- faça um curso de algum framework javascript ex: (Angular +2 ou acima, Vue.js ou React)

 

geralmente eu não peço mas da um joinha na minha resposta ai ninguém da pra dar como resolvido o problema kkk

 

sobre o css o problema e que eu escrevi usando o formato scss que é sass tem que converter pra css comum pra poder utilizar!

 

 

o codigo css puro seria esse aqui:

 

.table-game dd:hover input ~ .checkmark, input[type="radio"]:checked ~ .checkmark {
  width: 100%;
  height: 100%;
  justify-content: center;
  align-items: center;
  display: flex;
  background: #0080000d;
}
.table-game dd:hover input ~ .draw.checkmark, input[type="radio"]:checked ~ .draw.checkmark, .table-game dd:hover input ~ .draw.checkmark:hover, input[type="radio"]:checked ~ .draw.checkmark:hover {
  color: darkred;
  background: #8b000012;
}

dl {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  border-bottom: 1px solid #eee;
  margin: 0 auto;
}
dl dt, dl dd, dl .header-table {
  display: flex;
  margin: 0 auto;
  min-width: 40px;
  position: relative;
  place-content: center;
  width: 100%;
  height: 40px;
  justify-content: center;
  align-items: center;
}
dl dd:first-child,
dl dt:first-child {
  margin-left: 20px;
}
dl dd:nth-child(even) {
  font-size: 1.2em;
}
dl dd:nth-child(even),
dl dt:nth-child(even) {
  place-content: center;
  max-width: 20px;
}

.table-game {
  font-family: sans-serif;
  font-size: 12px;
  background: #fff;
}
.table-game .header-table {
  background: yellow;
  font-size: 1.2em;
  font-weight: 600;
}
.table-game dl:hover {
  background: #f8f8f8;
  cursor: pointer;
}
.table-game dl input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  margin: auto auto;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

.checkmark {
  color: green;
  text-align: center;
  display: none;
}
.checkmark.draw {
  color: darkred;
}

 

Compartilhar este post


Link para o post
Compartilhar em outros sites

Crie uma conta ou entre para comentar

Você precisar ser um membro para fazer um comentário

Criar uma conta

Crie uma nova conta em nossa comunidade. É fácil!

Crie uma nova conta

Entrar

Já tem uma conta? Faça o login.

Entrar Agora

  • Conteúdo Similar

    • Por 4Unknow
      Bom dia comunidade Imasters.

      Venho aqui tratar de um problema dúvida que estou tendo com um layout que estou tentando usar o formulário php dele.
      Quando clico em enviar ele me enviar para um arquivo .php  (assets/vendor/simple-forms/sendmail.php)

      Ele não envia o e-mail, acredito que deveria aparecer uma mensagem que o contato foi enviado corretamente.
      Vou deixar os arquivos aqui em anexo quem puder me ajudar nessa, ficaria muito grato.
       
      Link Website (wetransfer.com)
    • Por Hacker_Buiu
      Tem que completar o perfil para curtir e ser curtido sem dar erro?
    • Por Hacker_Buiu
      Porque não ganho reputação com o meu bom trabalho?
    • Por Flaviaac
      Boa tarde pessoal,
      gostaria de pedir uma ajuda para criar um evento em um formulário HTML.
       

      Eu tenho um formulário em HTML e PHP,  e nele tem um campo do tipo select e um campo do tipo text(desabilitado).
      Gostaria que ao clicar no campo select e escolher qualquer opção da lista, automaticamente em seguida aparecesse dentro do campo text um valor respectivo a opção escolhida anteriormente.
       
      Exemplo:
      Tenho um campo select com tipos diferentes de materiais (vidro, papel, alumínio, etc.) e no campo text(desabilitado) terei a quantidade de anos que cada material demora a se decompor na natureza. O campo text inicialmente estará vazio, mas quando selecionar o material, aparecerá dentro deste text a quantidade de anos.
       
      obs.: Os valores do campo select e do campo text estão ambos na mesma tabela do banco de dados(MySQL), o campo select com valores string e o campo text com valores inteiros.
       
      Não sei se consegui explicar direito, mas acredito que terei que utilizar javascript para este evento, mas ainda não sei como.
      Alguém tem ideia de como eu poderia fazer isso ou alguma dica?
       
       
      Muito obrigada!!

       
    • Por iJeanClaud
      Olá, pessoal.
      Bom, eu sou programador e já trabalhei muito em sistemas PHP, Java, etc. 
      Recentemente um amigo meu veio conversar comigo a respeito de uma vaga que surgiu na empresa na qual ele faz parte do RH, trata-se de automação de testes
      por incrível que pareça, nunca havia ouvido falar sobre isso e nem sequer entendi a lógica e essa é minha maior dúvida.

      Pelo que entendi, pesquisando na internet e assistindo vídeos, é um teste mais aprofundado em softwares, independente da plataforma, tais como: verificar todos os possíveis erros em uma tela de login, de cadastro, etc. O problema nisso tudo é que eu não consigo entender qual a lógica disso, e como assim "automação de testes" sendo que no trabalho em si você já está testando uma coisa? Porque precisa de alguém pra trabalhar em cima de uma automação disso? Espero que entendam minha dúvida e agradeço a quem tentar, pelo menos um pouco, me ajudar com isso.

      Obrigado!
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.