Arquivo PHP, HTML não esta Rodando Arquivo CSS

Samuel Carlos Ribeiro · Quinta às 21:54

Boa noite

Estou fazendo um estudo em PHP, HTML, CSS e MySql, mas quando executo o script no navegado não esta aplicando o arquivo CSS, sou amador nessas linguagem, espero que tenham paciência.

Segue os Códigos:

.PHP
<?php
	session_start();
		if (isset($_GET['nome'])) {
		$_SESSION['lista_tarefas'][] = $_GET['nome'];
		}
		if (isset($_SESSION['lista_tarefas'])) {
		$lista_tarefas = $_SESSION['lista_tarefas'];
	} else {
		$lista_tarefas = array();
	}
		include "template.php";
			
	?>

.HTML
<html>
	<head>
	<meta charset="utf-8" />
		<title>Gerenciador de Tarefas</title>
		<link rel="stylesheet" href="tarefas.css" type="text/css" />
	</head>
	<body>
		<h1>Gerenciador de Tarefas</h1>
		<form>
			<fieldset>
				<legend>Nova tarefa</legend>
				<label>
				Tarefa:
				<input type="text" name="nome" />
				</label>
				<input type="submit" value="Cadastrar" />
			</fieldset>
		</form>
	<table>
		<tr>
			<th>Tarefas</th>
		</tr>
		<?php foreach ($lista_tarefas as $tarefa) : ?>
			<tr>
			<td><?php echo $tarefa; ?> </td>
			</tr>
		<?php endforeach; ?>
	</table>
		<label>
				Descrição (Opcional):
				<textarea name="descricao"></textarea>
		</label>
		<label>
				Prazo (Opcional):
				<input type="text" name="prazo" />
		</label>
			<fieldset>
				<legend>Prioridade:</legend>
		<label>
				<input type="radio" name="prioridade" value="baixa" checked />
				Baixa
				<input type="radio" name="prioridade" value="media" />
				Média
				<input type="radio" name="prioridade" value="alta" />
				Alta
		</label>
			</fieldset>
		<label>
			Tarefa concluída:
			<input type="checkbox" name="concluida" value="sim" />
		</label>
			<input type="submit" value="Cadastrar" />
</body>
</html>

.CSS
/* tarefas.css */

/* Estilo geral da página */
body {
    font-family: Arial, sans-serif;
    background-color: #f4f6f8;
    margin: 20px;
    color: #333;
}

/* Título */
h1 {
    text-align: center;
    color: #0077cc;
}

/* Formulário */
form {
    margin-bottom: 20px;
}

fieldset {
    border: 2px solid #0077cc;
    border-radius: 8px;
    padding: 15px;
    margin-bottom: 15px;
    background-color: #fff;
}

legend {
    font-weight: bold;
    color: #0077cc;
}

label {
    display: block;
    margin: 10px 0;
}

/* Campos de entrada */
input[type="text"],
	textarea {
    width: 95%;
    padding: 8px;
    margin-top: 5px;
    border: 1px solid #aaa;
    border-radius: 5px;
}

/* Botões */
input[type="submit"] {
    background-color: #0077cc;
    color: white;
    border: none;
    padding: 10px 15px;
    border-radius: 6px;
    cursor: pointer;
}

	input[type="submit"]:hover {
    background-color: #005fa3;
}

/* Tabela de tarefas */
table {
    width: 100%;
    border-collapse: collapse;
    background: #fff;
}

th, td {
    border: 1px solid #ddd;
    padding: 10px;
    text-align: left;
}

th {
    background-color: #0077cc;
    color: white;
}

tr:nth-child(even) {
    background-color: #f9f9f9;
}

Marcelo_2 · Quinta às 23:38

Olá. Ta funcionando sim. você tem certeza que instalou o servidor (Apache ou Xampp)?

Frank K Hosaka · 4 horas atrás

Verifique se os dois arquivos estão no mesmo diretório, o arquivo que contém html/php tem que ter a extensão php, e o outro arquivo tem ser o tarefas.css

Eu já gosto mais do tailwind:

<?php
session_start();
if (isset($_GET['nome'])) {
	$_SESSION['lista_tarefas'][] = $_GET['nome'];
}
if (isset($_SESSION['lista_tarefas'])) {
	$lista_tarefas = $_SESSION['lista_tarefas'];
} else {
	$lista_tarefas = array();
}
// include "template.php";
?>
<html>
<head>
	<meta charset="utf-8" />
	<title>Gerenciador de Tarefas</title>
	<script src="https:cdn.tailwindcss.com"></script>
</head>
<body class="font-sans bg-[#f4f6f8] m-5 text-[#333] w-[500px] m-0 m-auto">
	<h1 class="text-center text-[#0077cc] text-3xl text-semibold mt-5">Gerenciador de Tarefas</h1>
	<form class="mb-[20px]">
		<fieldset class="border-2 border-[#0077cc] rounded-lg p-4 mb-4 bg-white">
			<legend class="font-bold text-[#0077cc]">Nova tarefa</legend>
	        <input type="text" name="nome" 
                class="w-[95%] p-2 mt-1 mb-2 border border-gray-400 rounded-md"
                placeholder="Tarefa:" />
			<input type="submit" value="Cadastrar" 
                class="bg-[#0077cc] text-white border-none px-4 py-2 
                rounded-lg cursor-pointer hover:bg-[#005fa3]"/>
		</fieldset>
	</form>
	<table class="w-full border-collapse bg-white">
		<tr class="even:bg-[#f9f9f9]">
			<th class="border border-gray-300 px-4 py-2 text-left bg-[#0077cc] text-white">Tarefas</th>
		</tr>
		<?php foreach ($lista_tarefas as $tarefa) : ?>
			<tr class="even:bg-[#f9f9f9]" >
			    <td class="border border-gray-300 px-4 py-2 text-left"><?=$tarefa?> </td>
			</tr>
		<?php endforeach; ?>
	</table>
	<textarea name="descricao" placeholder="Descrição (Opcional):"
        class="w-[95%] p-2 mt-1 border border-gray-400 rounded-md"></textarea>
    <input type="text" name="prazo" placeholder="Prazo (Opcional):"
        class="w-[95%] p-2 mt-1 border border-gray-400 rounded-md"/>
	</label>
	<fieldset class="border-2 border-[#0077cc] rounded-lg p-4 mb-4 bg-white">
		<legend class="font-bold text-[#0077cc]">Prioridade:</legend>
		<label class="block my-[10px]">
			<input type="radio" name="prioridade" value="baixa" checked />
			Baixa
			<input type="radio" name="prioridade" value="media" />
			Média
			<input type="radio" name="prioridade" value="alta" />
			Alta
	    </label>
	</fieldset>
	<label class="block my-[10px]">
		Tarefa concluída:
		<input type="checkbox" name="concluida" value="sim" />
	</label>
	<input type="submit" value="Cadastrar" 
        class="bg-[#0077cc] text-white border-none px-4 py-2 
                rounded-lg cursor-pointer hover:bg-[#005fa3]" />
</body>
</html>

Entrar

Arquivo PHP, HTML não esta Rodando Arquivo CSS

Pergunta

Samuel Carlos Ribeiro

Link para o comentário

Compartilhar em outros sites

2 respostass a esta questão

Posts Recomendados

Marcelo_2

Link para o comentário

Compartilhar em outros sites

Frank K Hosaka

Link para o comentário

Compartilhar em outros sites

Participe da discussão

Estatísticas dos Fóruns

Navegação

Atividades