Verwandte Themen

MarlonStrich
16.12.2023, 14:49
Habe eine Frage zu meinem HTML/CSS Code?

Und zwar erstelle ich eine kleine Seite mit Steckbriefen über ein paar Tiere.
Mein Problem gerade ist, dass ich im Header 5 links erstellt habe mit einem Bild von einem Tier und den jeweiligen Tiername.
Aber leider wird nur bei dem Elefanten der Tiername über dem Bild angezeigt.Bei allen anderen stehen diese nebeneinander. Warum? Haben alle die gleichen CSS eigenschaften.

<!DOCTYPE html>
<html lang="en">
 <head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>Document</title>
  <link rel="stylesheet" href="style.css" />
 </head>
 <body>
  <div>
   <header>
    <div class="ganzer-ctn-header">
     <div class="überschrift">
      <h1>Steckbriefe über verschiedene Tierarten</h1>
     </div>
     <div class="tier-ctn">
      <div class="elefant-ctn">
       <a href="elefant.html"><p> Elefant</p> <img src="elefant.png" /></a>
      </div>
      <div class="hase-ctn">
        <a href="hase.html">Hase
          <img src="hase.png" /><a>
      </div>
      <div class="löwe-ctn">
        <a href="löwe.html"> Löwe<img src="loewe.png" /></a>
      </div>
      <div class="affe-ctn">
        <a href="affe.html"> Affe<img src="affe.png" /></a>
      </div>
      <div class="wal-ctn">
         <a href="wal.html">Wal <img src="wal.png" /></a>
      </div>
     </div>
    </div>
   </header>
   <section class="section-eichhörnchen">
  <h2>Eichhörnchen</h2>
  <div>
   <div>
    <h3>Steckbrief Eichhörnchen</h3>
   </div>
   <div class="inhalt-ctn">
    <div class="merkmal">
     Größe
    </div>
 
    <div class="antwort">
     15-20cm
    </div>
   </div>
  
   <div class="inhalt-ctn">
    <div class="merkmal">
     Geschwindigkeit
    </div>
 
    <div class="antwort">
     Bis 25 Km/h
    </div>
   </div>
   <div class="inhalt-ctn">
    <div class="merkmal">
     Gewicht
    </div>
 
    <div class="antwort">
     200-400 g
    </div>
   </div>
   <div class="inhalt-ctn">
    <div class="merkmal">
     Lebensdauer
    </div>
 
    <div class="antwort">
     3 Jahre
    </div>
   </div>
   <div class="inhalt-ctn">
    <div class="merkmal">
     Nahrung
    </div>
 
    <div class="antwort">
     Nüsse, Samen, Eicheln, Pilze, Beeren, Eier
    </div>
   </div>
   <div class="inhalt-ctn">
    <div class="merkmal">
     Feinde
    </div>
 
    <div class="antwort">
     Schlangen, Wiesel, Adler, Habichte
    </div>
   </div>
   <div class="inhalt-ctn">
    <div class="merkmal">
     Verbreitung
    </div>
 
    <div class="antwort">
     Amerika, Europa, Asien
    </div>
   </div>
   <div class="inhalt-ctn">
    <div class="merkmal">
     Lebensraum
    </div>
 
    <div class="antwort">
     Wald
    </div>
   </div>
  </div>
   </section>
  </div>
 </body>
</html>

