Also ich bin ja noch ziemlich am Anfang von HTML usw. aber höre sehr oft von "Wordpress". Das ist ja scheinbar eine Seite, mit der man eine Webseite erstellen kann, ohne coden zu müssen. Ist es dann nicht überflüssig trotzdem noch HTML zu lernen? Also klar, man kann dann Probleme die auftreten könnten beheben, aber lohnt es sich dann dafür das zu lernen? Also es kann auch sein, dass ich einfach ein bisschen lost bin, aber es scheint mir halt nicht so sinnvoll, weil es davon ja schon eine Hand voll gibt. Das Ding ist, ich bin zurzeit 15 und will halt anstatt Videospiele zu spielen, schon einmal etwas lernen, was mich später weiterbringt (und womit ein mein Geld und zwar ganz gutes Geld verdienen kann) und Webseiten zu coden interessiert mich halt auch mega (mehr als Spiele oder Programme etc. zu programmieren), aber es motiviert mich halt nicht es zu lernen, wenn es dann sowieso eine Seite gibt, mit der du das sehr leicht machen kannst und man (also ich zumindest) davon hört, dass die Seite immer beliebter wird und immer mehr Seiten des www´s mit dieser Seite erstellt werden (30% des www´s stand 5.3.2018).
Beiträge von luca_luca
-
-
Moin moin
Ich frage mich gerade, ob es sich noch lohnt HTML, CSS und alles was dazu gehört zu lernen, oder ob es unnötig ist da es ja jetzt Webseiten gibt mit denen man wiederum neue Webseiten erstellen kann. Man muss noch bedenken, dass man eine Weile brauch, um eine perfekte Webseite mit HTML etc. erstellen zu können. Also sagen wir ich würde 2022 so gut sein, dass ich eine gute Webseite erstellen kann um dafür dann auch Geld zu verlangen. Findet ihr das es sich dann noch lohnen würde, oder sollte ich dann lieber eine andere "Branche" wählen. Bestimmt wird es in 2022 noch Leute geben, die einen dafür bezahlen ihre Webseite zu erstellen aber ich meine ich will dann auch nicht aufpassen, dass ich nicht zu viel Geld ausgebe und will dann nicht immer auf mein Kontostand gucken und mich fragen wie ich den Monat überlebe(wenn ihr versteht was ich meine) .
-
kannst du mal eine skizze oder Bild erstellen wie das aussehen soll ?
Man müßte eigentlich noch einige sachen ändern um das "richtig" zu machen.
positions angaben und float brauch man bei flexbox eigentlich nicht.
-
Alles anzeigen
Schuld daran sind die Positionierungen, wie es ja schon gesagt wurde.
Das machst du an besten mit Flexbox.
http://www.css-wiki.com/listings/flexbox.html
Ich weiß nicht wie das aussehen soll bei dir deswegen habe ich da jetzt nix großartiges gemacht.
https://codepen.io/basti1012/pen/QWwqKBL
Mit der Anleitung und den kleinen Beispiel solttest du es nochmal versuchen.
Falls du dann nicht weiter kommst poste bitte deinen aktuellen Code hier in den Codetags ( </> ) oder erstelle wie ich es gemacht habe ein Codepen , dann ist das helfen einfacher
Moin ich nochmal, also ich habe jetzt das mit dem flex probiert (https://codepen.io/Wasguckstdu/pen/abzLaBN) aber jetzt verstehe ich nicht wie ich meine main-nav nach rechts verschiebe (also eigentlich justify-content= flex-end oder?).
-
Der Grund ist, dass dein div.hero die Navigation überdeckt, so dass die Mausaktionen nicht an die a-Elemente gelangen. Kurzfristige Lösung: Dem div.hero ein pointer-events: none; geben, das macht es durchlässig für Mausaktionen.
Längerfristig gedacht ist es häufig so, dass absolute Positionierung und die damit verbunden Überdeckung die Ursache für Probleme sind, so wie hier. Nach Möglichkeit darauf verzichten.
Hii ich nochmal, ich habe das mit diesem pointer-events: none; gemacht und es ging auch eine Zeit lang, jetzt habe ich aber ein bisschen weiter geübt und habe jetzt das gleiche Problem nur diesmal kann ich meine Buttons aus dem div.hero nicht mehr benutzen
ich bin halt noch sehr neu und weiß deswegen auch nicht wie man auf absolute Positionierung verzichtet, weil alles dann iwie ineinander fällt. -
Kann mir jemand sagen, warum bei dem folgendem Code mein li a Elemente aus der Nav nicht einen weißen Kasten um sich herrum bekommen wenn ich darüber hover? Also ich habe jetzt tausend mal nachgeguckt und weiß nicht woran es liegt.
<!DOCTYPE html>
<html>
<head>
<title>Test-Website</title>
<link href="https://fonts.googleapis.com/css?family=Roboto&display=swap" rel="stylesheet">
<style>
* {margin: 0; padding: 0;}
header{background-image:linear-gradient(rgba(0,0,0,0.5),rgba(0,0,0,0.5)),url(pic1.jpg); height: 100vh; background-size: cover; background-position: center; background-attachment: fixed;}
.main-nav{float: right; list-style: none; margin-top: 30px;}
.main-nav li{display: inline-block;}
.main-nav li a{color: white; text-decoration: none; padding: 5px 20px; font-family: "Roboto", sans-serif; font-size: 25px;}
.main-nav li.active a{border: 1px solid white;}
.main-nav li a:hover{border: 1px solid white;}
.logo img{width: 150px; height: auto; float: left;}
body{ font-family: monospace;}
.row{max-width: 1500px; margin: auto;}
.hero{position: absolute; width: 1900px; margin-left: 0; margin-top: 0;}
h1{color:white;text-transform: uppercase; font-size: 70px; text-align: center; margin-top: 275px;}
.button{margin-top: 30px;margin-left:782px;}
.btn{border: 1px solid white; padding: 10px 30px; color:white; text-decoration: none; margin-right: 5px; font-size: 25px; text-transform: uppercase;}
.btn-one{background-color: darkorange; font-family: "roboto", sans-serif;}
.btn-two{font-family: "Roboto", sans-serif;}
.btn-two:hover{background-color:darkorange; transition: all 0.5s ease-in;}
.about{height: 100vh;}
</style>
</head>
<body>
<!--HEADER-->
<header>
<!--NAVIGATION-->
<div class="row">
<div class="logo"><img src="logo.png" alt="Logo"></div>
<ul class="main-nav">
<li class="active"><a href="#">HOME</a></li>
<li><a href="google.com">ABOUT</a></li>
<li><a href="#">SERVICES</a></li>
<li><a href="#">NEWS</a></li>
<li><a href="#">EXERCISES</a></li>
<li><a href="#">FAQ</a></li>
<li><a href="#">CONTACT</a></li>
</ul>
</div>
<!--MESSAGE-->
<div class="hero"><h1>Are You Ready?</h1><div class="button"><a href="#" class="btn btn-one">Continue</a><a href="#" class="btn btn-two">Quit</a></div></div>
</header>
<!--ABOUT-->
<section class="about"><h2>Hallo dies ist ein Test</h2></section>
</body>
</html>
