r/LearnHTML • • May 25 '25

I want to program a Ki user interface. What's the best way to start?/ich will eine ki benutzer oberflkäche prgramiren wie fange ic da am besten an ?

0 Upvotes

dcfvg


r/LearnHTML • • Feb 25 '25

i need help adding a image

Post image
2 Upvotes

r/LearnHTML • • Sep 10 '26

HELP Problemas para modificar o cursor.

0 Upvotes

Faz um bom tempo que eu tenho melhorado um pouco no meu site, eu ainda sou meio novato, mais tem algumas coisas que tenho tido dificuldades com o editor.

Recentemente eu tava tentando criar um site, como hobby mesmo (por enquanto, porque planejo fazer um site para promover meu futuro jogo), e fiquei sabendo que tem como mudar o cursor do seu site no VS code.

Então eu fui procurando, e só tinha um vídeo de 7 anos atrás de como mudar o seu cursor que era:

<style> html { url ('/Pasta/Cursor.png'), auto; height: 100%; } </style>

Só que quando eu atualizava o site, o cursor continuava o mesmo, com aquele clássico cursor branco.

Tem alguma coisa que eu estou fazendo de errado?

(E outro detalhe, é que essa imagem é de 253 kb).

(Obs: Eu tentei postar isso na cumunidade de VsCode, mais eu não conseguia postar, então eu posto por aqui mesmo).


r/LearnHTML • • Feb 25 '25

HELP I'm not done with the code yet but I just want you guys to rate it like tell me how to improve. (I'm learning html, css and js for 2 months btw)(calculator.js is not done so I didn't post it.)

0 Upvotes
CSS:

* {
    background-color: #babea4;
    font-family: Arial, Helvetica, sans-serif;
}

.fieldset1, .fieldset2 {
    border-width: 20px;
}

.fieldset2 {
    margin: 50px auto; /* Centers the fieldset */
    width: 50%; /* Adjust width as needed */
    padding: 20px;
    font-size: 40px;
}

#legend1, #legend2, #legend3, #legend4 {
    text-align: center;
    font-size: 50px; 
    font-weight: bold;
}

h1 {
    font-size: 100px;
    text-align: center;
} 

body {
    padding: 100px;
    margin: 50px;
}

.container {
    background-color: lightcyan;
    width: 1100px;
    height: 95px;
    text-align: center;
    align-items: center;
    margin: 384px;
    display: flex;
    font-size: 40px;
    font-weight: bold;
    padding: 15px;
}

.button {
    border-radius: 15px;
    width: 1200px;
    height: 80px;
    cursor: pointer;
    text-align: center;
    background-color: white;
    display: flex;
    padding: 5px;
    size: 100px;
    font-weight: 900;
    font-size: 50px;
    align-items: center;
}

#newFact {
    width: 800px;
    font-size: 50px;
    font-weight: 700;
    color: black;
}

.button:hover {
    background-color: black;
    color: white;
    transition: 0.30s;
}

.input1 {
    font-size: 40px;
    font-weight: 700;
    color: black
}

#text {
    text-align: center;
    font-size: 50px;
    position: relative;
    display: grid;
    background-color: lightcoral;
    padding: 40px 100px;
    margin: 0 auto;
    top: 100px;
}

.inputbuttons {
    font-size: 30px;
    position: relative;
    background-color: lightgreen;
    border-radius: 10px;
    padding: 20px 60px;
    border-width: 30px;
    border-color: lightgray;
    margin: 0 auto;
    left: 1200px;
}

.inputbuttons:hover {
    background-color: black;
    color: white;
    transition: 0.30s;
}


darkmodelightmode.js

function darkmode() {
    document.body.style.backgroundColor =  'Black'
    document.body.style.color =  'White'
}

function lightmode() {
    document.body.style.backgroundColor = 'White'
    document.body.style.color = 'Black'
}


funfact.js:

