Verwandte Themen

Frage
von crRaphi
20.11.2021, 19:11
Navigation ausklappbar <html/CSS>?

Hallo,

ich möchte eine Navigation bauen, die wenn man hovert noch Unterpunkte anzeigt. Ich habe es so gemacht und komme leider nicht mehr weiter, wenn sich die Navigation ausklappt soll es ganz oben angezeigt werden. Ich habe einen Button unter der Navigation und als ich es selbst versucht hatte, zeigte es mir das Ausgeklappte hinter dem Button.

HTML:

    <header>
        <nav>
            <ul>
                <li><a href="">Hallo</a>
                    <ul>
                        <li><a href="">Hallo</a></li>
                    </ul>
                </li>
                <li><a href="">Hallo</a>
                    <ul>
                        <li><a href="">Hallo</a></li>
                        <li><a href="">Hallo</a></li>
                    </ul>
                </li>
                <li><a href="">Hallo</a></li>
                <li><a href="">Hallo</a></li>
                <li><a href="">Hallo</a></li>
                <li><a href="">Hallo</a></li>
            </ul>
        </nav>


    </header>

CSS:

header ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background-color: darkblue;
  height: 1.5cm;
  
}


header li {
  float: left;
}


header li a {
  display: block;
  color: white;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}


header li a:hover:not(.active) {
  background-color: rgb(195, 251, 255);
  color: black;
  height: 29px;
  font-weight: bolder;
}


header .active {
  background-color: #00e1ff;
  height: 21px;
  height: 29px;
  font-weight: bolder;
  color: darkblue;
}

Ich hoffe, dass mir irgendjemand helfen

Danke im voraus

Ps.: Das "Hallo" ist ein Platzhalter.

HTML, Programmierer, programmieren, CSS, Programmiersprache, Webdesign, Visual Studio Code
1 Antwort
Frage
von MrHibo
06.11.2021, 23:15
Mit Bildern
Einzelne Schriften in HTML Bearbeiten?

Hallo,

ich habe vor kurzem begonnen eine Website mit HTML zu programmieren, dazu nutze ich Visual Studio Code, aber ich mache das ganz noch nicht so lange, also kenne ich mich noch nicht so gut aus. Zurzeit versuche ich eine Tabelle mit verschiedenen Raritäten zu erstellen. Dazu soll z.B. "Rare" einen blauen Rahmen bekommen, so ähnlich wie in Bild 1 zusehen.

Ich habe schon versucht es zu schaffen, dennoch habe ich bisher nur hinbekommen um alles einen Rahmen zu kreieren.

Meine Frage ist nun, wie man das individuell anpassen kann. So brauche ich die Rahmen nur bei den Namen der Raritäten und diese sollen jeweils eine eigene Farbe haben (z.B. "Rare" = blau, "Epic" = Violett usw.). Außerdem soll der Rahmen genau passen. So ist es bei mir oben so, dass es für "Uncommon" passt, aber für "Epic" viel zu groß ist. Meine Skills in HTML reichen bisher nur die Rahmen für alle zu machen. Ich habe den Style so gemacht:

CSS:

table tr td
{
  font-size: 1.2em;
  background: #fff;
  color: black;
  border-radius: 20px;
  padding: 4px 10px;
}

Vermutlich nicht besonders gut, aber da hoffe ich auf eure Hilfe 😅 Falls es euch etwas hilft, schreib' ich hier noch ein Beispiel hin, wie ich die Tabelle gemacht habe (das Richtige ist natürlich länger)

HTML:

<table>
  <thead>
    <tr>
      <th>Eyes</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Normal</td>
      <td>23.99%</td>
      <td>Common</td>
    </tr>
  </tbody>
  <tfoot>
  </tfoot>
</table>
Bild zum Beitrag
Computer, HTML, programmieren, CSS, Webdesign, Visual Studio Code
5 Antworten
Frage
von MrHibo
20.10.2021, 03:11
Mit Bildern
Mit Links
Fehler in Visual Studio Code?

Hallo,

ich habe versucht dieses Video nachzuarbeiten: https://www.youtube.com/watch?v=N1_7ahk_oms

Nun bin ich schon bei ich glaube ca. min 18 angelangt, jedoch nachdem ich meine % Angaben hinter das # geschrieben habe und dann per node index.js generieren möchte,

erscheint dieser Fehler:

(node:6776) UnhandledPromiseRejectionWarning: Error: ENOENT: no such file or directory, scandir 'C:\Users\justu\Documents\NFT Kroko\hashlips_art_engine-1.0.2_update\hashlips_art_engine-1.0.2_update/layers/Eyeball/'

at Object.readdirSync (fs.js:1047:3)

at getElements (C:\Users\justu\Documents\NFT Kroko\hashlips_art_engine-1.0.2_update\hashlips_art_engine-1.0.2_update\src\main.js:56:6)

at C:\Users\justu\Documents\NFT Kroko\hashlips_art_engine-1.0.2_update\hashlips_art_engine-1.0.2_update\src\main.js:73:15

at Array.map (<anonymous>)

at layersSetup (C:\Users\justu\Documents\NFT Kroko\hashlips_art_engine-1.0.2_update\hashlips_art_engine-1.0.2_update\src\main.js:70:30)

at startCreating (C:\Users\justu\Documents\NFT Kroko\hashlips_art_engine-1.0.2_update\hashlips_art_engine-1.0.2_update\src\main.js:188:20)

at Object.<anonymous> (C:\Users\justu\Documents\NFT Kroko\hashlips_art_engine-1.0.2_update\hashlips_art_engine-1.0.2_update\index.js:6:3)

at Module._compile (internal/modules/cjs/loader.js:1085:14)

at Object.Module._extensions..js (internal/modules/cjs/loader.js:1114:10)

(Use `node --trace-warnings ...` to show where the warning was created)

(node:6776) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `--unhandled-rejections=strict` (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 1)

(node:6776) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not

Hoffentlich könnt ihr mir helfen :)

Bild zum Beitrag
Computer, programmieren, Visual Studio, Visual Studio Code, NFT
3 Antworten

Meistgelesene Fragen zum Thema Visual Studio Code
Mehr meistgelesene Fragen zu Visual Studio Code