CSS: id ή class?

Ας μάθουμε πως να κάνουμε τις σελίδες μας με στιλ. Τα Cascading Style Sheets είναι ο τρόπος για να το επιτύχουμε.

Συντονιστές: WebDev Moderators, Super-Moderators

Απάντηση
Άβαταρ μέλους
RADICAL
Δημοσιεύσεις: 386
Εγγραφή: 14 Ιούλ 2004 01:07
Τοποθεσία: Athens
Επικοινωνία:

CSS: id ή class?

Δημοσίευση από RADICAL » 03 Μαρ 2005 21:03

Τι είναι σωστότερο?

Κώδικας: Επιλογή όλων

<div id="text1">....</div
ή

Κώδικας: Επιλογή όλων

<div class="text1">....</div
Υπάρχει κάποια διαφορά μεταξύ τους?
Εικόνα

Άβαταρ μέλους
Expl0it
Honorary Member
Δημοσιεύσεις: 2364
Εγγραφή: 25 Αύγ 2003 23:24
Τοποθεσία: home/sweet/home

CSS: id ή class?

Δημοσίευση από Expl0it » 03 Μαρ 2005 21:12

Διαφορά υπάρχει και πολύ μεγάλη ! Πιστεύω το παρακάτω θα σε βοηθήσει να καταλάβεις ποια είναι η διαφορά και ποιο είναι το σωστό γι'αυτό που θέλεις να κάνεις !

Κώδικας: Επιλογή όλων

id = name 
This attribute assigns a name to an element. This name must be unique in a document.

class = cdata-list 
This attribute assigns a class name or set of class names to an element. Any number of elements may be assigned the same class name or names. Multiple class names must be separated by white space characters. 
Περισσότερες πληροφορίες : Εδώ
LET THE C0DER IN YOUR LIFE
Fatal Error: Unable to read 3555 bytes in /root/head/brain/task.php on line 0

Εικόνα

Άβαταρ μέλους
softius
Script Master
Δημοσιεύσεις: 241
Εγγραφή: 11 Ιαν 2004 19:07
Επικοινωνία:

CSS: id ή class?

Δημοσίευση από softius » 03 Μαρ 2005 22:41

Σωστός ο filter. Ένα ωραίο άρθρο που αναλύει αυτό και πολλά άλλα: http://www.positioniseverything.net/articles/terms.html

Άβαταρ μέλους
RADICAL
Δημοσιεύσεις: 386
Εγγραφή: 14 Ιούλ 2004 01:07
Τοποθεσία: Athens
Επικοινωνία:

CSS: id ή class?

Δημοσίευση από RADICAL » 04 Μαρ 2005 04:14

Ευχαριστώ πολύ για το feedback.
Τα links είναι πολύ ενδιαφέροντα.
Εικόνα

Άβαταρ μέλους
skeftomilos
Script Master
Δημοσιεύσεις: 2888
Εγγραφή: 07 Ιαν 2005 07:22
Τοποθεσία: Αθήνα

CSS: id ή class?

Δημοσίευση από skeftomilos » 04 Μαρ 2005 07:43

Το attribute id αφορά και χαρακτηρίζει ένα μεμονωμένο element. Το attribute class αφορά μία κλάση (ομάδα) από elements που μοιράζονται κοινά χαρακτηριστικά εμφάνισης. Π.χ.:

Κώδικας: Επιλογή όλων

<html>
  <head>
    <style>
      #test1 &#123;color&#58; green&#125;
      .test1 &#123;color&#58; red&#125;
    </style>
  </head>
  <body>
    <div id="test1">id</div>
    <div class="test1">class</div>
    <div name="test1">name</div>
  </body>
</html>
Εικόνα

Μία άλλη διαφορά ως προς τη χρήση είναι ότι το id χρησιμοποιείται συχνότερα για JavaScript (συμπεριφορά), παρά για CSS (εμφάνιση). Βέβαια δεν αποκλείεται ο συνδυασμός των δύο, όπως παρακάτω:

Κώδικας: Επιλογή όλων

<script>
  document.getElementById&#40;"test1"&#41;.style.color = "cyan"
</script>
Η χρήση του attribute class στη JavaScript είναι μάλλον σπάνια. Π.χ.:

Κώδικας: Επιλογή όλων

<style>
  .test2 &#123;background-color&#58; yellow&#125;
</style>
<script>
  document.getElementById&#40;"test1"&#41;.className = "test2"
</script>
Μία πιο δύσκολη και λεπτή διάκριση είναι αυτή μεταξύ των attributes id και name. Ποιο από τα παρακάτω είναι το σωστό?

Κώδικας: Επιλογή όλων

<form name="f">
  ...
</form>
ή

Κώδικας: Επιλογή όλων

<form id="f">
  ...
</form>
Tools όπως το MS Visual Studio δίνουν μία Σολομώντια λύση σ'αυτό το δίλημμα!

Κώδικας: Επιλογή όλων

<form name="f" id="f">
  ...
</form>
:D
The pure and simple truth is rarely pure and never simple. Ο μη νους δε σκέπτεται μη σκέψεις για το τίποτα.

Άβαταρ μέλους
Tanaka
Δημοσιεύσεις: 174
Εγγραφή: 27 Απρ 2004 21:40
Τοποθεσία: Κορωπί

CSS: id ή class?

Δημοσίευση από Tanaka » 04 Μαρ 2005 10:59

Επίσης αν σε ενδιαφέρει ο κώδικας σου να είναι valid XHTML θα πρέπει να έχεις μόνο ένα id με το ίδιο όνομα ενώ class μπορείς να έχεις όσα θέλεις.

Άβαταρ μέλους
Rapid-eraser
WebDev Moderator
Δημοσιεύσεις: 6851
Εγγραφή: 05 Απρ 2003 17:50
Τοποθεσία: Πειραιάς
Επικοινωνία:

CSS: id ή class?

Δημοσίευση από Rapid-eraser » 04 Μαρ 2005 13:44

kai ta id va miv exouve underscore mesa mazi me tous allous apagorebmevous xaratkires
Cu, Rapid-eraser, Tα αγαθά copies κτώνται.
Love is like oxygen, You get too much you get too high
Not enough and you're gonna die, Love gets you high

Mut3
Δημοσιεύσεις: 167
Εγγραφή: 03 Σεπ 2004 16:23
Επικοινωνία:

CSS: id ή class?

Δημοσίευση από Mut3 » 06 Μαρ 2005 14:00

Πιο σωστο δεν υπαρχει. Το ερωτημα ειναι ποιο ειναι το ποιο καταλληλο στην καθε περιπτωση.
Αυτο τωρα πρεπει να το αποφασισεις εσυ αναλογα με το τι θες να κανεις.

Απάντηση

Επιστροφή στο “CSS - Cascading Style Sheets”

Μέλη σε σύνδεση

Μέλη σε αυτήν τη Δ. Συζήτηση: Δεν υπάρχουν εγγεγραμμένα μέλη και 1 επισκέπτης