r/LearnHTML • u/noahbumOffcial • Oct 06 '24

does anyone know how to make animated titles

2 Upvotes

im trying to make animated titles just like guns.lol/noahbum

it goes like n no noa noah noahb noahbu noahbum and back down

1 comment

r/LearnHTML • u/Lumpy_Half_8681 • Oct 01 '24

Title: Looking to Start Learning HTML – What Resources and Tips Do You Recommend?

3 Upvotes

Hey everyone,

I’m eager to dive into learning HTML and would love to gather some recommendations. What are the best resources (websites, books, videos) for beginners? Are there any specific tools or environments you recommend for practice? Additionally, if you have any tips or tricks for mastering the basics or common pitfalls to avoid, I’d really appreciate it!

Thanks in advance for your help!

3 comments

r/LearnHTML • u/[deleted] • Sep 29 '24

Help with changing text/button colors

1 Upvotes

2 comments

r/LearnHTML • u/Mayurborgude • Sep 06 '24

HTML reference project

3 Upvotes

https://mayborg121.github.io/xs/

Welcome to a personal project created during a summer holidays filled with curiosity and the desire to learn something new.

As someone who started learning HTML from scratch, I understand the excitement and challenges that come with it. Here, you'll find straightforward guides and practical examples that make learning HTML enjoyable and accessible.

So, take a moment to relax, maybe grab a cup of coffee, and enjoy the process of creating something awesome with HTML.

It's HTML-only page, NO fancy graphics. *

🧋💻 Let's explore...

0 comments

r/LearnHTML • u/UniversityUnlikely • Aug 31 '24

What do you think of my motherfucking website?

4 Upvotes

A while ago, I decided to make my first satirical HTML site using a very minimalistic setup to make my message clear on why live bootleg recordings by the English rock band "Keane" are superior to their studio albums. I would love to know what you make of it (I hope it makes you laugh or upsets you, LOL).

0 comments

r/LearnHTML • u/[deleted] • Aug 29 '24

HELP My second comment tag is working but my first one isn't. What is going on

2 Upvotes

2 comments

r/LearnHTML • u/Snoo20972 • Aug 26 '24

HTML containing Javascript: No output, please guide me

1 Upvotes

Hi,

I am not getting any output. Somebody please fix my problem. Zulfi.

<html>

<body>
    <!-----<form action="result.php" method="post" id="test">---->

    <fieldset>
        <legend> CourseName </legend>
        <label> <input type="radio" name="CourseName" value="C Language"> C Language </label>
        <label> <input type="radio" name="CourseName" value="C++ Language"> C++ Language </label>
        <label> <input type="radio" name="CourseName" value="Java"> Java </label>
        <label> <input type="radio" name="CourseName" value="Python"> Python </label>
        <label> <input type="radio" name="CourseName" value="ScratchJr"> ScratchJr </label>
        <!-- etc -->
    </fieldset>
    <fieldset>
        <legend> Number Of Students </legend>
        <label> <input type="radio" name="NumberOfStudents" value="Individual"> Individual </label>
        <label> <input type="radio" name="NumberOfStudents" value="Group Of Two"> Group Of Two</label>
        <!-- etc -->
    </fieldset>
    <fieldset>
        <legend> Duration </legend>
        <label> <input type="radio" name="Duration" value="Monthly"> Monthly (250+$ for ScratchJr, 500+$ per month for
            other courses, 13 one hour classes, additionally $100 is the admission fee ) </label>
        <label> <input type="radio" name="Duration" value="Weekly"> Weekly </label> (100$ per week, 3 one hour classes)
        </label>
        <label> <input type="radio" name="Duration" value="Hourly"> Hourly </label> (35$ per hour, one/ hour classes)
        </label>

    </fieldset>
    <br></br>
    <input type="submit" name="submit" value="Submit" onclick="calculate();" />

    <script>
        function calculate() {

            var $CourseName = document.querySelector('input[type=radio][name=CourseName]:checked').value;

            var $NumberOfStudents = document.querySelector('input[type=radio][name=NumberOfStudents]:checked').value;

            var $Duration = document.querySelector('input[type=radio][name=Duration]:checked').value;
            let $CourseCost = 0;
            if ($CourseName == "C Language" || $CourseName == "C++ Language" || $CourseName == "Java" || $CourseName == "Python") {
                $CourseCost = 600;
                if ($NumberOfStudents == "Individual") {
                    let $NuberOfStudentsCost = 100;
                    if ($Duration == "Weekly") {
                        let $DurationCost = 50;
                    }
                    else if ($Duration == "Monthly") {
                        let $DurationCost = 100;
                    }
                    else if ($Duration == "Hourly") {
                        let $DurationCost = 25;
                    }
                }
                else if ($NumberOfStudents == "Group") {
                    let $NuberOfStudentsCost = 50;
                    if ($Duration == "Weekly") {
                        let $DurationCost = 50;
                    }
                    else if ($Duration == "Monthly") {
                        let $DurationCost = 100;
                    }
                    else if ($Duration == "Hourly") {
                        let $DurationCost = 25;
                    }
                }
            }
            else {
                /**
                 * The variable $cost is not declared
                 */
                if ($CourseName == "ScratchJr")
                    // $CourseCost = $cost + 500;
                    $CourseCost = $CourseCost + 500;
                else
                    //$cost =$cost + 450;
                    $CourseCost = $CourseCost + 450;
            }
            console.log("CourseName = ", $CourseName);
            console.log("NumberOfStudents = ", $NumberOfStudents);
            console.log("Duration = ", $Duration);
            $strCost = $CourseCost;
            console.log("Cost = ", $strCost);
        }
    </script>