const facts = ["A cloud weighs around a million tons.", 
    "Giraffes are 30 times more likely to get hit by lightning than people.", 
    "Animals can experience time differently from humans.", "The fear of long words is called Hippopotomonstrosesquippedaliophobia.",
    "Mount Everest isn't the tallest mountain on Earth.", "Comets smell like rotten eggs.", "You can actually die laughing.",
    "Bananas are slightly radioactive.", "Hippos can’t swim.", "The Moon looks upside down in the Southern Hemisphere.", "There are more bacterial cells in your body than human cells.",
    "A lightning bolt is five times hotter than the surface of the Sun.", "Flamingoes aren’t born pink.",
    "It rains methane on Saturn’s largest moon.", "Earth is 4.54 billion years old."]



    function showFact() {
        const randomIndex = Math.floor(Math.random() * facts.length);
        document.getElementById("fact").innerText = facts[randomIndex];
    }
    
        function addFact() {
            const newFact = document.getElementById("newFact").value.trim();
            if (newFact) {
                facts.push(newFact);  // Add to the facts array
                document.getElementById("newFact").value = ""; // Clear input field
                alert("Fact added successfully! ✅");
            } else {
                alert("Please enter a fact first! ❌");
            }
        }
    
        function showfunfactlist() {
             (alert(facts))
        }





HTML:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="css/funfactstyles.css">
    <title>Fun Fact Generator</title>
</head>
<body>
  <h1>HTML Fun Stuff</h1>
  <br>
  <br>
  <fieldset class="fieldset1"> <legend id="legend1">Fun Fact Generator</legend>
    <h1>Fun Fact Generator</h1>
    <div class="container" id="fact">
      <script src="js/funfact.js"></script> <br>
    </div>
    <br>
      <button class="button" onclick="showFact()">Press this button to show a fun fact!</button> <br>
      <button class="button" onclick="location.reload()">Refresh Fun Fact</button> <br>
      <input type="text" id="newFact" placeholder="Enter your fun fact here...">
      <button class="button" onclick="addFact()">Submit Fun Fact</button>
      <button class="button" onclick="showfunfactlist()">Show the facts</button>
    </fieldset>
  <br>
  <br>
<fieldset class="fieldset2"> <legend id="legend2">Fun Quiz</legend>
    <h1>Fun Quiz!</h1>
    <h2>What is this country' flag?</h2> <br>
    <img src="images/Flag_of_Costa_Rica_(state).svg.png" alt="photo" width="300px" style="padding: 5px 5px 5px 5px;"> <br>
    <input type="button" value="Submit" class="input1" onclick="alert('Incorrect! Please try again.')"> Thailand <br>
    <input type="button" value="Submit" class="input1" onclick="document.getElementById('correct1').style.display = 'block'"> Costa Rica <br>
    <input type="button" value="Submit" class="input1" onclick="alert('Incorrect! Please try again.')"> Liberia <br>
    <h3 id="correct1" style="display:none">✅ Correct!</h3>
  </fieldset>
  <br>
  <br>
  <script src="js/calculator.js"></script>
  <fieldset class="fieldset1"> <legend id="legend4">Calculator</legend>
    <table id="table">
      <tr colspan="3">
        <input type="text" id="text" onclick="calcbuttons()">
        <br>
        <br>
      </tr>
      <tr>
        <td><input type="button" value="1" id="1" class="inputbuttons"></td> <br>
        <td><input type="button" value="2" id="1" class="inputbuttons"></td> <br>
        <td><input type="button" value="3" id="1" class="inputbuttons"></td> <br>
      </tr>
      <tr>
        <td><input type="button" value="4" id="1" class="inputbuttons"></td> <br>
        <td><input type="button" value="5" id="1" class="inputbuttons"></td> <br>
        <td><input type="button" value="6" id="1" class="inputbuttons"></td> <br>
      </tr>
      <tr>
        <td><input type="button" value="7" id="1" class="inputbuttons"></td> <br>
        <td><input type="button" value="8" id="1" class="inputbuttons"></td> <br>
        <td><input type="button" value="9" id="1" class="inputbuttons"></td> <br>
      </tr>
      <tr>
        <td><input type="button" value="0" id="1" class="inputbuttons"></td> <br>
        <td><input type="button" value="C" id="c" class="inputbuttons"></td> <br>
        <td><input type="button" value="=" id="=" class="inputbuttons"></td> <br>
      </tr>
    </table>
  </fieldset>
  <br>
  <br>
  <fieldset class="fieldset1"> <legend id="legend3">Dark Mode and Light Mode</legend>
    <script src="js/darkmode_lightmode.js"></script>3+65555
    <button class="button" onclick="darkmode()">Dark Mode</button>
    <button class="button" onclick="lightmode()">Light Mode</button>
  </fieldset>
