Προς το περιεχόμενο

Css/html

pandemic21

Από τον pandemic21
στο Web Design - Development

 Share

Προτεινόμενες αναρτήσεις

pandemic21 Contributor

pandemic21

Δημοσ.
Δημοσ.

Καλησπέρα σε όλους, έχω μια απορία για μια πολύ εύκολη εντολή αλλά δεν την ξέρω και θα ήθελα την βοήθεια σας, υγ: πριν λίγο καιρό ξεκίνησα με html/css, πως γίνεται εάν ήδη βρισκόμαστε στη σελίδα αυτή που είμαστε, το στοιχείο με το λινκ να είναι έντονα μαύρο, στο background δηλαδή.

post-344422-0-95602900-1432302911_thumb.png

pandemic21 Contributor

pandemic21

Δημοσ.
  • Μέλος
Δημοσ.

το background θελω να ειναι μαυρο οπως ειναι στην εικονα το κουτακι με το Έρανοι, απλα να γινεται μαυρο οταν ειμαι στην σελιδα αυτη..

 

<html>
  <head>
    <title>Έρανοι</title>
    <style>
      table.ex1{
        border-collapse: separate;
        }
      table.ex2 {
        border-collapse: separate;
        border-spacing: 80px 50px;
      }
      table, td, th {
        border: 2px solid black;
        }
      th.ex1 {
        border: 0px solid black;
        }
        th.ex2 {
        a:hover {
          background-color: #FF704D;
        }
        a:active {
         background-color: #FFFF00;
        }
        } 
    </style>
  </head>
  <body>
    <table class="ex2" border="10" width="95%" height="20%" padding="2" align="center">
      <tr>
        <th class="ex1"><img src="image.jpg" width="10%" align=left></th>
        <th width="20%" height="2%" align="center"><a href = "test.html">Έρανοι</a></th>
        <th width="20%" height="5%" align="center"><a href = "test2.html">Επικοινωνία</a></th>
      </tr>   
    </table>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <table class="ex1" border="10" width="95%" height="20%" padding="2" align="center">
    <caption align="left"><b>Έρανος #123<b></caption>
      <tr>
        <th class="ex1" align="left">Στόχος είναι να συγκεντρωθούν χρήματα για........................................</th>
        <th class="ex1" width="20%" height="2%" align="center">Στόχος: 800 Ευρώ<br></th>
        <th class="ex1" width="20%" height="5%" align="center">Δωρητές: 4<br><br><a href = "test1.html">Περισσότερα..</a></th>
      </tr>   
    </table>
    <br>
    <br>
    <br>
    <table class="ex1" border="10" width="95%" height="20%" padding="2" align="center">
    <caption align="left"><b>Έρανος #124<b></caption>
      <tr>
        <th class="ex1" align="left">Στόχος είναι να συγκεντρωθούν χρήματα για........................................</th>
        <th class="ex1" width="20%" height="2%" align="center">Στόχος: 1800 Ευρώ<br></th>
        <th class="ex1" width="20%" height="5%" align="center">Δωρητές: 4<br><br><a href = "test1.html">Περισσότερα..</a></th>
      </tr>   
    </table>
    <br>
    <br>
    <br>
    <table class="ex1" border="10" width="95%" height="20%" padding="2" align="center">
    <caption align="left"><b>Έρανος #135<b></caption>
      <tr>
        <th class="ex1" align="left">Στόχος είναι να συγκεντρωθούν χρήματα για........................................</th>
        <th class="ex1" width="20%" height="2%" align="center">Στόχος: 6000 Ευρώ<br></th>
        <th class="ex1" width="20%" height="5%" align="center">Δωρητές: 4<br><br><a href = "test1.html">Περισσότερα..</a></th>
      </tr>   
    </table>
    </body>
</html>
XPHSTOS_ Experienced

XPHSTOS_

