Ankündigung

Einklappen
Keine Ankündigung bisher.

links in Spalten verteilen

Einklappen

Neue Werbung 2019

Einklappen
X
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • #16
    Zitat von hellbringer Beitrag anzeigen
    Ohne die nötigen Informationen zu haben, kann man keine passende Lösung empfehlen.
    Dem stimme ich zu. Und mit nachträglichen Wünschen/Anforderungen kann auch jeder Vorschlag zunichte gemacht werden.

    Zum Schlagwort nth-child noch eine Ergänzung zum CSS aus #12:
    Code:
          ul#columnlist li:nth-child(3n+1){
            background-color: green;
          }  
          ul#columnlist li:nth-child(3n+2){
            background-color: yellow;
          }
          ul#columnlist li:nth-child(3n+3){
            background-color: blue;
          }
    Damit bekommt jede "Spalte" eine andere Hintergrundfarbe. Dafür ein background-image zu nehmen sollte dann nicht mehr schwer sein.

    Kommentar


    • #17
      Geplant wahr es je nach Bildschirmbreite verschiedene Spalten anzuzeigen. Auch wollte ich die Links vor sortieren ( zb wo Basti im Link steht in der rechten Spalten anzuzeigen und so was in der art).
      Das wahr eigentlich mein haupt gedanke das mit Php zu machen. Wenn ich das vor Sortieren weg lasse und nur die Spalten anzahl auf der Bildschirmbreite anpasse gebe ich jspit recht und könnte es mit Css machen.
      Das werde ich jetzt auch mal versuchen ob das Endergebniss so aussieht wie ich es wollte.

      Eine Frage habe ich aber trotzdem noch zu meinen ersten vorhaben. Ich habe es auch mit Php hinbekommen,aber mit einen Weg wo ihr wieder alle lachen tut.
      Auch wenn die Php Variante jetzt erstmal nicht mehr gebraucht wird ( weil ich es erst mit css versuche ) würde ich doch wissen ob es für meinen Code eine kurz Variante geben würde ?

      Ich habe nur den Teil rauskopiert um den es jetzt in der Frage geht
      PHP-Code:
               if($raus==false){
                                
      $plus++;
                                
      $remove2 = array('-''+''_');
                                
      $phrase2 str_replace($remove2" "$phrase);

                                
      $first=array(1,4,7,10,13,16,19,22,25,28,31,34,37,40,43,46,49,52,55,58,61,64,67,70,73,76,79,82,85,88,91,94,97,100);
                                
      $second=array(2,5,8,11,14,17,20,23,26,29,32,35,38,41,44,47,50,53,56,59,62,65,68,71,74,77,80,83,86,89,92,95,98,101);
                                
      $third=array(3,6,9,12,15,18,21,24,27,30,33,36,39,42,45,48,51,54,57,60,63,66,69,72,75,78,81,84,87,90,93,96,99,102);                

                                if (
      in_array($plus$first)) {
                                     
      $links.='<a href="'.$verzeichnis.$file.'">'.$phrase2.'</a>';
                                }    
                                 if (
      in_array($plus$second)) {
                                      
      $mitte.='<a href="'.$verzeichnis.$file.'">'.$phrase2.'</a>';
                                }                          
                                 if (
      in_array($plus$third)) {
                                      
      $rechts.='<a href="'.$verzeichnis.$file.'">'.$phrase2.'</a>';
                                }    
                  }else{
                                
      $raus=false;
                  } 
      Könnte man den Teil einfacher gestalten ? Wenn es jetzt zb 1000 Links geben würde wären die 3 arrays ja ewig lang und wenn ich 4 Spalten haben wollte wären die 3 arays ja wieder unnutz
      Ich mach keine Rechtschreibfehler - ich schreib Freestyle!
      Erreichbar in mein Javascript-Forum und in Facebook-Chat

      Kommentar


      • #18
        Du brauchst deine Arrays nicht, da du dir so etwas wie deine Spalte ganz einfach berechnen kannst. Schau dir dazu mal das folgende Beispiel an und versuche es zu verstehen:

        PHP-Code:
        for($i=1$i 7$i++){
          
        $imod $i%3;
          
        $column $imod $imod 3;
          echo 
        "spalte=".$column.": i=".$i."<br>";

        Outputs

        spalte=1: i=1
        spalte=2: i=2
        spalte=3: i=3
        spalte=1: i=4
        spalte=2: i=5
        spalte=3: i=6

        LG jspit

        Kommentar


        • #19
          Geplant wahr es je nach Bildschirmbreite verschiedene Spalten anzuzeigen. Auch wollte ich die Links vor sortieren ( zb wo Basti im Link steht in der rechten Spalten anzuzeigen und so was in der art).
          Die Flexbox war ja schon in #6, grid in #12 braucht fehlt nur noch responsive ....

          Kommentar


          • #20

            Zitat von protestix Beitrag anzeigen
            Günni

            Bei dir finde ich es nicht gut umgesetzt. Zum einen hast du inline CSS drin und zum anderen ist das EVA Prinzip nicht gut umgesetzt.
            Eine Liste nur mit CSS Flexbox zu teilen in drei Divs oder andere Eemente (UL, OL) geht nicht, da braucht man auch eine andere Sprache für, wie du ja auch zeigst.
            Zeig' mir mal, wo Inline-CSS ist.

            EVA Prinzip nicht gut umgesetzt??

            Die Eingabe(Abfrage) findet vor der Ausgabe statt. Was ist da nicht gut umgesetzt?

            Kommentar


            • #21
              @Günni
              Gut, hast recht, ist kein Inline-CSS drin, da habe ich mich durch irgendwas(flex-item?) wohl irritieren lassen, dafür entschuldige ich mich, dass ich dir das unterstellt habe.

              Zum EVA Prinzip.
              Da finde ich diese Variante besser:
              PHP-Code:
              <?php
              ...
              $html_navlist null;

              for(
              $i=0;$i<count($files);$i++){

                  if( (
              $i%=== 0) && ($i 1) ) { $html_navlist .= "</ul>\n<ul>\n"; }

                  
              $html_navlist .= '<li><a href="' $files[$i] . '">' $files[$i] . '</a>' "\n";

              }  

              $html_navlist "<ul>\n" $html_navlist "</ul>\n";

              ?>

              <!DOCTYPE HTML>
              <html lang="de">
              <head>
              <meta charset="utf-8" />
              <title>Untitled</title>
              <style type="text/css">
                  nav ul {
                      display:flex;
                  }
                  nav ul li{
                      list-style: none;
                      width: 400px;
                  }
              </style>
              </head>
              <body>

              <nav>
              <?= $html_navlist?>
              </nav>

              </body>
              </html>
              Es kommt der Trennung von PHP und HTML näher und ist einfacher in Templatesyssteme zu übertragen.

              Wie du siehst habe ich auch keine Klassen verwendet, da so der auszugebende Code schlanker wird, aber das ist nur Nebensache.

              Kommentar


              • #22
                Kontextwechsel wird nicht beachtet und es ist halt fix auf 3 Spalten programmiert und nicht abhängig von der Bildschirmbreite. Ich würde solche Darstellungsthemen immer mit CSS und nicht mit HTML lösen. Denn CSS sollte fürs Aussehen zuständig sein und nicht HTML.

                Kommentar


                • #23
                  hellbringer, das wurde schon vorab angesprochen.

                  Kommentar

                  Lädt...
                  X