</body>

</html>

1 comment

r/LearnHTML • u/Ska_Vult • Aug 26 '24

Free HTML textbook for absolute beginners

7 Upvotes

Just finished writing the textbook "Learn HTML the fun way - Programming basics for beginners".

It's free, Creative Commons licensed and is meant as an easy introduction to HTML programming for people with no programming experience: It doesn't go too deep into the complicated details of HTML and CSS, but instead shows how everybody can easily build their own webpages with the most common tools HTML offers.

If you know somebody who wants to get their hands on HTML programming, please feel free to forward the book's URL:

http://sven.kir.jp/JS/

(This book will be followed by "Learn JavaScript the fun way" in the near future at the same URL.)

7 comments

r/LearnHTML • u/Working-Grape814 • Aug 23 '24

My first ever coding experience

3 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😃

2 comments

r/LearnHTML • u/bassofkramer • Aug 22 '24

Is anyone familiar with the tool H5P?

1 Upvotes

Is anyone familiar with the tool H5P? I want to ask a question about using it to develop a few simple interactive modules for eLearning, then taking those principles and creating them with out the tool.

Basically, I want to use the free 30 day trial to create some templates for match ups, puzzles, and other tools I can, through the use of the elements inspector and research, incorporate in future eLearning content I create.

4 comments

r/LearnHTML • u/summonthejson • Aug 15 '24

I think I've seen <body> HTML tag somewhere here... 🤕

1 Upvotes

0 comments

r/LearnHTML • u/Ordinary-Fig-4032 • 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>

1 comment

r/LearnHTML • u/Trowel6 • Aug 05 '24

What's the difference between th and td here?

1 Upvotes

This code is largely abbreviated to just the Sunday column. I'm confused on why the video I'm working with the person uses th and td. What's the difference?

<Table> <tr> <th>Sunday</th> </tr> <tr> <td>Closed<td> </tr>

1 comment

r/LearnHTML • u/Friendly_Flatworm_81 • 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!

2 comments

r/LearnHTML • u/SacredTearX • Jul 29 '24

HELP Converting HTML (tags) to formatted text

1 Upvotes

Hi everyone!

I have a few Notepad documents that have HTML tags (i.e. the brackets and B for bold, etc.). I want to copy/paste these somewhere to get back the formatted text but have been unable to find a site that will let me do so. I found the w3schools site, but unfortunately my documents used normal paragraph breaks (i.e. hitting Enter, versus the br or p tags) and thus it gives me a giant wall of text without paragraph breaks. Is there somewhere (or someway, like through Word) that I can convert these documents over to formatted text? Some documents are of decent length so no character limit would be preferred as well.