Δημοσ.
Δημοσ. 
<html>

  <head>

    <title>Έρανοι</title>

    <style>

      table.ex1{

        border-collapse: separate;

        }

      table.ex2 {

        border-collapse: separate;

        border-spacing: 80px 50px;

      }

      table, td, th {

        border: 2px solid black;

        }

      th.ex1 {

        border: 0px solid black;

        }

        th.ex2 {

        a:hover {

          background-color: #FF704D;

        }

        a:active {

         background-color: #FFFF00;

        }

        /* DARK LINK */

        a.dark-link {

          background: #333;

          color: #fff;

        }

        /* ΑΝ ΘΕΛΕΙΣ ΟΛΑ ΤΑ ΛΙΝΚ ΜΕΣΑ ΣΤΑ TABLE-HEADER ΝΑ ΕΙΝΑΙ ΣΚΟΥΡΑ ΤΟΤΕ ΚΑΝΕ ΑΥΤΟ */

        table > tr > th > a {

          background: #333;

          color: #fff;

        }

        } 

    </style>

  </head>

  <body>

    <table class="ex2" border="10" width="95%" height="20%" padding="2" align="center">

      <tr>

        <th class="ex1"><img src="image.jpg" width="10%" align=left></th>

        <!-- ΠΡΟΣΘΗΚΗ ΤΗΣ ΚΛΑΣΗΣ DARK-LINK -->

        <th width="20%" height="2%" align="center"><a class="dark-link" href = "test.html">Έρανοι</a></th>

        <th width="20%" height="5%" align="center"><a class="dark-link" href = "test2.html">Επικοινωνία</a></th>

      </tr>   

    </table>

    <br>

    <br>

    <br>

    <br>

    <br>

    <br>

    <table class="ex1" border="10" width="95%" height="20%" padding="2" align="center">

    <caption align="left"><b>Έρανος #123<b></caption>

      <tr>

        <th class="ex1" align="left">Στόχος είναι να συγκεντρωθούν χρήματα για........................................</th>

        <th class="ex1" width="20%" height="2%" align="center">Στόχος: 800 Ευρώ<br></th>

        <th class="ex1" width="20%" height="5%" align="center">Δωρητές: 4<br><br><a href = "test1.html">Περισσότερα..</a></th>

      </tr>   

    </table>

    <br>

    <br>

    <br>

    <table class="ex1" border="10" width="95%" height="20%" padding="2" align="center">

    <caption align="left"><b>Έρανος #124<b></caption>

      <tr>

        <th class="ex1" align="left">Στόχος είναι να συγκεντρωθούν χρήματα για........................................</th>

        <th class="ex1" width="20%" height="2%" align="center">Στόχος: 1800 Ευρώ<br></th>

        <th class="ex1" width="20%" height="5%" align="center">Δωρητές: 4<br><br><a href = "test1.html">Περισσότερα..</a></th>

      </tr>   

    </table>

    <br>

    <br>

    <br>

    <table class="ex1" border="10" width="95%" height="20%" padding="2" align="center">

    <caption align="left"><b>Έρανος #135<b></caption>

      <tr>

        <th class="ex1" align="left">Στόχος είναι να συγκεντρωθούν χρήματα για........................................</th>

        <th class="ex1" width="20%" height="2%" align="center">Στόχος: 6000 Ευρώ<br></th>

        <th class="ex1" width="20%" height="5%" align="center">Δωρητές: 4<br><br><a href = "test1.html">Περισσότερα..</a></th>

      </tr>   

    </table>

    </body>

</html>
Διάβασε τα σχόλια και πες αν δεν καταλαβαίνεις κάτι.
exarhis Rising Star

exarhis

Δημοσ.
Δημοσ. 
 table > tr > th >

Γιατί τόσος κόπος ; μπορεί απλά να βάλει 

.ex2 a

Και το th δεν είναι σωστό να έχει ίδια κλάση με το table

 

Επίσης το <a class=""> δε χρησιμοποιείτε πολύ συχνά. Καλύτερα να βάλεις 

.ex2 a {}

//and

.ex1 a {}
rafinos Grand Master

rafinos

Δημοσ.
Δημοσ.

Γιατί δεν κάνει το th να έχει ίδια κλάση με το table; :P

 

Επίσης υφίσταται το παρακάτω;

th.ex2 {
   a:hover {}
   .
   .
   .
   blah blah blah
}

