"This won't transfer to the FileZilla correctly from Notepad++ the images won't show? I asked the teacher for help, but he doesn't know the material well enough to trouble shoot the problem. Internet Explorer will run the module and the text runs just fine, but Google Chrome say Error 2, and FileZilla won't register the pictures, they only show as black box icons, pls help"
<html>
<head>
<img src="images/images12.jpg" style="padding:6px" align="center" height="400px" width="400px">
<style>
#this is the set up for the text body {
font-family: Papyrus, fantsy;
text-align: center;
}
h1 {
font-family: Papyrus, fantsy;
text-align: center;
}
h2 {
font-family: Papyrus, fantsy;
text-align: center;
}
</style>
header for the home page
<title> Woody's Wondering's</title>
<header>
<h1>Which way did Woody Go?</h1>
</header>
<nav>
<b>
Home
Places To Go
Whats Free
<br>
<br>
Kids....Cheap easy Fun!
<br>
Adults Only
</b>
</nav>
<main>
<h2>You Next Adventure is only a click away!!!</h2>
<p>Welcome to Woody's Wonderings were everything is cheep and easy to find in Ohio.....How Cheap, well pracically 20 dollars to free. </p>
<h2>Meeting all your fun fun needs!!!</h2>
<p>Keeping the site updated with new and improved places & Events year around
</p>
</main>
<footer>
<small><i>
Jessica Harper</i></small>
</footer>
</body>
</html>
Your image is in the head of the html document. Correct structure for html is,
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>The HTML5 Template</title>
<!–– Style sheets & other importations go here ––>
<link rel="stylesheet" href="css/styles.css">
</head>
<body>
<!–– Your content goes here ––>
<!–– Javascript files go here ––>
<script src="js/scripts.js"></script>
</body>
</html>
From w3schools,
The element is a container for metadata (data about data) and
is placed between the tag and the tag.
HTML metadata is data about the HTML document. Metadata is not
displayed.
Metadata typically define the document title, character set, styles,
links, scripts, and other meta information.
But I tested myself, and the images do work if the image exists in the path. Please check the image exists in the location you have in the img tag.
I am assuming you have uploaded the images along with the html file. If not please upload the images through filezilla to the correct location.
The best way to find what is the issue is to check the browser console. You may find an error saying no image found in path/to/your/image and that is where you have to put your image!
Your HTML is malformed and does not have an opening <body> tag, which could be causing some issues. I'd recommend using the W3C HTML Validator to validate your code.
Errors like this are easier to visually spot if you use some sort of code-formatting/"pretty-print" tool (I like this one).
Notepad++ probably has a plugin for this as well.
Related
I'm currently working on a project for school, and I was wondering why my stylesheet isn't linking to my HTML file, I've tried rewriting it, putting it in different places, and still nothing! Here's the code if needed
<!DOCTYPE html>
<html>
<head>
<title>About Me</title>
<link type="text/css" rel="stylesheet" href="css/stylesheet.css"/>
</head>
<body>
<h1>About Me</h1>
<p>Hello everyone and welcome to my little website!</p>
<p>You can just call me Golden Rose<p>
<p>I play/watch and review games, movies, and tv shows (especially horror).</p>
</body>
</html>
body {
font-family: sans-serif;
}
If you can ensure the file location is correct, you may need to do a browser refresh. This can be done in Chrome by pressing control and f5 at the same time. This will clear all cache and force the stylesheet to load.
I am using Sublime text to write some HTML and CSS files. I've created my index.html:
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Meta -->
<meta charset="UTF-8" />
<title>RainyDayBakes</title>
<!-- Styles -->
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<h1 style="text-align:center">RainyDayBakes</h1>
<nav style="text-align:center">
<a href=”C:\Users\sarah\Documents\Simmons\CS-321\page1.html”> About </a>
<a href=”page2.html”> Menu </a>
<a href=”page3.html”> Gallery </a>
<a href=”page4.html”> Order </a>
<a href=”page5.html”> Contact Us </a>
</nav>
<img src="cake.png" alt="oreo crumble cake" class="center">
<h3>Welcome to RainyDayBakes!</h3>
<p>We are a local bakery specializing in creative cakes, cupcakes and cookies!</p>
<p>In addition to being open daily we also offer custom ordered confections.</p>
<!-- Scripts -->
<script src="scripts/index.js"></script>
</body>
<footer>
</footer>
</html>
my page1.html:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>This is Page One </title>
</head>
<body>
</body>
<footer>
</footer>
</html>
and my style.css:
<style>
h1 {
color:red;
}
</style>
When I try to run index.html in Chrome, the link to page1.html says it doesn't exist, and the CSS won't show up. They're all in the same folder, I've saved all the files, and I'm running on Chrome. Every other solution I've found refers to making a typo, the directories being different, etc. but as said, they're all in the same folder, and I haven't noticed a typo (but it's entirely possible when you're too close to your code).
First off, you're not even using the tag anywhere in your code, so that's why the style isn't showing up. Secondly, if they are in the same folder, just link your about page to page1.html; not the full directory listings.
You are using typographical quotes in your links' href attributes, which won't work. Change those to regular quotes.
Let the link be this way instead href=”page1.html”
You might want to put a link to your CSS file on all your pages, I don't see it on your page1.html You probably already know about this resource but I mention it just in case you don't: W3 Schools is very handy for a quick reference to a lot of HTML/CSS questions.
So you have two issues:
For page1.html, would suggest adding file:// or file:/// to the beginning of the href element, or maybe retyping the line since the other links worked
For your CSS, remove the tag, it's for when you put the style inside the HTML file(embedded)
This isn't an issue with your code. I was having the same exact problem too and i recently discovered that the problem likely lies in the IDE that you're using. I was using stackblitz and recived the same output. But when i switched to an online compiler and litteraly copy & pasted the code with the same file names, the code started working correctly. Try using an online compiler and see how that works out for you. It worked for me.
The compiler I used is:
https://www.onlinegdb.com/
make sure to switch the languate to HTML using the language dropdown on the top right corner.
I am having trouble getting my HTML code to link to my CSS code once I FTP it onto the server. Both CSS File and HTML File are in the same directory on the server. I would like to note that I have attempted to clear the browsers cache and use a different browser and nothing seems to be working.
Here is my HTML code:
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8" />
<base href="http://people.rit.edu/~username/rop/" target="_blank">
<title> My ROP Home Page </title>
<link href= "style.css" type="text/css" rel="stylesheet">
</head>
<body>
<div class = "things">
<h1> All About Me </h2>
<div id = "activities">
<h2> I'm a fan of video games </h2>
<p> As the title suggests, I love to play video games. I have been playing video games since I was 8 years old. I started with a Nintendo 64 and have since then begged my parents for every new system to date (obviously that wont work anymore).
This hobby is part of the reason I wish to become a web developer. When I was young, I spent time browising websites like IGN, and thought that one day I could make something like that. Now I set my sights a little higher, seeing as I want to be able to develope professional websites.
</p>
<h2> My Favorite Food is Pizza ( I Can't get enough!) </h2>
<p> Seriously, I could have Pizza everyday of the week and not get sick of it. I like all kinds of toppings except pineapple. I must have pizza at least once a week no matter how unhealthy that may be. Of course, local buisnesses make better pizza then large chains.
</p>
<h2> I am a SOIS student focusing on Web Development and other IT centered courses</h2>
<p> SOIS is the School of Individualized Study. Basically I create a major that is more in line with what I want to get out of R.I.T. Students of SOIS must pick two specializations in order to create a degree. Other than that, it is just like other degrees at R.I.T with many of the same requirments.
For example, I specialize in Web Development (front-end) and some networking.
</p>
<h2> I'm a Big Fan of cheesey monster movies </h2>
<p> For reasons unknown, I have been drawn to old Godzilla movies that clearly have not aged well. I think it's neat to see how they made those films without cgi or technology. Seeing the behind the scenes of the mini cities is always a neat experience for film fans.
</p>
</div>
</div>
<div id = "brian">
<img src ="brian.jpg" alt="brian" style="width:304px;height:228px;">
</div>
</body>
</html>
CSS code
h1, h2, p{
background-color: #100733;
}
title {
font-family: Helvetica, Arial, sans-serif;
text-align: center;
text-transform: uppercase;
}
.things {
color: white;
font-size: 18px;
}
#brian {
float: right;
}
#activities {
font-size: 18px;
text-align: left;
}
p {
background-color: #100733;
color: white;
}
Any help would be greatly appreciated.
Didn't you forget about the opening < in the first line (Doctype)?
Make it <!DOCTYPE html> and be sure that your style.css file is in the same directory as your index file.
EDIT:
Not Found
The requested URL /~username/rop/ was not found on this server.
Apache Server at people.rit.edu Port 443
So it does not work because of the base tag. Are you sure that the provided location works? When I open https://people.rit.edu/~username/rop/ it gives 443.
EDIT 2:
Change:
<base href="http://people.rit.edu/~bxa9985/rop/" target="_blank">
To:
<base href="https://people.rit.edu/~bxa9985/rop/" target="_blank">
First of all
Make sure that you can access the css file using the browser.
If your url is, say example.com, and you access your html file like this example.com/index.html, then be sure that you can actually see the css if you enter example.com/style.css
It may be that you haven't set the permissions right in the server if you uploaded the files through ftp.
Then other considerations
Make sure that you have the first opening character <
See this
!DOCTYPE HTML>
should be like this
<!DOCTYPE HTML>
Take out spaces after and before equal sign (=)
this
<link href= "style.css" type="text/css" rel="stylesheet">
should be like this
<link href="style.css" type="text/css" rel="stylesheet">
Ok, please don't hate me for my idiocy. I'm literally beginning programming html RIGHT NOW. so, first problem.
I am following a simple guide to learn the basic html formats and this is all I have:
<html>
<head>
<title>www.fuyah.com</title>
</head>
<body>
<div id= "Header" class = "shared_elements">
<!--#divs don't really do anything, just for organization and targeting with css-->
<h1>The Adventure Begins<h1>
<span> this is my page. </span>
This is the beginning down my road of web development. It begins with one step...
</div>
</body>
</html>
For some reason when I look online at my page, everything is bold. I'm not sure why.
You haven't closed your <h1> tag and also <span "> there's unnecessarily " in there
<html> <head> <title>www.fuyah.com</title> </head>
<body>
<div id= "Header" class = "shared_elements">
<!--#divs don't really do anything, just for organization and targeting with css-->
<h1>The Adventure Begins</h1>
<span > this is my page. </span>
This is the beginning down my road of web development. It begins with one step...
</div>
</body>
</html>
Open your file in notepad and verify the contents before uploading the file.
If your see the file contents differently, do a "view source" in the the browser to see the contents.
I was watching tutorials about html for beginners and tried to make a simple html file.
when I open this on google chrome the body "hello" is showing up but the title part "first page" doesn't. Did I type something wrong? thanks in advance for your response.
//I apologies for those of you who already answered this. I now see that I have made a mistake on explaining my problem. I meant to show it as a header not title. I already got the answer from the given answers//
<html>
<head>
<title> first page </title>
</head>
<body>
hello
</body>
</html>
Where do you expect title to be shown?
Title is what usually is displayed in the tab bar of your browser, or as text in your window switcher in your operating system. It does not show up inside your webpage.
Your markup seems to be correct, just look for the title in the browser window.
If you meant to make a title (in the meaning of a large text displaying in your website) one way of doing this is to, below your body-tag, write
<h1>Title here</h1>.
<title> is not showing in web page; it is shown in Tab / Window's title.
Suggested to learn the basic HTML structure first.
i think you want a header
<html>
<head>
<title>my page </title>
</head>
<body>
<h1> first page </h1>
hello
</body>
</html>
I learned that the title is the meta tag (the SEO bits), and the H1 is what shows up on the page. So if you'd like both to be the same, example: Things I've Learned is the title and the header of your website, you'd repeat the line.
<html>
<head>
<title>Things I've Learned</title>
</head>
<body>
<h1>Things I've Learned</h1>
<p>These are the things</p>
</body>
</html>
VIA QUORA:
"The key difference between these tags is where their content appears. That difference impacts how search engines and web surfers analyze your page. Title Tag: The Title Tag is known as a meta tag. ... Because it displays the largest text, the H1 Header tag is often used to create a title at the top of the page."
More on how to optimize titles for search engines here.