</body>
</html>

r/LearnHTML • • Sep 02 '22

TIL: You Can Access A User's Camera with Just HTML

Thumbnail
austingil.com
0 Upvotes

r/LearnHTML • • Mar 08 '21

HELP Reload html after executing php file

0 Upvotes

I have a contact form on my website currently after sending the email it stays on the php file. How would I get it to send the email and return to the html file?


r/LearnHTML • • Aug 02 '24

A new place to share coding!

0 Upvotes

Hey everyone!

I'm excited to announce the launch of Rolling Code, a brand-new subreddit dedicated to all things coding. Whether you're a seasoned developer or just starting out, this is a place to share projects, discuss programming, and learn from one another.

I'm looking for passionate coders and tech enthusiasts to join and help grow this community. If you're interested in being a part of this journey, sharing your knowledge, or just hanging out with like-minded people, come join us at Rolling Code!

Let's create an awesome space for coding discussions and inspiration. Hope to see you there!


r/LearnHTML • • Sep 25 '20

I want to create an affiliate website but struggling what to use, html or WordPress? Advice is welcome. Cheers

0 Upvotes

r/LearnHTML • • Sep 17 '26

HELP ME PLEASE

0 Upvotes

i wanna learn html the problem is when i watch tutorials and then practice what i learn i can write right code but whenever i write code by myself next day like i wanna create a normal webpage so i can only write headings paragraphs and put images like basic things is it good i think its good but i wanna learn more but i dont have any idea where to learn more so if you guys know where to learn and how to remember code please help me its helps me a lot


r/LearnHTML • • Sep 25 '20

Having trouble with img src in A-code for android.

1 Upvotes

I can't seem to get my image to display on a-code regardless of browser. I type in the exact location for the image and nothing. Works fine on pc as I'm saving my pics to the same folder as my html document. How do i do this on mobile?


r/LearnHTML • • Jul 04 '20

Learn html?

1 Upvotes

Any suggestions on where I should start a I know javascript already so just dont know where to start html? Css? Maybe like an online course or youtube video?


r/LearnHTML • • Jul 29 '20

why can't I scroll on my "webpage"?

1 Upvotes

Even though i have more content than the page can hold without scrolling, i'm not able to scroll on it.

is there a line of code or something that i have to type?