Γιατί βλέπω ότι ο φίλος παραπάνω το κάνει.

exarhis Rising Star

exarhis

Δημοσ.
Δημοσ.

Γιατί δεν κάνει το th να έχει ίδια κλάση με το table; :P

 

Επίσης υφίσταται το παρακάτω;

th.ex2 {
   a:hover {}
   .
   .
   .
   blah blah blah
}

Γιατί βλέπω ότι ο φίλος παραπάνω το κάνει.

 

δε σε ειρωνεύτικα 

δε γράφω κάτι από αυτά που λες ότι γράφω

 

Είναι λάθος να έχει την ίδια class table και th . Το ότι δε γράφει ERROR είναι γιατί η καλή HTMLR. Και αν είναι σωστό δε κάνει απολύτος τίποτα

Καλησπέρα σε όλους, έχω μια απορία για μια πολύ εύκολη εντολή αλλά δεν την ξέρω και θα ήθελα την βοήθεια σας, υγ: πριν λίγο καιρό ξεκίνησα με html/css, πως γίνεται εάν ήδη βρισκόμαστε στη σελίδα αυτή που είμαστε, το στοιχείο με το λινκ να είναι έντονα μαύρο, στο background δηλαδή.

Φίλε δες στη google πως μπορείς να αλλάξεις το background σε css και εφάρμοσέ το σε αυτό το σημείο :

table.ex2 {

background-color:black;

...

}

rafinos Grand Master

rafinos

Δημοσ.
Δημοσ.

Δε σε ειρωνεύτηκα ούτε εγώ και δεν είπα κάτι για σένα.

 

Η πρώτη ερώτηση είχε αυτό :P γιατί θεώρησα ότι είναι χαζό καθώς έπρεπε να γνωρίζω το γιατί αν και η απάντηση σου δε με διαφώτισε.

 

Το παρακάτω που γράφω αν ανατρέξεις λίγες απαντήσεις πιο πάνω θα το δεις και η ερώτηση πήγαινε σε εσένα που φαίνεται να γνωρίζεις παραπάνω πράγματα. ;)

 

Για του λόγου του αληθές κάνει αυτό:

th.ex2 {
        a:hover {
          background-color: #FF704D;
        }
        a:active {
         background-color: #FFFF00;
        }
        /* DARK LINK */
        a.dark-link {
          background: #333;
          color: #fff;
        }
        /* ΑΝ ΘΕΛΕΙΣ ΟΛΑ ΤΑ ΛΙΝΚ ΜΕΣΑ ΣΤΑ TABLE-HEADER ΝΑ ΕΙΝΑΙ ΣΚΟΥΡΑ ΤΟΤΕ ΚΑΝΕ ΑΥΤΟ */
        table > tr > th > a {
          background: #333;
          color: #fff;
        }
}
angmar Grand Master

angmar

Δημοσ.
Δημοσ.

rafinos, το κομμάτι CSS που παρέθεσες δεν κάνει τίποτα, γιατί μέσα στο selector έχουν μπει άλλοι selectors αντί να μπουν styles.

 

Επίσης, αυτό 