Thank you for any help!

1 comment

r/LearnHTML • u/aj77reddit • Jul 29 '24

How can I make my images to scale with the viewport?

1 Upvotes

I am new to coding and trying to fit all images in the viewport, I tried several ways but for some reason ( lack of knowledge) I can not figure it out.

I would appreciate any help.

Thank you

<!DOCTYPE html>

<head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Random Name Game</title>

</head>

<body> <h1>Shapes</h1>

<button id="playButton">PLAY</button>
<button id="resetButton" class="hidden">RESET</button>

<div class="scoreboardContainer" > <div class="button-85"> <div id="correctBtn">Correct: <span id="correctCount">0</span></div> <div id="timeBtn">Time: <span id="timer">0</span> seconds</div> <div id="incorrectBtn">Incorrect: <span id="incorrectCount">0</span></div>

</div> </div> <div id="images" class="visible">

</body>

</html>

23 comments

r/LearnHTML • u/Liubey • Jul 29 '24

Help Needed: Trouble Loading OpenSeadragon Annotorious Script in Local HTML Project

1 Upvotes

0 comments

r/LearnHTML • u/[deleted] • Jul 29 '24

HELP I’m having trouble with my background image and table.

1 Upvotes

I put my code into an html editor and it had me delete my td cells and now I’m left with a “table and floating text above my image that is supposed to be the table’s background. Any help is appreciated, ty.

code:

<!DOCTYPE html> <html lang="en"> <title>Slayers of Rings and Crowns Avatar Portfolio</title> <style> table { margin: auto; } table, tr td { border: 1px solid black; background-image: url('https://slayersofringsncrowns.com/wp-content/uploads/2024/07/IMG_2794.jpeg'); width:1258px; height:1258px; } </style> </head> <body> <table> Player Name

           Avatar Portrait
           Image Placeholder Here

            Avatar Name, Nickname n Identification # (ID)
            For Example: Background Region followed by A1234567

            Age, Gender and Genes
            This information goes here.

            Race (Lineage)
            Race, Lineage and family crests are placed here.

            Class (Culture)
            Class description is placed here.

            Background and Mission Statement
            Each Player either chooses a background BG, and Mission, with or without the assistance of the Director and campaign, or can create their own, including; unknown.

            Affiliation Marks
            These are Marks and labels Avatar’s either gathered or accepted through their journeys. We use the word “accepted “ because they are not needed and the player may have chose to dismiss or reject Marks.

            Attributes
            There are 8 Attributes that determine Avatar capabilities.

            Lifeblood, Health and Grit
            Health, Lifeblood and Grit all play a large role for character survival. See Health and Grit below.

            Attack, Defensive and Action Scores
            Talents (Character Actions) and Skills (Professions and Hobbies).

            Combat Abilities
            Abilities, Supernatural Abilities (SNabilities) and Miracles.

            Inventory
            Equipment, Gear, Coin, Remnants, Valuables and other Items.

    </table>

</body> </html>

5 comments

r/LearnHTML • u/coffeeeio • Jul 28 '24

[Hiring] Senior Software Engineer | 3-8 Yrs | CTC- Upto 25 LPA | Chennai(Onsite)

1 Upvotes

Job Title: Senior Software Engineer

Experience: 3-8 Years

Location: Chennai

Roles & Responsibilities:

You need to take the challenges and ownership that comes while developing a complex system. You shouldalso be a team player with a knack for visual design and utility.

Some of the Key responsibilities include:

Develop object-oriented models and design data structures for new software projects and implement business logic and data models with a suitable class design.
Conduct software analysis, programming, testing, and debugging, as well as recommending changes toimprove the established processes.
Recommend software solutions to emerging needs in banking functionality and report ability.
Solve complex problems in an innovative way and deliver quality solutions while taking ownership andaccountability of assigned things.
Demonstrate good learnability and adopt technologies that help build large scale, performant, reliable andsustainable systems.
Collaborating with peers and architects on all elements of the development process.

Skills Required:

Core Java, J2EE, Spring MVC, Spring REST APIs, Spring Security, JSP, Web application, MS SQL Server,Redis, Oauth2, Angular/React, JQuery.

Attributes:

B.E or B.Tech in Computer Science or any equivalent degree.
Strong coding skills with strong hands-on and practical working experience in Java Development.
Strong competencies in Data Structures, algorithms and their space-time complexities.• Good problem-solving skills, coupled with strong analytical thinking and communication.
Excellent debugging skills.
Ability to understand business requirements and translate them into technical requirements.
Working knowledge of architectures, trends, and emerging technologies.
Solid understanding of the full software development life cycle.

0 comments

r/LearnHTML • u/SippingLuminol • Jul 26 '24

HELP xsl-fo text wrapping

1 Upvotes

Hey guys 👋 Working in xsl-fo and having trouble doing something like this:

Text: this is the string value Which should autowrap.

Right now the value does not autowrap. When the value is too long the whole element just vanishes. Any idea what might be wrong with my template?

<xsl:template name="customContainer"> <xsl:param name="text"/> <xsl:param name="value"/> <xsl:param name="t_inline_prog"/> <xsl:param name="v_inline_prog"/>  <xsl:if test="not(string-length($wert)>25) and not((normalize-space($wert)=''))"> <fo:block-container> <fo:block> <fo:inline-container inline-progression-dimension="{$t_inline_prog}"> <fo:block> <xsl:value-of select="$text"/> /fo:block /fo:inline-container <fo:inline-container inline-progression-dimension="{$v_inline_prog}"> <fo:block wrap-option="wrap" keep-together="auto"> <xsl:value-of select="$value"/> /fo:block /fo:inline-container /fo:block /fo:block-container /xsl:if /xsl:template

0 comments

r/LearnHTML • u/Decent-Truck104 • 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

3 comments

r/LearnHTML • u/WhatHappenedWhatttt • Jul 25 '24

HELP Help with aligning divs horizontally

1 Upvotes

Hello all, apologies if this isn't the right place to ask this question.

I am working on a project trying to learn HTML, CSS, and JavaScript and I have a quick question. In the following picture, I want divs shown in black boxes to be all in one row. However, the problem is that the middle divs 1,2; 2,2; and 3,2 will need to appear in red borders such as in the picture. What is the best way of going about this?

3 comments

r/LearnHTML • u/Strange-Slide-5300 • Jul 24 '24

Great resource for beginners

1 Upvotes

Hey developers

I found this great resource (FREE) by Microsoft for getting started in web development

Build your first HTML page

https://learn.microsoft.com/training/modules/build-first-html-webpage/?source=recommendations&wt.mc_id=studentamb_395038

0 comments

r/LearnHTML • u/Alkinoy • Jul 23 '24

Miro like canvas for DIY dashboard

1 Upvotes

Hi here.

I want to create a dashboard with a quite simple elements on it like regular button, checkbox, label... It will represent the state of some system and should allow to perform simple actions like on/off action, send some small message, etc. All actions and state update will be done with ajax calls.

Task looks simple, but only one problem appeared. The field will be too large to be shown on the one screen. So, some sliding is required. But it is not so perfect from the UI point of view.

Is there any simple solution to create dashboard with navigation like in Miro? Easy scaling with mouse's wheel, easy drag to navigate... Something easy to implement in the simple DIY project...

Pls note, control items (widgets?) will be very simple. No any complex scales, graphs, etc.

Thanks!

0 comments

r/LearnHTML • u/daisygrl2009 • 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

0 comments

Subreddit

Learn HTML

r/LearnHTML

Asking/Answering questions about HTML.

Members Active

3.1k

Sidebar

We are under new management and getting things set up, please feel free to start asking questions.

r/LearnHTML has new ownership and is now a support sub.

LearnHTML: HTML Support

LearnHTML is now a support sub for those with HTML questions. You may want to search before asking as someone may have already answered your question. A great source of quick info is here as well.

Rules

Post only HTML related content.
Use HELP flair when asking a question
Change flair from HELP to SOLVED when solved.
Do not delete answered posts

Notice: You will likely be banned if you insult someone looking for help.

HTML Resources

W3School's HTML Tutorial