Forwarded from Coding with Elias
How to create HTML page
1. Open a text editor: Open a text editor such as Notepad or Sublime Text.
2. Start with the HTML tag: Begin your HTML document by typing "<html>" at the top of your document.
3. Add the head section: Within the HTML tags, add the head section by typing "<head>" and "</head>".
4. Add the title: Within the head section, add the title of your webpage by typing "<title>" and "</title>".
5. Add the body section: Within the HTML tags, add the body section by typing "<body>" and "</body>".
6. Add content: Within the body section, add the content of your webpage using HTML tags such as "<h1>" for headings, "<p>" for paragraphs, and "<img>" for images.
7. Save the file: Save your file with a .html extension.
8. Open the file in a web browser: Open your HTML file in a web browser to view your webpage.
This is just a basic summary of how to create an HTML webpage. There are many more HTML tags and attributes that you can use to create more complex webpages.
@html_css_tut
1. Open a text editor: Open a text editor such as Notepad or Sublime Text.
2. Start with the HTML tag: Begin your HTML document by typing "<html>" at the top of your document.
3. Add the head section: Within the HTML tags, add the head section by typing "<head>" and "</head>".
4. Add the title: Within the head section, add the title of your webpage by typing "<title>" and "</title>".
5. Add the body section: Within the HTML tags, add the body section by typing "<body>" and "</body>".
6. Add content: Within the body section, add the content of your webpage using HTML tags such as "<h1>" for headings, "<p>" for paragraphs, and "<img>" for images.
7. Save the file: Save your file with a .html extension.
8. Open the file in a web browser: Open your HTML file in a web browser to view your webpage.
This is just a basic summary of how to create an HTML webpage. There are many more HTML tags and attributes that you can use to create more complex webpages.
@html_css_tut
Here are all the HTML5 tags with a short summary:
1. <!DOCTYPE html>: Defines the document type and version of HTML.
2. <html>: Defines the root element of an HTML document.
3. <head>: Contains metadata about the document, such as the title and links to stylesheets.
4. <title>: Defines the title of the document, which appears in the browser's title bar.
5. <body>: Contains the visible content of the document.
6. <header>: Defines a header section for a document or section.
7. <nav>: Defines a set of navigation links.
8. <main>: Defines the main content of a document.
9. <section>: Defines a section of a document.
10. <article>: Defines an independent, self-contained piece of content.
11. <aside>: Defines content that is tangentially related to the main content.
12. <footer>: Defines a footer section for a document or section.
13. <h1> to <h6>: Defines headings of different levels.
14. <p>: Defines a paragraph of text.
15. <a>: Defines a hyperlink.
@html_css_tut
1. <!DOCTYPE html>: Defines the document type and version of HTML.
2. <html>: Defines the root element of an HTML document.
3. <head>: Contains metadata about the document, such as the title and links to stylesheets.
4. <title>: Defines the title of the document, which appears in the browser's title bar.
5. <body>: Contains the visible content of the document.
6. <header>: Defines a header section for a document or section.
7. <nav>: Defines a set of navigation links.
8. <main>: Defines the main content of a document.
9. <section>: Defines a section of a document.
10. <article>: Defines an independent, self-contained piece of content.
11. <aside>: Defines content that is tangentially related to the main content.
12. <footer>: Defines a footer section for a document or section.
13. <h1> to <h6>: Defines headings of different levels.
14. <p>: Defines a paragraph of text.
15. <a>: Defines a hyperlink.
@html_css_tut
16. <img>: Defines an image.
17. <ul>: Defines an unordered list.
18. <ol>: Defines an ordered list.
19. <li>: Defines a list item.
20. <table>: Defines a table.
21. <tr>: Defines a table row.
22. <td>: Defines a table cell.
23. <form>: Defines a form for user input.
24. <input>: Defines an input field.
25. <label>: Defines a label for an input field.
26. <select>: Defines a drop-down list.
27. <option>: Defines an option in a drop-down list.
28. <textarea>: Defines a multi-line input field.
29. <button>: Defines a clickable button.
30. <audio>: Defines an audio file.
@html_css_tut
17. <ul>: Defines an unordered list.
18. <ol>: Defines an ordered list.
19. <li>: Defines a list item.
20. <table>: Defines a table.
21. <tr>: Defines a table row.
22. <td>: Defines a table cell.
23. <form>: Defines a form for user input.
24. <input>: Defines an input field.
25. <label>: Defines a label for an input field.
26. <select>: Defines a drop-down list.
27. <option>: Defines an option in a drop-down list.
28. <textarea>: Defines a multi-line input field.
29. <button>: Defines a clickable button.
30. <audio>: Defines an audio file.
@html_css_tut
31. <video>: Defines a video file.
32. <canvas>: Defines an area for graphics.
33. <progress>: Defines a progress bar.
34. <meter>: Defines a scalar measurement within a known range.
35. <details>: Defines additional details that the user can view or hide.
36. <summary>: Defines a summary for a <details> element.
37. <time>: Defines a date or time.
38. <datalist>: Defines a list of pre-defined options for an input field.
39. <output>: Defines the result of a calculation.
40. <figure>: Defines a self-contained piece of content, such as an image with a caption.
41. <figcaption>: Defines a caption for a <figure> element.
@html_css_tut
32. <canvas>: Defines an area for graphics.
33. <progress>: Defines a progress bar.
34. <meter>: Defines a scalar measurement within a known range.
35. <details>: Defines additional details that the user can view or hide.
36. <summary>: Defines a summary for a <details> element.
37. <time>: Defines a date or time.
38. <datalist>: Defines a list of pre-defined options for an input field.
39. <output>: Defines the result of a calculation.
40. <figure>: Defines a self-contained piece of content, such as an image with a caption.
41. <figcaption>: Defines a caption for a <figure> element.
@html_css_tut
Here are some of the main HTML5 text formatting tags
1. <h1> to <h6>: These tags are used to create headings of different sizes. The <h1> tag is the largest heading, while the <h6> tag is the smallest.
2. <p>: This tag is used to create paragraphs of text.
3. <strong> and <em>: These tags are used to add emphasis to text. The <strong> tag is used for strong emphasis, while the <em> tag is used for emphasis.
4. <u>: This tag is used to underline text.
5. <s>: This tag is used to create strikethrough text.
@html_css_tut
1. <h1> to <h6>: These tags are used to create headings of different sizes. The <h1> tag is the largest heading, while the <h6> tag is the smallest.
2. <p>: This tag is used to create paragraphs of text.
3. <strong> and <em>: These tags are used to add emphasis to text. The <strong> tag is used for strong emphasis, while the <em> tag is used for emphasis.
4. <u>: This tag is used to underline text.
5. <s>: This tag is used to create strikethrough text.
@html_css_tut
6. <br>: This tag is used to create line breaks within a paragraph.
7. <hr>: This tag is used to create a horizontal line.
8. <sup> and <sub>: These tags are used to create superscript and subscript text, respectively.
9. <blockquote>: This tag is used to create a blockquote, which is a section of quoted text.
10. <cite>: This tag is used to indicate the title of a work, such as a book or article.
11. <code>: This tag is used to indicate code or programming language within a document.
12. <kbd>: This tag is used to indicate keyboard input.
13. <samp>: This tag is used to indicate sample output from a computer program.
@html_css_tut
7. <hr>: This tag is used to create a horizontal line.
8. <sup> and <sub>: These tags are used to create superscript and subscript text, respectively.
9. <blockquote>: This tag is used to create a blockquote, which is a section of quoted text.
10. <cite>: This tag is used to indicate the title of a work, such as a book or article.
11. <code>: This tag is used to indicate code or programming language within a document.
12. <kbd>: This tag is used to indicate keyboard input.
13. <samp>: This tag is used to indicate sample output from a computer program.
@html_css_tut
How To Create A Complete Personal Portfolio Website Just using HTML And CSS
https://youtu.be/tjkIMVHMxDs
Pure HTML And CSS
https://youtu.be/tjkIMVHMxDs
Pure HTML And CSS
Forwarded from JavaScript Tutorial
1. Open a text editor such as Notepad or Sublime Text.
2. Type the following code:
3. Save the file with a .html extension.
4. Open the file in a web browser.
5. Click the "Click me" button.
6. You should see the text "Hello World!" appear on the screen.
This program uses JavaScript to change the text of an HTML element when a button is clicked. It's a simple example, but it demonstrates the basic structure of a JavaScript program and how it can interact with HTML elements on a web page. From here, you can continue to learn and experiment with JavaScript to create more complex and interactive programs.
@javascript_tut
2. Type the following code:
<!DOCTYPE html>
<html>
<body>
<h2>My First JavaScript Program</h2>
<button onclick="myFunction()">Click me</button>
<p id="demo"></p>
<script>
function myFunction() {
document.getElementById("demo").innerHTML = "Hello World!";
}
</script>
</body>
</html>
3. Save the file with a .html extension.
4. Open the file in a web browser.
5. Click the "Click me" button.
6. You should see the text "Hello World!" appear on the screen.
This program uses JavaScript to change the text of an HTML element when a button is clicked. It's a simple example, but it demonstrates the basic structure of a JavaScript program and how it can interact with HTML elements on a web page. From here, you can continue to learn and experiment with JavaScript to create more complex and interactive programs.
@javascript_tut
Chat Application using PHP with MySQL, AJAX & Bootstrap 5
https://youtu.be/JLnsWkQ-iB8
https://youtu.be/JLnsWkQ-iB8
YouTube
Chat Application using PHP with MySQL, AJAX & Bootstrap 5
In this video we are going to build
FULL Chat Application Using
PHP PDO,
MYSQL ,
Bootstrap 5,
jQuery,
AJAX,
HTML & CSS
Timestamps:
0:00 Demo of Chat Application
03:03 Creating Login Form (HTML/Bootstrap 5)
11:04 Creating Signup Form (HTML/Bootstrap 5/PHP)…
FULL Chat Application Using
PHP PDO,
MYSQL ,
Bootstrap 5,
jQuery,
AJAX,
HTML & CSS
Timestamps:
0:00 Demo of Chat Application
03:03 Creating Login Form (HTML/Bootstrap 5)
11:04 Creating Signup Form (HTML/Bootstrap 5/PHP)…
Dear amazing subscribers of "Coding with Elias,"🚀👨💻
I am thrilled and grateful to announce that our YouTube channel has reached a significant milestone of 20k subscribers! This achievement would not have been possible without your incredible support, engagement, and enthusiasm for coding and programming.
Thank you for being a part of our growing community and for joining us on this exciting journey of learning and exploring the world of coding together. Your dedication and passion for this field have been truly inspiring, and it motivates us to continue creating valuable content for you.
We started this channel with the goal of making coding accessible and enjoyable for everyone, and your unwavering support has shown us that we are on the right track. Your comments, likes, shares, and feedback have been invaluable in shaping the direction of our content and helping us improve.
We are committed to providing you with high-quality tutorials, tips, and resources to enhance your coding skills and empower you to achieve your goals. Your trust in us is something we deeply appreciate, and we will continue to work hard to deliver content that meets your expectations.
As we celebrate this milestone together, I want to express my heartfelt gratitude to each and every one of you. Your presence in our community has created an environment of collaboration, learning, and growth. I am honored to have such dedicated and passionate subscribers like you.
Please know that your support means the world to us, and we are excited to continue this journey with you. Stay tuned for more exciting content, challenges, and opportunities to expand your coding knowledge and skills.
Once again, thank you for being a part of "Coding with Elias" and for helping us reach 20k subscribers. Let's keep coding, learning, and achieving great things together!
With sincere appreciation,
Elias Yasin,
Founder of "Coding with Elias"
https://youtube.com/@CodingwithElias
I am thrilled and grateful to announce that our YouTube channel has reached a significant milestone of 20k subscribers! This achievement would not have been possible without your incredible support, engagement, and enthusiasm for coding and programming.
Thank you for being a part of our growing community and for joining us on this exciting journey of learning and exploring the world of coding together. Your dedication and passion for this field have been truly inspiring, and it motivates us to continue creating valuable content for you.
We started this channel with the goal of making coding accessible and enjoyable for everyone, and your unwavering support has shown us that we are on the right track. Your comments, likes, shares, and feedback have been invaluable in shaping the direction of our content and helping us improve.
We are committed to providing you with high-quality tutorials, tips, and resources to enhance your coding skills and empower you to achieve your goals. Your trust in us is something we deeply appreciate, and we will continue to work hard to deliver content that meets your expectations.
As we celebrate this milestone together, I want to express my heartfelt gratitude to each and every one of you. Your presence in our community has created an environment of collaboration, learning, and growth. I am honored to have such dedicated and passionate subscribers like you.
Please know that your support means the world to us, and we are excited to continue this journey with you. Stay tuned for more exciting content, challenges, and opportunities to expand your coding knowledge and skills.
Once again, thank you for being a part of "Coding with Elias" and for helping us reach 20k subscribers. Let's keep coding, learning, and achieving great things together!
With sincere appreciation,
Elias Yasin,
Founder of "Coding with Elias"
https://youtube.com/@CodingwithElias
Coding Tutorials pinned «Dear amazing subscribers of "Coding with Elias,"🚀👨💻 I am thrilled and grateful to announce that our YouTube channel has reached a significant milestone of 20k subscribers! This achievement would not have been possible without your incredible support, engagement…»
Animated Login Form using HTML & CSS only | No JavaScript or jQuery
https://youtu.be/3C2cB_i9nJk?si=hQuWDsshyMvKYamv
https://youtu.be/3C2cB_i9nJk?si=hQuWDsshyMvKYamv
Forwarded from Coding with Elias
How To Create A Complete Personal Portfolio Website Just using HTML And CSS
https://youtu.be/tjkIMVHMxDs
https://youtu.be/tjkIMVHMxDs