Wyświetlanie w php i edycja w css

0

Witam, napisałem taki kod wyświetlający dodane produkty z bazy, można je edytować oraz usuwać, lecz chciałbym trochę to wszystko upiększyć poprzez CSS, jednak nie mam pojęcia jak, próbowałem tworzyć różne klasy oraz funkcje, ale nie udało Mi się. Macie jakiś pomysł?

<?php include("config.php");

$wynik = mysql_query("SELECT * FROM kategoria")
or die("Błąd");

if (mysql_num_rows($wynik)>0)
{

	while ($r = mysql_fetch_assoc($wynik))
	{	
		echo "<td>".$r['nr_klienta']."</td><br>";
		echo "<td>".$r['produkt']."</td><br>";
		echo "<td>".$r['rodzaj']."</td><br>";
		echo "<td>".$r['podkategoria']."</td><br>";
		echo "<td>".$r['Cena']."</td><br>";
		echo "<td>
		<a href=\"usunkat.php?a=del&nr_klienta={$r['nr_klienta']}\">Usun</a> 
        <a href=\"usunkat.php?a=edit&id={$r['id']}\">Dodaj do koszyka</a> 
        </td>"; 

    } 

	
}


$a = trim($_GET['a']); 
$nr_klienta = trim($_GET['nr_klienta']); 

if($a == 'del' and !empty($nr_klienta)) { 
     
    /* usuwamy rekord */ 
    mysql_query("DELETE FROM kategoria WHERE nr_klienta='$nr_klienta'") 
    or die('Błąd zapytania: '.mysql_error()); 
     
    echo 'Rekord został usunęty z bazy'; 
}
0

Może coś takiego? (te klasy są z Boostrap'a)

if (mysql_num_rows($wynik)>0)
{
 
	echo "<table class=\"table table-condensed\">";
	    while ($r = mysql_fetch_assoc($wynik)){    
	        echo "<tr><td>".$r['nr_klienta']."</td></tr>";
        	echo "<tr><td>".$r['produkt']."</td></tr>";
       	 	echo "<tr><td>".$r['rodzaj']."</td></tr>";
        	echo "<tr><td>".$r['podkategoria']."</td></tr>";
        	echo "<tr><td>".$r['Cena']."</td></tr>";
        	echo "<tr><td>
        	<a href=\"usunkat.php?a=del&nr_klienta={$r['nr_klienta']}\">Usun</a> 
        	<a href=\"usunkat.php?a=edit&id={$r['id']}\">Dodaj do koszyka</a> 
        	</td></tr>"; 
 
    } 
	echo "</table>";
}
0

Nie ma innej rady niż się nauczyć.
http://www.w3schools.com/css/

Bardzo mi przykro.

0

Akurat funkcje i klasy nie mają za dużo wspólnego z wyglądem. Chyba że mówimy o pseudo klasach. Możesz nam jakoś pokazać jak to obecnie wygląda? Umieść przykładowo screen lub kod na jakieś stronie która umożliwia pokazanie wyglądu trony po wprowadzeniu kodu. Chyba jedna z nich to codepen? Czy coś takiego.

Przede wszystkim, dodaj padding, zmień czcionkę i kolor backgrounda. CSS operuje na selektorach, to znaczy możesz wskazać że chciałbyś aby komórka Twojej tabeli była zielona. Co do kolorów, lepiej użwać bardziej customowych niż blue, red, green czy lime. One nie wyglądają najlepiej. Lepiej już dodaj na przykład lightblue zamiast blue. Tutaj masz listę kolorów z nazwami: http://www.w3schools.com/colors/colors_names.asp

Załóżmy że masz znacznik p i chcesz aby miał on kolor jasnoniebieski. Tworzysz plik o nazwie *.css, gwiazdka wskazuje że tutaj możesz umieścić swoją nazwę, zazwyczaj to chyba nazywa się style. Do strony w znacznikach <head></head> załączasz plik css. <link rel="stylesheet" href="Style/style.css"> Proszę to prosto z mojego kodu. Jeśli plik css masz w tym samym katalogu co plik z stroną, to piszesz samą nazwę pliku. Jeśli nie, zamieszczasz nazwę katalogu i nazwę pliku, tak jak ja. Jeśli katalog miałbyś w innym katalogu niż plik z stroną. Musisz wprowadzić jej adres względny.

W pliku zamieszczasz nazwę selektora i w nawiasach klamrowych backgrounc-color i nazwę koloru lub kolor zapisany w innej postaci hex lub RGBA. p{background-color:lightblue;}

Tutaj znajdziesz potrzebne informacje: http://www.w3schools.com/css/default.asp

Dodałabym może fieldset legend i wystylizowała w css. Pewnie zrobiłabym coś z czarnymi kreskami które tworzą tabelę albo usuneła albo zmieniła kolor i ich styl, może dodała przestrzeń między tymi kreskami? Nie mam pojęcia, bo nie wiem jak to teraz wygląda a jednak zmiana wyglądu jest procesem twórczym.

Możesz też korzystać z bootstrapa tak jak zaproponowała @shagrin (wydaje mi się że jesteś kobietą jeśli jednak nie, to przepraszam. Wydaje mi się że kiedyś widziałam Twoje posty z damskimi końcówkami).

Bootstrap to framework. Możesz w prosty sposób użyć customowego wyglądu, nie bawiąc sie samemu w css i proces twórczy. Tutaj są deafultowe style css dla tabeli w bootstrap : http://getbootstrap.com/css/#tables . Możesz ściągnąć boostrapa, dodać do projektu i użyć któryś z dostępnych wyglądów. W sposób w jaki napisała @shagrin.

0

Proszę o to screen ze strony, nieco udało mi się poprzerabiać, tak jak chciałem. Jak widzicie na samym dole mam dwa przyciski, już wyedotowane w ccs za pomocą input[bottom], po boku po lewej stronie są odnośniki, które także służą za przyciski, jak mogę zrobić aby te po boku wyedytować inaczej, aby różniły się od tych na samym dole.
user image

0

Nadaj im jakąś klasę, którą później ostylujesz w CSS. A najlepiej będzie żebyś przerobił sobie CSS od podstaw.

1 użytkowników online, w tym zalogowanych: 0, gości: 1