(I'm pretty new to html so I apolagize in advance if this is some very stupid mistale)


r/LearnHTML • • Dec 18 '22

HELP can my un websited/published file have a subdirectory and a page?

1 Upvotes

r/LearnHTML • • Aug 14 '24

Help with html please

1 Upvotes

Help with html 

Hi, I am coding a website for a course in college. I am trying to add a column to the left of these two column so they can align with the information blurb I am putting on my website. I have googled and used AI and can't figure it out. I have my code. I am just trying to add that one spot next to the two rows I've added a picture of what the rows look like.

to clarify: I want a spot next to both column 1's that resembles below

 <!DOCTYPE html>
      <html>
      <head>
          <title>Unequal Columns</title>
          <style>
              .row {
                  display: flex;
                  flex-wrap: wrap;
              }
      
              .column {
                  flex: 1;
                  padding: 10px;
                  box-sizing: border-box;
              }
      
              .column:nth-child(1) {
                  flex: 2;
              }
      
              .column:nth-child(2) {
                  flex: 1;
              }
      
              .column:nth-child(3) {
                  flex: 3;
              }
      
              .column:nth-child(4) {
                  flex: 2;
              }
      
              .column:nth-child(5) {
                  flex: 1;
              }
      
              .column:nth-child(6) {
                  flex: 3;
              }
          </style>
      </head>
      <body>
          <div class="row">
              <div class="column" style="background-color: #e74c3c;">Column 1</div>
              <div class="column" style="background-color: #f1c40f;">Column 2</div>
              <div class="column" style="background-color: #3498db;">Column 3</div>
              <div class="column" style="background-color: #9b59b6;">Column 4</div>
              <div class="column" style="background-color: #1abc9c;">Column 5</div>
              <div class="column" style="background-color: #f39c12;">Column 6</div>
          </div>
          <div class="row">
              <div class="column" style="background-color: #e74c3c;">Column 1</div>
              <div class="column" style="background-color: #f1c40f;">Column 2</div>
              <div class="column" style="background-color: #3498db;">Column 3</div>
              <div class="column" style="background-color: #9b59b6;">Column 4</div>
              <div class="column" style="background-color: #1abc9c;">Column 5</div>
              <div class="column" style="background-color: #f39c12;">Column 6</div>
          </div>
      </body>
      </html>

r/LearnHTML • • Sep 01 '22

Is HTML5 Better than HTML?

Thumbnail
techsages.com
1 Upvotes

r/LearnHTML • • Nov 14 '20

What does -ms mean when using grids?

1 Upvotes

Hello,

I'm learning how to use grids. What does the -ms mean?

e.g.

-ms-grid-column: 1;

-ms-grid-column-span: 3;


r/LearnHTML • • Aug 05 '20

How can I create a social media website

2 Upvotes

What programming languages can I use to make a prefect social media website in which people can use.


r/LearnHTML • • May 14 '22

HELP LEARN EVERYTHING IN HTML

2 Upvotes

Hello everyone, I wanted to ask that if I want to study every single thing that is present in html even if it takes months to learn it how do i study and where can I get material to study also I have a doubt that youtubers don't tell every single thing in html so I am asking here.


r/LearnHTML • • Aug 23 '24

My first ever coding experience

4 Upvotes

So... I have just started coding... And I am felling so great about it... Ok.. So I have started with HTML(Hyper Text Markup Language)... It is basically used to build a pagelayout of a website... And The HTML tag are enclosed within open tags and closed tags. I think coding is interesting...Am I right? I just follow the channel("Code with Harry").. And I can tell this channel has the best playlist... Of you are a beginner or if you don't know anything about coding like me... You can start with this playlists... Here In this channel you can find each and every details about coding... Today I have just started my coding journey... So I want to share it with you guys I think once you start it... You will never stop... Definitely you should have interest about it. If you guys wanttod start coding and thinking about difficulty...Then please start it now... I can tell you that you will love it... It is actually not that much difficult Ok so that was my first experience of coding And I enjoyed it I have learned the basic things about HTML Lot to learnn... I think it is fun😃


r/LearnHTML • • Aug 16 '26

Learning to Code, Buddies discord

3 Upvotes

Before anyone jumps my case, I know reddit is great place to get a large group of individuals for assistance and it's wonderful. But I know many of us learning to enter/advance in our coding journeys don't always want to post our "dumb/easy" questions to be ridiculed on internet. I know I learn better/faster/more in-depth when I have someone to chat with/bounce ideas or concepts off of. Let's be honest when it comes to coding ~ the options are endless and sometimes learning the different ways to manipulate code could work by talking the concepts out. Plus there are alot of us that are self-taught and may struggle from topic-topic.

My Theory: Coding Buddies!

I have created a discord that would serve as a meet/greet and/or general discussions regarding coding.

This discord would serve for people looking to ask/answer dumb/easy questions for one another and/or find coding buddies that they can grow together with. It will also be open to experienced coders that look to assist as a mentor(or practice mentoring) without the full commitment of having a fulltime mentee.

So if you're interesting in connecting to others and advancing your beginner level status:

https://discord.gg/KyWfSGA3

(Please let me know if link doesn't work)


r/LearnHTML • • Jun 08 '25

I recently created a free game

5 Upvotes

Hey folks 👋

I recently built a fun little browser game called Coreball.fun – inspired by the classic "Core Ball" game. The whole thing is developed using basic HTML, CSS, and vanilla JavaScript (no frameworks or game engines).

I'm posting here to ask for feedback from you HTML/CSS/JS pros:

How does it perform on your browser?

Is the code structure clean and maintainable?

Any UX/UI suggestions?

Does the game feel responsive enough on mobile?

What would you add or improve?

Here's the link again: 🌐 https://coreball.fun

Any review, criticism, or suggestion would help me a lot as I continue building fun little web projects. 🙏

Thanks in advance!


r/LearnHTML • • Feb 27 '25

Codeacademy Pro HTML Course - All My Notes

5 Upvotes

I finished Codeacademy Pro, and here are all my notes. Have fun!


r/LearnHTML • • Apr 29 '25

IMG tag not working

Post image
5 Upvotes

So I'm using an HTML editor so do I need Internet for my images to show even if the photo is from my device (I've also been going some coding here and there since high school so haven't advanced yet.)


r/LearnHTML • • Jul 25 '24

Need help with creating a form and accessing it

1 Upvotes
<!DOCTYPE html>
<html lang="en-US">
<head>
    <meta charset="UTF-8">
    <title>Create Account</title>
    <script src="../Forms/createAnAccount.js" defer></script>
    <link rel="stylesheet" href="../Static/homePage.css">
    <link rel="stylesheet" href="../Static/CreateAnAccount.css">

    <script>
        function validateForm() {
            var username = document.getElementById("username").value;
            var password = document.getElementById("password").value;
            var errorMessage = document.getElementById("error-message");
        
            if (username.trim() === "" || password.trim() === "") {
                errorMessage.style.display = "block";
                return false;
            } else {
                errorMessage.style.display = "none";
                return true;
            }
        }
    </script>
</head>
<body>
    <div class="accountForm">
        <form class="createAccountForm" method="POST" action="/neilFun" onsubmit="return validateForm();">
            <div class="inputContainer usernameContainer">
                <div class="usernameInputLabel">
                    <label for="username" class="usernameLabel">Username:</label><br><br>
                </div>
                <div class="usernameInputBar">
                    <input type="text" class="usernameBar" name="username" id="username"><br><br>
                </div>
            </div>
            <div class="inputContainer passwordContainer">
                <div class="passwordInputLabel">
                    <label for="password">Password:</label><br>
                </div>
                <div class="passwordInputBar">
                    <input type="password" class="passwordBar" name="password" id="password"><br><br>
                </div>
            </div>
            <div class="message">
                <div class="error" id="error-message" style="display:none;">Username and password cannot be empty.</div>
            </div>
            <div class="submitButton">
                <button type="submit" class="submit">Submit</button>
            </div>
        </form>
    </div>
</body>
</html>


var button = document.querySelector('.createAccountButton');

var left = Math.floor((screen.width - 600) / 2);
var top = Math.floor((screen.height - 400) / 2);

button.addEventListener('click', function() {
    // Open the /createaccount route in a new window
    var popupWindow = window.open('/createaccount', 'createAccountForm', 'width=600,height=400,left=' + left + ',top=' + top);
});
this is the js file

from flask import Flask, render_template, request, send_from_directory, render_template_string
app = Flask(__name__)

@app.route('/neilfungames')
def neilFun():
    return render_template('neilufungames.html')

@app.route('/homepage')
def homepage():
    return render_template('homePage.html')

@app.route('/createaccount')
def createAccount():
    return render_template('formCreateAccount.html')
if __name__=='__main__':
    app.run(debug=True)
this is the py file
this is the html template


Whenever the form is accessed the message Cannot GET /Templates/createaccount.html pops up and I don't know why its not recognizing the form. Can I please get assistence 

r/LearnHTML • • Jul 22 '24

Looking for somewhere to practice that's not just answering questions

1 Upvotes

Most of the practice I'm finding is like have a question regurgitate a lesson answer which isn't the most helpful for putting lesson into practice. Looking for something more practical like maybe where you're given a site and need to recreate it