browser (IE, chrome) open plain text not html file - html

I am using Sublime Text 2 to write my testing html file. I save the text as HTML format.
Then when I try to open the file with browser by either drag&drop or Open_With...
Then.....
The browser open my plain text file, not the actual html.
This is what it look like. Just white background and these text.
<!DOCTYPE html>
<head>
<title>A Hello World Page</title>
</head>
<body>
<p>Hello World</p>
</body>
This is my first time with html ever, do I have to do special setup with anything? I just use default SublimeText2.

That may be because you are missing the main tag <html>.
Do this:
<!DOCTYPE html>
<html>
<head>
<title>A Hello World Page</title>
</head>
<body>
<p>Hello World</p>
</body>
</html>
<html> is the main tag, browser will look for to tell whether it is html or not.
Also make sure it is saved as .html or .htm

Open up Sublime Text, press CTRL SHIFT + P.
Type in HTML into the box and select Set syntax: HTML.
Then, in the file, type in html then press tab straight after and it should create a snippet (which is default):
<html>
<head>
<title></title>
</head>
<body>
</body>
</html>
Then make sure you save the document as .html or .htm.
This should work in your browser after.
Note: Setting syntax and doing snippet wont actually 'help' in terms of this question, but will help you in HTML by making things quicker and having syntax highlighting.

Related

Why does my html file not show up in Chrome?

So I started learning HTML today and the first file I coded does not come up in Chrome after being formatted. This is what the code looks like:
<!DOCTYPE html>
<html>
<head>
<title>Nikolay's Website</title>
</head>
<body>
</body>
</html>
And after I tried opening the file, which is of type "Chrome HTML Document" btw (thought it might help as info), it shows a blank page with no heading. Even if I remove the code and type "Hello World" it would still show a blank page in my browser.
HTML page should have the following default structure. Please refer this link https://www.w3schools.com/html/default.asp
<!DOCTYPE html>
<html>
<head>
<title>Nikolay's Website</title>
</head>
<body>
Hello World
</body>
</html>

Notepad++ html files not displaying in Chrome

I'm just starting to learn to code html but when I try to open the text file with chrome it displays as a plain text file with the html code in an not as an html document like the "Hello World" test. Or if i try to launch with Chrome it opens Google home. Can anyone help?
Make sure your file is saved using a .html extension.
<!DOCTYPE html>
<html>
<head>
<title>This is title</title>
</head>
<body>
<h1>Hello world - this is a heading.</h1>
<hr />
<p>This is my first HTML paragraph.</p>
</body>
</html>
The code from above leads with Chrome to the following result:
Test yourself with exercises from w3schools.com e.g.: HTML Tutorial

When i run my html code it appears blank in chrome (html)

I have a very simple code but when I go running it in chrome it's blank. Other files work fine. I do not know what to do;
Move the Title inside Head
and Close the tag.
If still doesn't work, refer following code:
<!DOCTYPE html>
<html>
<head>
<title>Future Technologies: Asteroid Mining</title>
</head>
<body>
<p>Asetroid Mining</p>
</body>
</html>

How to make code show up in a HTML paragraph?

I want to be able to make code show up on my website so that it shows up with the code on the webpage instead of using it as code in the HTML file itself.
Example:
<!DOCTYPE html>
<html>
<body>
<p>Hello World</p>
</body>
</html>
Instead of:
Hello World
I know I explained that horribly but I'm sure you can see where I'm coming from. Can you escape in HTML? Or is there a tag that allows for HTML code to be viewed as text on a webpage?
xmp tag
<!DOCTYPE html>
<html>
<body>
<xmp><p>Hello World</p></xmp>
</body>
</html>
keep in mind that xmp tag is considered obsolete, as far as I know it is still supported by most browser but your mileage may vary.
you are safer if you use <pre> and escape html code with < and > like this
<!DOCTYPE html>
<html>
<body>
<pre><p>Hello World</p></pre>
</body>
</html>
There is similar question answered on this link: Display HTML code in HTML
In addition, have a look at the following websites
https://craig.is/making/rainbows
https://highlightjs.org/
You can use the xmp property. Anything inside the xmp that is exempted by the browser while rendering the HTML code.
Example :
<xmp><h1>Heading</h1></xmp>

Why aren't the CSS rules I am writing being applied?

For some strange reason, I cannot edit or apply styles to html in Sublime Text 2. I cannot do internal styles or link to external styles. However, if I take code that I have done into Dreamweaver or Notepad++, the styles are applied and editable? How can I get sublime Text 2 to allow me apply and edit styles?
I have Windows 7 and I'm new to HTML and CSS. I'm trying to learn different code editors, but it's quite difficult when the editors won't work :(
Thanks!
ETA: When I mean styles I mean css. I can't view any css styling on my html page on Sublime text 2. Only when I use notepad++ or dreamweaver. I can't see css in a browser when I use sublime text 2.
Here's my code:
<!DOCTYPE html>
<head>
<meta charset=utf-8" />
<title>Untitled Document</title>
</head>
<style>
body{
background: orange;
}
</style>
<body>
</body>
</html>
You're issue isn't with the editor; it's likely that there are some errors in the document.
You're currently missing the opening <html>, <style> elements should be inside either the <head> or <body> rather than between them, and the charset attribute should have a 2nd quotation to surround the value:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Untitled Document</title>
<style>
body{
background: orange;
}
</style>
</head>
<body>
</body>
</html>
The issue is not the text editor, it must be your code. You may be opening an outdated file and looking for the changes in there. Make sure that you are saving the file in the correct location and opening the correct file when looking for changes.
Also, make sure that you are saving it as .html, Sublime Text 2 will not automatically give your files an extension like Dreamweaver or other editors might.