table > tr > th > a {

είναι τελείως περιττό, κάνει ακριβώς το ίδιο με αυτό

th > a { /* μπορεί να χρειαστεί class στο th, ανάλογα με το specificity */

επίσης το σχόλιο

/* ΑΝ ΘΕΛΕΙΣ ΟΛΑ ΤΑ ΛΙΝΚ ΜΕΣΑ ΣΤΑ TABLE-HEADER ΝΑ ΕΙΝΑΙ ΣΚΟΥΡΑ ΤΟΤΕ ΚΑΝΕ ΑΥΤΟ */

δεν είναι σωστό. Το style θα εφαρμοστεί μόνο σε anchor elements που είναι άμεσοι απόγονοι του th, αν το th έχει ένα p tag κι αυτό περιλαμβάνει ένα a, το style δε θα εφαρμοστεί εκεί. 

rafinos Grand Master

rafinos

Δημοσ.
Δημοσ.

rafinos, το κομμάτι CSS που παρέθεσες δεν κάνει τίποτα, γιατί μέσα στο selector έχουν μπει άλλοι selectors αντί να μπουν styles.

 

Επίσης, αυτό

 

Εμ αυτό είπα και εγώ. :D

pandemic21 Contributor

pandemic21

Δημοσ.
  • Μέλος
Δημοσ.

Παιδια σας ευχαριστω ολους για τις απαντησεις απλα δεν τρεχει τιποτα απο αυτα, σας στελνω την εικονα ετσι ακριβως οπως μου το ζητανε

post-344422-0-81020400-1432379063_thumb.png

exarhis Rising Star

exarhis

Δημοσ.
Δημοσ.

Παιδια σας ευχαριστω ολους για τις απαντησεις απλα δεν τρεχει τιποτα απο αυτα, σας στελνω την εικονα ετσι ακριβως οπως

μου το ζητανε

 

Καλησπέρα φίλε, μάλλον μπορώ να σε βοηθήσω.

 

Πρώτα πρέπει να βάλεις και το ex3 στο μενού που θα δείχνει ότι είναι στη σελίδα που βρίσκετε , στο μέρος του κώδικα αυτου βάλε το ex3 (αντικατέστησε με ότι θες τη φράση ex3)

πχ είναι στη σελίδα Έρανοι

<table class="ex2" border="10" width="95%" height="20%" padding="2" align="center">
      <tr>
        <th class="ex1"><img src="image.jpg" width="10%" align=left></th>
        <th width="20%" height="2%" align="center" class="ex3"><a href = "test.html">Έρανοι</a></th>
        <th width="20%" height="5%" align="center"><a href = "test2.html">Επικοινωνία</a></th>
      </tr>   
    </table>

Πάνω στo css section πρόσθεσε αυτό :

.ex3 {
background-color:gray;
}

Σε όποια σελίδα είναι επιλεγμένη βάλε το class="ex3" στο th για να εμφανίζετε με το φόντο που θέλεις. Άν δε σου έλυσα την απορία ρώτα να σου απαντήσει κάποιο άλλο μέλος του insomnia.

pandemic21 Contributor

pandemic21

Δημοσ.
  • Μέλος
Δημοσ.

Καλησπέρα φίλε, μάλλον μπορώ να σε βοηθήσω.

 

Πρώτα πρέπει να βάλεις και το ex3 στο μενού που θα δείχνει ότι είναι στη σελίδα που βρίσκετε , στο μέρος του κώδικα αυτου βάλε το ex3 (αντικατέστησε με ότι θες τη φράση ex3)

πχ είναι στη σελίδα Έρανοι

<table class="ex2" border="10" width="95%" height="20%" padding="2" align="center">
      <tr>
        <th class="ex1"><img src="image.jpg" width="10%" align=left></th>
        <th width="20%" height="2%" align="center" class="ex3"><a href = "test.html">Έρανοι</a></th>
        <th width="20%" height="5%" align="center"><a href = "test2.html">Επικοινωνία</a></th>
      </tr>   
    </table>

Πάνω στo css section πρόσθεσε αυτό :

.ex3 {
background-color:gray;
}

Σε όποια σελίδα είναι επιλεγμένη βάλε το class="ex3" στο th για να εμφανίζετε με το φόντο που θέλεις. Άν δε σου έλυσα την απορία ρώτα να σου απαντήσει κάποιο άλλο μέλος του insomnia.

Σε ευχαριστω πολυ φιλε μου αυτο δουλεψε!!! 

Δημιουργήστε ένα λογαριασμό ή συνδεθείτε για να σχολιάσετε

Πρέπει να είστε μέλος για να αφήσετε σχόλιο

Δημιουργία λογαριασμού

Εγγραφείτε με νέο λογαριασμό στην κοινότητα μας. Είναι πανεύκολο!

Δημιουργία νέου λογαριασμού

Σύνδεση

Έχετε ήδη λογαριασμό; Συνδεθείτε εδώ.

Συνδεθείτε τώρα
 Share
Προς την λίστα θεμάτων
  • Δημιουργία νέου...