Witam.
Mógł by mi ktoś pokrótce wytłumaczyć jak działa CSS?
Czytam już pół dnia różne kursy i nic nie działa...
Pełna wersja: [CSS] jak to działa?
Co nie działa? Co czytałeś?
chociaż by to: http://www.kurshtml.boo.pl/
nic nie ma gdzie to wstawić, a jak wpisuję na swojej stronce jakiś kod to go wyswietla tak jak wpisałem
Naprawdę nie mam pojęcia o co w tym chodzi Kiedyś robiłem stronki w tabelkach, w tych tabelkach tabelki (hehe) teraz zabrałem się trochę poważniej do sprawy i nie daję sobie rady...
Mam np formularz do logowania i chcę go po lewej stronie, oddzielony od tekstu pionową linią i żeby się to wszystko nie rozjeżdżało przy różnych rozdzielczościach...
Od czego zacząć?
nic nie ma gdzie to wstawić, a jak wpisuję na swojej stronce jakiś kod to go wyswietla tak jak wpisałem
Naprawdę nie mam pojęcia o co w tym chodzi Kiedyś robiłem stronki w tabelkach, w tych tabelkach tabelki (hehe) teraz zabrałem się trochę poważniej do sprawy i nie daję sobie rady...Mam np formularz do logowania i chcę go po lewej stronie, oddzielony od tekstu pionową linią i żeby się to wszystko nie rozjeżdżało przy różnych rozdzielczościach...
Od czego zacząć?
Cytat(albercik1983 @ 3.03.2009, 21:07:44 ) 
Witam.
Mógł by mi ktoś pokrótce wytłumaczyć jak działa CSS?
Czytam już pół dnia różne kursy i nic nie działa...
Mógł by mi ktoś pokrótce wytłumaczyć jak działa CSS?
Czytam już pół dnia różne kursy i nic nie działa...
Pół dnia to trochę mało na css, zwłaszcza jeśli wcześniej robiłeś na tabelkach. Poza tym w kursie html boo wszystko jest opisane:
http://www.kurshtml.boo.pl/css/styl_lokalny,wstawianie.html
http://www.kurshtml.boo.pl/css/wewnetrzny_...wstawianie.html
http://www.kurshtml.boo.pl/css/zewnetrzny_...wstawianie.html
eh...
nadal nic.
to może jakiś najprostrzy przykład? Może szybciej zajażę... ;/
nadal nic.
to może jakiś najprostrzy przykład? Może szybciej zajażę... ;/
No to może napisz co konkretnie Ci nie wychodzi, wrzuć kod. Przeciez nie będziemy kursu przepisywać
Wolał bym skumać wstęp i jak bym wiedział o co w tym chodzi to bym już się może domyślił z tych kursów Kod jest taki:
<?php
session_start();
session_register("zalogowany");
if(empty($_SESSION["zalogowany"]))$_SESSION["zalogowany"]=0;
mysql_connect("localhost", "root", "")or die("Nie można nawiązać połączenia z bazą");
mysql_select_db("user")or die("Wystąpił błąd podczas wybierania bazy danych");
?>
<html>
<HEAD>
<meta http-equiv="Content-Language" content="pl">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1250">
<META http-equiv="Pragma" content="no-cache">
<META http-equiv="Expires" content="Tue, 1 Jan 1980 12:00:00 GMT">
<META http-equiv="Cache-Control" content="no-cache">
<meta name="author" content="Grzegorz Wałek">
<title>Strona - Grzegorz Wałek - Wszelkie prawa zastrzeżone</title>
</HEAD>
<body bgcolor="fffff0" link="darkgreen" alink="darkgreen" vlink="darkgreen">
<?php
selektor { border-color: red blue; border-style: solid
function ShowLogin($komunikat=""){
echo "$komunikat<br>";
echo "<form action='index.php' method=post>";
echo "Login: <input type=text name=login><br>";
echo "Hasło: <input type=password name=haslo><br>";
echo "<input type=submit value='Zaloguj!'>";
echo "</form>";
echo "<a href='rejestracja.php'>Zarejestruj się</a>";
}
}
?>
<?php
if($_GET["wyloguj"]=="tak")
{
$_SESSION["zalogowany"]=0;
session_destroy();
$_SESSION = array();
}
if($_SESSION["zalogowany"]!=1){
if(!empty($_POST["login"]) && !empty($_POST["haslo"])){
if(mysql_num_rows(mysql_query("select * from user where user_login = '".htmlspecialchars($_POST["login"])."' AND user_haslo = '".htmlspecialchars($_POST["haslo"])."'"))){
$_SESSION["zalogowany"]=1;
$plik = implode('', file('load.php'));
echo $plik;
}
else echo ShowLogin("Podano złe dane!!!");
}
else ShowLogin("Logowanie do serwisu");
}
else{
?>
<a href='index.php?wyloguj=tak'>wyloguj się</a><br><br>
<p align="center"><font size="6" color="blue">Witamy <br> Strona w budowie</font></p>
<?php
}
?>
</body>
</html>
<?php mysql_close(); ?>
i chcę wyrównać ten formularz, oddzielić go pionową linią od tekstu, który będzie na środku. Jak dawałem tabelki to było zawsze ładnie, ale w tym wypadku nic nie zdziałam w ten sposób
Kod jest taki: <?php
session_start();
session_register("zalogowany");
if(empty($_SESSION["zalogowany"]))$_SESSION["zalogowany"]=0;
mysql_connect("localhost", "root", "")or die("Nie można nawiązać połączenia z bazą");
mysql_select_db("user")or die("Wystąpił błąd podczas wybierania bazy danych");
?>
<html>
<HEAD>
<meta http-equiv="Content-Language" content="pl">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1250">
<META http-equiv="Pragma" content="no-cache">
<META http-equiv="Expires" content="Tue, 1 Jan 1980 12:00:00 GMT">
<META http-equiv="Cache-Control" content="no-cache">
<meta name="author" content="Grzegorz Wałek">
<title>Strona - Grzegorz Wałek - Wszelkie prawa zastrzeżone</title>
</HEAD>
<body bgcolor="fffff0" link="darkgreen" alink="darkgreen" vlink="darkgreen">
<?php
selektor { border-color: red blue; border-style: solid
function ShowLogin($komunikat=""){
echo "$komunikat<br>";
echo "<form action='index.php' method=post>";
echo "Login: <input type=text name=login><br>";
echo "Hasło: <input type=password name=haslo><br>";
echo "<input type=submit value='Zaloguj!'>";
echo "</form>";
echo "<a href='rejestracja.php'>Zarejestruj się</a>";
}
}
?>
<?php
if($_GET["wyloguj"]=="tak")
{
$_SESSION["zalogowany"]=0;
session_destroy();
$_SESSION = array();
}
if($_SESSION["zalogowany"]!=1){
if(!empty($_POST["login"]) && !empty($_POST["haslo"])){
if(mysql_num_rows(mysql_query("select * from user where user_login = '".htmlspecialchars($_POST["login"])."' AND user_haslo = '".htmlspecialchars($_POST["haslo"])."'"))){
$_SESSION["zalogowany"]=1;
$plik = implode('', file('load.php'));
echo $plik;
}
else echo ShowLogin("Podano złe dane!!!");
}
else ShowLogin("Logowanie do serwisu");
}
else{
?>
<a href='index.php?wyloguj=tak'>wyloguj się</a><br><br>
<p align="center"><font size="6" color="blue">Witamy <br> Strona w budowie</font></p>
<?php
}
?>
</body>
</html>
<?php mysql_close(); ?>
i chcę wyrównać ten formularz, oddzielić go pionową linią od tekstu, który będzie na środku. Jak dawałem tabelki to było zawsze ładnie, ale w tym wypadku nic nie zdziałam w ten sposób
witam może spróbuj poczytać w tym miejscu
http://www.mako4css.com/BasDiv.htm
to też jest fajna strona
http://www.howtocreate.co.uk/tutorials/css/incorporate
http://excomega.wz.cz/cs.php
http://www.mako4css.com/BasDiv.htm
to też jest fajna strona
http://www.howtocreate.co.uk/tutorials/css/incorporate
http://excomega.wz.cz/cs.php
Przede wszystkim jak chcesz robić strony w css, to powywalaj z kodu te wszystkie color="", size="" align="" etc. Po drugie przeczytaj uważnie ten kurs boo, tam na prawdę jest wszystko ładnie napisane, przecież nie jesteś jakimś zupełnym nowicjuszem.
Poza tym
nie wpisujesz czegoś takiego, zamist selector dajesz elemnt który chcesz formatować np table, div etc. I oczywiście to coś nie może się znajdować jak u Ciebie międzue <?php ?>, tylko w nagłówku <head>, lub w osobnym pliku z rozszerzeniem css np style.css, który potem ładujesz do dokumentu, ale to wszystko w kursie jest
Poza tym
nie wpisujesz czegoś takiego, zamist selector dajesz elemnt który chcesz formatować np table, div etc. I oczywiście to coś nie może się znajdować jak u Ciebie międzue <?php ?>, tylko w nagłówku <head>, lub w osobnym pliku z rozszerzeniem css np style.css, który potem ładujesz do dokumentu, ale to wszystko w kursie jest
Teraz konkrety:
W <head> daj: <link rel="Stylesheet" type="text/css" href="style.css" />
Potem utwórz plik style.css.
i teraz w pliku twoja_strona.html piszesz normalną stronkę.
Kurs zacznij czytać od tego miejsca: http://www.kurshtml.boo.pl/css/czcionki.html
Przykład:
piszesz tak:
<h1 class="tekst">Jakiś tekst</h1>
a potem w style.css piszesz:
.tekst {
color: red;
font-size: 14pt;
}
Zapisujesz i sprawdzasz
W <head> daj: <link rel="Stylesheet" type="text/css" href="style.css" />
Potem utwórz plik style.css.
i teraz w pliku twoja_strona.html piszesz normalną stronkę.
Kurs zacznij czytać od tego miejsca: http://www.kurshtml.boo.pl/css/czcionki.html
Przykład:
piszesz tak:
<h1 class="tekst">Jakiś tekst</h1>
a potem w style.css piszesz:
.tekst {
color: red;
font-size: 14pt;
}
Zapisujesz i sprawdzasz
A gdybym teraz chciał ustalić kolor linków to w tym samym pliku "style.css" mogę dać na końcu np .link{... ? czy muszę zrobić nowy plik style2.css ?
wszystkie style moga byc w jednym pliku
no dobra dałem w style css
.tekst {
color: red;
font-size: 14pt;
}
.link{
color: red;
}
a w index.php <h2 class="link"><a href='index.php?wyloguj=tak'>wyloguj się</a></h2><br><br>
i link mam niebieski, tylko że większy
.tekst {
color: red;
font-size: 14pt;
}
.link{
color: red;
}
a w index.php <h2 class="link"><a href='index.php?wyloguj=tak'>wyloguj się</a></h2><br><br>
i link mam niebieski, tylko że większy
Cytat
i link mam niebieski, tylko że większy
Niektóre elementy mają predefiniowane wartości, np. linki domyślnie są niebieskie, nagłówki odpowiednio większe w zależności od poziomu.
Dodajcie bbcode w swoich postach.
no tak, ale jak wcześniej dawałem
Dobra narazie to pominmy
A w przypadku tabeli jak to będzie? Czy da się np dać tabelę żeby nie było konturów (obramowania) i np żeby było obramowanie tylko do jakiejś jednej poszczególnej krawędzi (ta moja pionowa linia...)
CODE
<body bgcolor="fffff0" link="darkgreen" alink="darkgreen" vlink="darkgreen">
to działało Dobra narazie to pominmy
A w przypadku tabeli jak to będzie? Czy da się np dać tabelę żeby nie było konturów (obramowania) i np żeby było obramowanie tylko do jakiejś jednej poszczególnej krawędzi (ta moja pionowa linia...)
Cytat
to działało
Działało, ale było niesemantyczne. Przeglądarki interpretują kod zachowując zgodność wstecz.
Cytat
A w przypadku tabeli jak to będzie?
Normalnie; jeśli chodzi o CSS, to "podpinanie" reguł dla wszystkich znaczników jest jednakowe, nieważne, czy tabela, czy paragraf.
Cytat
żeby było obramowanie tylko do jakiejś jednej poszczególnej krawędzi (ta moja pionowa linia...)
Polecam lekturę kursu CSS, bo Twoje pytania naprawdę dotyczą podstaw.
Cytat(albercik1983 @ 3.03.2009, 22:49:46 )
no dobra dałem w style css
.tekst {
color: red;
font-size: 14pt;
}
.link{
color: red;
}
a w index.php <h2 class="link"><a href='index.php?wyloguj=tak'>wyloguj się</a></h2><br><br>
i link mam niebieski, tylko że większy
.tekst {
color: red;
font-size: 14pt;
}
.link{
color: red;
}
a w index.php <h2 class="link"><a href='index.php?wyloguj=tak'>wyloguj się</a></h2><br><br>
i link mam niebieski, tylko że większy
wpisz lepiej tak
w style.css :
Kod
.tekst {
color: red;
font-size: 14pt;
}
.link{
color: red;
}
color: red;
font-size: 14pt;
}
.link{
color: red;
}
a w index.php
<h2 class="tekst"><a class="link" href='index.php?wyloguj=tak'>wyloguj się</a></h2><br/><br/>
pogrubiłem zmiany jakie musisz wprowadzic
zamiast <br><br> pisz <br/>
pozatym pozycjonowanie elementow na stronie za pomoca wielu <br/> jest nie praktyczne, poczytaj kurs CSS [CALY, DOKLADNIE] by dowiedziec sie jak to zrobic poprawnie i profesjonalnie.
Jak zauwazyles
gdy w css wpisujesz cos w ten sposob
Kod
.tekst {
color: red;
font-size: 14pt;
}
color: red;
font-size: 14pt;
}
to wszystkie elementy które będą miały taki atrybut class="tekst"
bedą miały kolor czerwony i czcionke o wielkosci 14pt
mozesz np na stronie wstawic nawet cos takiego
Kod
<p class="tekst">jakis tam tekst</p><br/>
<h1 class="tekst">jakis tam tekst</h1>
<h1 class="tekst">jakis tam tekst</h1>
i sprawdz rezultaty, wynik bedzie taki ze obydwa te bloki beda identyczne podczas gdy domyslnie tekst pomiedzy znacznikami <h1> i </h1> jest wieksza czcionką (h jak header czyli nagłówek, 1 jak stopien wielkosci, 1 stopien jest najwiekszym z mozliwych potem jest 2,3,4,5,6)
BR nie służy do robienia odstępu - to raz
W żadnym z powyższych przykładów nie trzeba korzystać z selektora klasy (Google: selektory CSS) - to dwa
W żadnym z powyższych przykładów nie trzeba korzystać z selektora klasy (Google: selektory CSS) - to dwa
Przykład tabeli:
i w stylach sobie piszesz:
w tym wypadku masz komórkę z podwójnym obramowaniem.
Dodatkowo:
w css nie musisz pisac np dla kazdego a lub h1 class lub id tylko piszesz w stylach:
i wtedy każdy link na stronie będzie zielony, a kazdy tekst wewnątrz znaczników <h1> i </h1> bedzie niebieski
i w stylach sobie piszesz:
w tym wypadku masz komórkę z podwójnym obramowaniem.
Dodatkowo:
w css nie musisz pisac np dla kazdego a lub h1 class lub id tylko piszesz w stylach:
i wtedy każdy link na stronie będzie zielony, a kazdy tekst wewnątrz znaczników <h1> i </h1> bedzie niebieski
Poczytałem trochę i mam już tą swoją pionową linię Zrobiłem to ustalając kolory i grubość krawędzi ramki.
A jak zrobić, żeby wyrównać formularz ?
Bo trochę się rozjeżdża
Zrobiłem to ustalając kolory i grubość krawędzi ramki.A jak zrobić, żeby wyrównać formularz ?
Kod
[/b]<?php
function ShowLogin($komunikat=""){
echo "$komunikat<br>";
echo "<form action='index.php' method=post>";
echo "Login: <input type=text name=login><br>";
echo "Hasło: <input type=password name=haslo>";
echo "<input type=submit value='Zaloguj!'>";
echo "</form>";
echo "<a href='rejestracja.php'>Zarejestruj się</a>";
}
?>[b]
function ShowLogin($komunikat=""){
echo "$komunikat<br>";
echo "<form action='index.php' method=post>";
echo "Login: <input type=text name=login><br>";
echo "Hasło: <input type=password name=haslo>";
echo "<input type=submit value='Zaloguj!'>";
echo "</form>";
echo "<a href='rejestracja.php'>Zarejestruj się</a>";
}
?>[b]
Bo trochę się rozjeżdża
To chyba żart jakiś ...
~albercik1983:
Te dwa zdania się wykluczają.
Jeśli masz jakieś konkretne pytanie, to je zadaj, a nie wypytujesz o naprawdę banalne rzeczy, do których już zalinkowano.
Cytat
A jak zrobić, żeby wyrównać formularz ?
Cytat
Poczytałem trochę
Te dwa zdania się wykluczają.
Jeśli masz jakieś konkretne pytanie, to je zadaj, a nie wypytujesz o naprawdę banalne rzeczy, do których już zalinkowano.
Nie bardzo wiadomo o co Ci chodzi
Kod
[/b]<?php
session_start();
session_register("zalogowany");
if(empty($_SESSION["zalogowany"]))$_SESSION["zalogowany"]=0;
mysql_connect("localhost", "root", "")or die("Nie można nawiązać połączenia z bazą");
mysql_select_db("user")or die("Wystąpił błąd podczas wybierania bazy danych");
?>
<html>
<HEAD>
<link rel="Stylesheet" type="text/css" href="style.css" />
<meta http-equiv="Content-Language" content="pl">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1250">
<META http-equiv="Pragma" content="no-cache">
<META http-equiv="Expires" content="Tue, 1 Jan 1980 12:00:00 GMT">
<META http-equiv="Cache-Control" content="no-cache">
<meta name="author" content="Grzegorz Wałek">
<title>Moja strona</title>
</HEAD>
<body bgcolor="fffff0">
<h1 class="naglowek">Nagłówek :)</h1>
<?php
function ShowLogin($komunikat=""){
echo "$komunikat<br>";
echo "<form action='index.php' method=post>";
echo "Login: <input type=text name=login><br>";
echo "Hasło: <input type=password name=haslo>";
echo "<input type=submit value='Zaloguj!'>";
echo "</form>";
echo "<a href='rejestracja.php'>Zarejestruj się</a>";
}
?>
<div><menu class="menu">
<?php
if($_GET["wyloguj"]=="tak")
{
$_SESSION["zalogowany"]=0;
session_destroy();
$_SESSION = array();
}
if($_SESSION["zalogowany"]!=1){
if(!empty($_POST["login"]) && !empty($_POST["haslo"])){
if(mysql_num_rows(mysql_query("select * from user where user_login = '".htmlspecialchars($_POST["login"])."' AND user_haslo = '".htmlspecialchars($_POST["haslo"])."'"))){
$_SESSION["zalogowany"]=1;
}
else echo ShowLogin("Podano złe dane!!!");
}
else ShowLogin("Logowanie do serwisu");
}
?></menu>
<teksd class="tekst">a ten tekst ma być z boku</tekst></div>
</body>
</html>
<?php mysql_close(); ?>
[b]
session_start();
session_register("zalogowany");
if(empty($_SESSION["zalogowany"]))$_SESSION["zalogowany"]=0;
mysql_connect("localhost", "root", "")or die("Nie można nawiązać połączenia z bazą");
mysql_select_db("user")or die("Wystąpił błąd podczas wybierania bazy danych");
?>
<html>
<HEAD>
<link rel="Stylesheet" type="text/css" href="style.css" />
<meta http-equiv="Content-Language" content="pl">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1250">
<META http-equiv="Pragma" content="no-cache">
<META http-equiv="Expires" content="Tue, 1 Jan 1980 12:00:00 GMT">
<META http-equiv="Cache-Control" content="no-cache">
<meta name="author" content="Grzegorz Wałek">
<title>Moja strona</title>
</HEAD>
<body bgcolor="fffff0">
<h1 class="naglowek">Nagłówek :)</h1>
<?php
function ShowLogin($komunikat=""){
echo "$komunikat<br>";
echo "<form action='index.php' method=post>";
echo "Login: <input type=text name=login><br>";
echo "Hasło: <input type=password name=haslo>";
echo "<input type=submit value='Zaloguj!'>";
echo "</form>";
echo "<a href='rejestracja.php'>Zarejestruj się</a>";
}
?>
<div><menu class="menu">
<?php
if($_GET["wyloguj"]=="tak")
{
$_SESSION["zalogowany"]=0;
session_destroy();
$_SESSION = array();
}
if($_SESSION["zalogowany"]!=1){
if(!empty($_POST["login"]) && !empty($_POST["haslo"])){
if(mysql_num_rows(mysql_query("select * from user where user_login = '".htmlspecialchars($_POST["login"])."' AND user_haslo = '".htmlspecialchars($_POST["haslo"])."'"))){
$_SESSION["zalogowany"]=1;
}
else echo ShowLogin("Podano złe dane!!!");
}
else ShowLogin("Logowanie do serwisu");
}
?></menu>
<teksd class="tekst">a ten tekst ma być z boku</tekst></div>
</body>
</html>
<?php mysql_close(); ?>
[b]
a w "style.css" mam:
Kod
[/b].naglowek {
margin: 3px;
border-top: 4px solid #CC9933; /* jasny brązowy */
background-color: #FFCC99; /* kolor tła */
color: #663300; /* ciemny brązowy */
width: 100%;
height: 15%;
text-align: center;
}
.menu {
margin: 3px;
padding-left: 2px;
border-right: 4px solid #CC9933; /* jasny brazowy */
background-color: #FFCC99; /* kolor tła */
color: #663300; /* ciemny brąZOWY */
width: 25%;
height: 85%;
text-align: left;
}
.tekst {
margin: 3px;
padding-left: 2px;
border-right: 4px solid #CC9933; /* jasny brazowy */
background-color: #FFCC99; /* kolor tła */
color: #663300; /* ciemny brąZOWY */
width: 75%;
height: 85%;
text-align: center;
}
[b]
margin: 3px;
border-top: 4px solid #CC9933; /* jasny brązowy */
background-color: #FFCC99; /* kolor tła */
color: #663300; /* ciemny brązowy */
width: 100%;
height: 15%;
text-align: center;
}
.menu {
margin: 3px;
padding-left: 2px;
border-right: 4px solid #CC9933; /* jasny brazowy */
background-color: #FFCC99; /* kolor tła */
color: #663300; /* ciemny brąZOWY */
width: 25%;
height: 85%;
text-align: left;
}
.tekst {
margin: 3px;
padding-left: 2px;
border-right: 4px solid #CC9933; /* jasny brazowy */
background-color: #FFCC99; /* kolor tła */
color: #663300; /* ciemny brąZOWY */
width: 75%;
height: 85%;
text-align: center;
}
[b]
jak zrobić, żeby tekst i menu były obok siebie?
<div><menu class="menu"> - a toto to co to??
<div class='menu'>
Czy Ty dokładnie cokolwiek przeczytałeś
<div class='menu'>
Czy Ty dokładnie cokolwiek przeczytałeś
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.