.inhalt-ctn{
  display: flex;
  
}
body{
  background: linear-gradient(#008000,#7fff00 )
}
 
.merkmal{
  background-color: grey;
  height: 40px;
  width:300px;
}
.section-eichhörnchen{
  margin-left: 200px;
}
.tier-ctn{
display: flex;
justify-content: center;
align-items: center;
}
.elefant-ctn , .wal-ctn, .affe-ctn, .löwe-ctn, .hase-ctn{
margin-left: 70px;
}
.elefant-ctn{
width: 120px;
height: 100px;
background-color: aqua;
display: flex;
align-items: center;
justify-content: center;
background-color: white;
}
.wal-ctn{
  
 
width: 120px;
height: 100px;
background-color: aqua;
display: flex;
align-items: center;
justify-content: center;
background-color: white;
}
.affe-ctn{
  width: 120px;
  height: 100px;
  background-color: aqua;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: white;
}
.löwe-ctn{
  width: 120px;
  height: 100px;
  background-color: aqua;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: white;
}
.hase-ctn{
  width: 120px;
  height: 100px;
  background-color: aqua;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: white;
  flex-direction: column;
}
Technik, IT, JavaScript, Webentwicklung, Webseitenoptimierung, Internetseite erstellen, Visual Studio Code
2 Antworten
MrOsmo
15.12.2023, 08:38
JavaScript Server API Hilfe?

Hallo,

meine Aufgabe:

wenn ich zum Beispiel bei login: babyshark2 schreibe und bei password: 123, und dann auf "send" drücke, dann werden ja diese Daten und zusätzlich noch isLogin: false auf Backend Server geschickt. Wenn ich aber beim zweiten Mal nochmal diese inputs mit den gleichen Daten ausfülle (babyshark2, 12) und dann aber auf "login" drücke, dann sollte das Programm zwischen alle Loginnamen genau diesen Loginname (babyshark2) finden, und falls das Passwort auch richtig ist, dann sollte das isLogin: auf true gesetzt werden. Aber ich verstehe gar nicht wie ich das weitermachen soll. Bitte helft mir!

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>CRUD</title>
  <link rel="stylesheet" href="./style.css">
  <script defer src="./script.js"></script>
</head>
<body>
  <form class="form">
    <input id="loginInput" type="text" placeholder="Login">    
    <input id="passwordInput" type="password" placeholder="Password">    
    <button id="sendButton">Send</button>
    <button id="loginButton">Login</button>
    <p class="p">If you want to delete an Item press the button "Delete" twice to confirm it!</p>


    <div id="userTable"></div>
  </form>
</body>
</html>

JAVASCRIPT IST IN DEN KOMMENTAREN; DA ES HIER NICHT PASST!

MfG

MrOsmo

Software, HTML, IT, Webseite, programmieren, JavaScript, HTML5, Code, Informatik, Programmiersprache, Webentwicklung, Frontend
2 Antworten
MrOsmo
14.12.2023, 19:47
Mit Links
javascript api probleme?

Hallo,

guckt euch mal meinen Code an.

JAVASCRIPT:

// INPUT
const login = document.getElementById("loginInput");
const password = document.getElementById("passwordInput");
const button = document.getElementById("sendButton");


// FETCH
const url = "https://crudcrud.com/api/4b3acc467d8c47d8a608bb9820171935/todos"



const dataRender = (array) => {
  if (array === undefined) {
    console.log("Loading results...");
  } else {
    let dataList = array.map((item) => {
      return `
      <div class="users">
        <p>${item.login}</p>
        <button onclick="deleteRequest(${item.id})">Delete</button>
        </div>
        `;
    });
    const getHtml = document.getElementById("userTable");
    getHtml.innerHTML = dataList.join("");
  }
};


const fetchData = async () => {
  try {
    const response = await fetch(url);
    const data = await response.json();
    dataRender(data);
  } catch (error) {
    console.error(error);
  }
};



fetchData();


const postRequest = async () => {
  const data = {
    login: login.value,
    password: password.value,
    isLogin: false,
  };


  try {
    const response = await fetch(url, {
      method: "POST",
      headers: {
        "Content-Type": "application/json",
      },
      body: JSON.stringify(data),
    });


    const results = await response.json();
    console.log(results.message);
  } catch (error) {
    console.error(error);
  }


};


button.addEventListener("click", postRequest);


const deleteRequest = async (id) => {
  try {
    const response = await fetch(`${url}/${id}`, {
      method: "DELETE",
      headers: {
        "Content-Type": "application/json",
      }
    })
    const results = await response.json()
    console.log(results.message);
  }
  catch (error) {
    console.error(error);
  }
}

HTML:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>CRUD</title>
  <script  defer src="./script.js"></script>
</head>
<body>
  <form>
    <input id="loginInput" type="text" placeholder="Login">    
    <input id="passwordInput" type="password" placeholder="Password">    
    <button onclick="" id="sendButton">Send</button>


    <div id="userTable">
      
    </div>
  </form>
</body>
</html>

Mein Ziel:

Wenn ihr auf das button "Send" drückt, dann erscheint ja der value von dem input "login" auf HTML (innerHTML heisst das glaube ich). Und zusammen mit dem value erscheint auch ein anderer Button namens "Delete". Mein Ziel ist es, dass wenn ich auf "Delete" drücke, dann sollte das item aus Backend-Server und aus HTML gelöscht werden. Aber das klappt bei mir die ganze Zeit nicht. Einfacher ist es wenn ihr meinen Code einfügt und selber mal den Code testet, dann werdet ihr verstehen, was ich machen will.

Bitte helft mir! Ich sitze schon wirklich lange dranrum und ohne Erfolg!

Dankeschön im Voraus!

MfG

MrOsmo

Software, App, HTML, IT, Webseite, programmieren, JavaScript, HTML5, Code, Informatik, Programmiersprache, Webentwicklung, Frontend
1 Antwort
Inkognito-Nutzer
12.12.2023, 19:18
Beitrag wurde 1 Mal erneut eingestellt
Mit Umfrage
Sind diese Tätigkeiten für ein Administrator oder IT Support bezogen?

Ich bewerbe mich um eine IT Stelle aktuell. Laut Titel heißt die Stelle Local IT für den Standort XY. Für das lokale Infrastrukur Team suchen wir demnächst ein local IT für den Standort:

Tätigkeiten:

  • Manage Request, Incident, Demand and RfC tickets according to ITIL standards.
  • Research and troubleshooting for complex incidents in the network area
  • 3-Tier Enterprise, DataCenter and Telephony infrastructure administration, maintenance, monitoring and upgrade based on Cisco Catalyst/Nexus and Alcatel OmniPCX
  • Usage of Cisco DNA Center and Cisco ISE
  • Local administration of WLAN infrastructure and external guest WiFi
  • Documentation of the hardware and cabling
  • Plan, deploy and implement hardware/software based migration and lifecycle projects
  • Manage, configure and maintain the NAC and Port Security endpoint functionality of the following sites: X,Y,Z.
  • Manage DNS entries, DHCP pools and Active Directory group memberships
  • Cooperation with internal and external consulants/services - production, logistics and facility management
  • Responsability for the acquisition of the network/telephony hardware and materials.

I.e: Switches, IP Telefony, fibre optics, CAT5/6 cables, licenses

Ich habe dieses Jahr meine Ausbildung zum Fachinformatiker Systemintegration beendet und suche ein Stelle wo ich mich zum Administrator spezialisieren kann nach der Ausbildung

Beides 50%
Administrator 25%
IT Support 25%
Beruf, Schule, Elektronik, IT, Ausbildung, Network, Cisco, Fachinformatiker, IT-Spezialist, IT-Systemelektroniker, netzwerkadministrator, Netzwerktechnik, Alcatel
3 Antworten
Jackie106
13.12.2023, 12:10
Mit Bildern
macOS Catalina Startvolume auf Partition Hilfe?

Hallo Community, ich habe das Internet leer gegoogelt und keine Antwort auf mein Problem gefunden. Ich habe einen iMac 21" late 2013, der umbedingt noch etwas aushalten muss.

was bisher geschah:

  • Ich wollte den iMac neu aufsetzen, damit dieser ein wenig schneller läuft..
  • macOSCatalina mittels eines Booting USB Sticks heruntergeladen
  • (im alt(+r)modus):
  • Festplatten wurden nicht erkannt, daher Festplatten mehrmals gelöscht und in APSFS umgewandelt.
  • Eine Partition mit 40GB wurde angezeigt, darauf habe ich Catalina installiert
  • Weil keine andere Auswahlmöglichkeit, System auf der Partition gestartet

Großes ?:

Der iMac läuft nun auf macOS Catalina, allerdings auf der 40GB Partition, bzw. einer Kopie mit der Endung "- Daten", die der Mac erstellt hat.

Ich komme einfach nicht dahinter, wie man den Speicher dieser Partition erweitern könnte, damit meine Uni Programme laufen.

Meine original 1TB Festplatte (s.o. Macintosh HD) wird im Festplattendienstprogramm angezeigt und ich kann im Finder Dateien draufschmeißen, aber ich kann dieses Ding nicht als Starvolume umwandeln. Weder im Festplattendienstprogramm, noch im alt-Modus beim Hochfahren.

Ich habe keine Ahnung was ich mit der Drive "Ohne Titel" gemacht habe, aber ich traue mich nicht sie zu löschen.

Vielleicht kann ja wer helfen, wäre super dankbar!

Liebe Grüße, Jackie

Bild zum Beitrag
Apple, IT, Festplatte, Mac OS X, iMac, macOS, Partition, Volume, Catalina, macOS Catalina
2 Antworten

Meistgelesene Beiträge zum Thema IT
Mehr meistgelesene Fragen zu IT