HTML - Simple Newbie Questions Regarding Viewing Html
I am creating my first web page through HTML using notepad. How do I view it (without publishing it) on a web page? What ive done right now is open internet explorer to a blank page (meaning not connected to the internet) and I thought id be able to view it by opening up view code and then cut and pasting my code into it that way. It didnt work! Im stuck and Im trying to get creative to find the answer but am not finding one. If anyone knows- a simple and VERY detailed explanation would be great! Im very new to the web- thanks in advance!
Similar TutorialsHi: I am new to this group and to html programming .. sort of. I am trying to find a way to display http headers from an html file (index.html) The scenario is that I can display the http header variable and value information in my apache access.log file by setting the logformat in the httpd.conf file; and I need to verify that these are all available in the launched index.html file And recommedations greatly appreciated. Ron First let me excuse myself for being so un-educated with HTML. Or any language for that matter.. I currently am starting a photography business and since Facebook is a great way to connect, I am in the process of making a professional looking Page via their FBML Tab (the fact that I am coding through facebook shouldn't interfere with my questions). There are two thing I am trying to achieve that I am sure are simple too, but I don't know how. Here goes: Question 1: These boxes are almost literally what I will be doing on my site. There are three images below this text, the first two you see are seamlessly touching horizontally. I need to know how to achieve this vertically also, with not even 1px between a top and bottom image (Here would be about a 2px space if I were to put <br> in my code [or return key]. But If I don't do something, the boxes would stay horizontal) Question 2: This is a mock-up of what the starting page will look like. In the blue box is my question. I hope this ^ made since. And the reason why I mentioned imageshack.us is because I dont have anywhere else to host images, so the code would have to accommodate several completely different image URLs. If any additional info is needed please lmk. I am pretty eager to get to workin on this. - Brandon 1. How to protect a HTML file to avoid to run it from other URL? (then I would encrypt the HTML) 2. How to avoid to run the rest of HTML code if a URL/picture is not found? 1. When designing for an 800x600 resolution, am I supposed to start with the same size canvas in PS? I've heard that some people reduce the height or width a little but I've never understood why. 2. When designing a site, should I use a white background when opening a new file in PS, or should I start with a transparent background? What do others do and why? Thanks. Hey, Firstly let me just say, Hi everyone, first time here, etc etc. Right I shall get straight to the point of why I am here, and hope that some kind soul can help me. 1. I work in a educational environment, and we are looking at publishing our students timetables on the intranet, running on a link something like http://intranet/students/timetable/ inside that file would be their timetable (just a plain old HTML doc) each student already has a unique ID and their file would take that name, so what I want to do, on our main index page is put a little tiny form in at the top, of which they can just type in their number, press go, and it to bring up there timetable. Buttttt! I have no idea how to do it, the actual form would need the preset link then take the inputed data, add it too the end, then forward on to the said page. is it possible? if so could you kindly tell me how? or a little script would be god sent Thanks in advance for that one if you reply. 2. I was going to do number two, but after all of my typing it dawned on me what the solution was, doh! Kieran. Hi, I am semi new to HTML coding, I have created several basic websites but I am currently working on a bigger web project. I am hoping to create a website that will get traffic, and I am trying to make it as legit as possible, but of course, I do not know how to do certain things, and help would definitely be appreciated So first of all, the website will be kind of like a news page, so I might very well be updating the main page several times a week with new articles, and as I update, I want the older updates to go to page 2, and articles in page 2 to go to page 3 and on...So it is like a Stack, but I just do not know how to express or code this in HTML or what have you. The second is I wish for people to be able to comment on each article. Now I am not sure if I want them to be signed up users or anonymous, but at the least some kind of system so that people can comment on the articles and talk to each other. Also a a side question, if and only if, the site began to get ads or something, where and how would they be implemented? I have extra spaces at the left and right sides of the website, so I am thinking they could just be implemented there? Sorry to all if these questions sound obvious, but I would appreciate any kind of help Thank you for your time! hi this is my 1st post and i am so desperate needing help i recently did a website.. the site is viewing fine in Mac safari, windows opera and firefox.. but when comes to IE, the table is in a mess.. can someone help me? i can upload the file if possible.. below is the pictures. Opera: IE: Hi All, Quick question, Is there anyway you can stop people viewing your source code in there browsers? by that i mean im building a website and im spending alot of time on it and i dont want people to take bits and pieces from it......im kind of answering my own question here by saying no you cant but maybe someone else has a different view? Thanks Hi Guys. I recently updated my website, I moved my company logo so it would be above my main navigation, however by doing this I needed to change the .css slightly (the "Stage" width was altered - this was the only thing I changed). By doing this it allowed for a slightly newer navigation layout which you can view HERE. However since I have done this, the website is no longer viewable properly using a Mac (it still looks fine on a PC) why would this have changed? (I took a screen grab of what I mean - you can view it HERE I'm not a pro by any means, I have self taught myself but I am seriously stumped by this. Any help is welcome! I write for a weekly newspaper and am looking to make the web posts a little nicer on the eyes. So, there a few bits of help I could REALLY use! I'll explain each but here's a quick rundown first: 1.) Wrapping text around a captioned image 2.) Single-line breaks in the caption 3.) The biggie -- a pop-up text box when a link is moused over. 1.) When I'm posting an image, a caption is almost always necessary. Here's the code I've been using for the image and caption: "<table class="image"> <caption align="bottom">CAPTION</caption> <tr><td><IMAGE LINK></td></tr> </table>" But when I post like that, there's a break between paragraphs to show the image, which disrupts the reading flow. I need a code that will let me post an image, add a bottom-aligned caption, and still have the story text print alongside the image. 2.) When posting images and captions using the above code, I'd like to have single-line breaks in the caption. "Name (new line), Job Title." Something like that. When I try this using "<br>" though, there's an extra line space between the two text lines. Surely this is a simple fix, but I'm no html expert. 3.) I'm willing to spend hours to learn this one. Somebody, somebody has to know how to do this one. OK, ESPN.com is the best example I've seen. You mouse over a story link, and a box pops up with a paragraph's description of the story. For someone looking to find new ways to boost hits on a news site, this is a priceless gem. If anyone knows how to do this or something similiar in HTML, PLEASE let me know. Edit: After posting this, I noticed that the same thing happens on this site. You highlight someone's post, and the beginning of the post's content is displayed. How do I do this??? Thanks in advance to each and every person who reads this, and a special thanks to those who take the time to help. It means much. aefattwotgm@aol.com Hi, I've decided to use subdirectories and index.html files to present my all my web pages (www.website.com/about, with a index.html file within the about folder). But I am finding it difficult to view my website locally when editing, as I open it in either firefox, safari, opera and every time time I hit a link it doesn't direct me to the index.html file, but instead shows me every file located within the directory. Is there anyway round this, as I am having to upload every page to view the changes I make to it. For example, do you know of any extensions or different web browsers that don't do this? Thanks, Matthew Hi everyone. I am looking to engage someone in conversation about an HTML cut-up excercise I am currently working on. I have some basic HTML and CSS experience from several short evening courses I attended a couple of years ago, built myself a couple of very basic, amateur sites (I am interested in 3d modeling and built myself a couple of portfolio sites to show some of my models), and went as far as to fumble my way through putting together a practice e-commerce site using PHP/mysql/apache. This was all a couple of years ago now and I had thought web design was a thing of my past. But, in a slightly strange turn of recent events I put myself forward for an seo position at a local web dev company, and came away asked if I would be interested in a junior front end developer role. I am eager to take on this challenge, and have been given an html cut-up excercise to do as a barometer of my abilities. Everything I have ever done web wise, has really been from scratch, so this cut-up business is very new to me. I found several videos on youtube which all centred around the slice tool in photoshop, and then saving out the slices as an html and images file, to then fine tune elsewhere, in my case, Dreamweaver. I am conscious though, of not having an image heavy webpage, and also am not happy with the huge and complicated table that Photoshop coded for me as a result of all my slicing. So, does anyone have any experience with Photoshop cut-ups, and ideas to get the best results from the outcome. At the moment, Ive hand coded most of the buttons, so they are no longer images, and added links to them. But I got to a point where all the 1 pixel high 'spacer.gif's' were getting on my nerves that I deleted all of them. Then that left me with a very distorted and empty looking table, so I deleted all the table elements from the code also. So my idea from here is to use divs and absolute positioning to place all the leftover 'necessary' parts, how they look in the original psd image. Does it sound like I am on the right path? I assume there are several methods of going about a cut-up. Could anyone give me some advice? Ben Hi all, I'm wondering if someone could explain a little about the validation of my site? http://validator.w3.org/check?uri=ht...ctype=Inli ne For one thing, I can't understand why it gives the wrong line in the code for the error, and what is means by the column of the code. Neither of them correspond in any way with my code, that I can see. Also, why is telling me that maginheight, height, etc., are all invalid elements. Finally, will being html 4 compliant help my page rank in any way? http://plustom.tumblr.com/ This is my current blog and I need some help tweaking it. 1. When you hover over the sidebar title/picture, it turns bright/white. Is there a way to make it stay bright/white without hovering over it? 2. Is there a way to move the sidebar with the title/picture over to the left? 3. When you hover over the picture in the middle, there's a small square box at the top left corner of the picture. It's white when you hover over the picture, but when you hover over the square, it's gray. Is there a way to make the square box stay white all the time? 4. There is a white line under the picture. Is there a way to make it bold similar to the line under "Amnesia"? Current HTML code: (Can't seem to post rest in next post). HTML Code: <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <title>{Title}</title> <meta name="color:Background" content="#FFFFFF"/> <meta name="color:Font" content="#000"/> <meta name="font:Text" content="Arial"/> <meta name="color:Primary" content="#dcdcdc"/> <meta name="color:Primary Font" content="#fff"/> <meta name="color:Secondary" content="#eee"/> <meta name="color:Tertiary" content="#ccc"/> <meta name="color:Shadow" content="#dcdcdc"/> <meta name="if:Show Caption" content="0"/> <meta name="if:Fixed Sidebar" content="1"/> <meta name="if:Infinite Scrolling" content="0"/> <link rel="shortcut icon" href="{Favicon}"> <link rel="alternate" type="application/rss+xml" href="{RSS}"> {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}<link href='http://fonts.googleapis.com/css?family=Lekton' rel='stylesheet' type='text/css'> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js" type="text/javascript"></script> <script src="toggle.js" type="text/javascript"><!--mce:1--></script> <style type="text/css"> body {font-family: {font:Text}; font-size: 12px; color: {color:Font}; background-color: {color:Background};} #right {width: 250px; left: 50%; top: 50px; margin-left: 220px; position: absolute; {block:IfFixedSidebar}position: fixed;{/block:IfFixedSidebar} opacity: .7; -webkit-transition-duration: .3s;} #right:hover {opacity: 1;} #right a {text-decoration: none;} .title {padding-bottom: 10px; border-bottom: 2px solid {color:Tertiary}; font-size: 14px; display: inline-block; font-weight: bold; margin-bottom: 10px;} a {color: {color:Font};} .link {font-size: 11px; display: inline-block; margin-top: 5px; font-weight: bold;} #center {width: 400px; margin: auto; margin-top: 50px;} #description {margin-bottom: 5px; font-size: 11px; max-width: 200px;} .entry {margin-bottom: 20px; padding-bottom: 20px; border-bottom: 1px solid {color:Secondary};} .entry img {-webkit-box-shadow: 1px 1px 1px 1px {color:Shadow} !important; max-width: 400px;} .perma {position: absolute; opacity: 0; -webkit-transition-duration: .2s; z-index: 1;} {block:IndexPage}.entry:hover .perma {opacity: 1;}{/block:IndexPage} .permalink {display: inline-block; padding: 10px; background-color: {color:Primary}; color: {color:Primary Font};} .permalink:hover {opacity: .7;} .exclamation {display: inline-block; margin-left: 1px; opacity: 0; -webkit-transition-duration: .2s;} .link:hover .exclamation {opacity: 1;} .text_perma {width: 100px; text-align: right; position: absolute; margin-left: -110px; -webkit-transition-duration: .2s; opacity: 0;} {block:IndexPage}.entry:hover .text_perma {opacity: 1;}{/block:IndexPage} .text_permalink {border-bottom: 1px solid {color:Background}; display: inline-block; -webkit-transition-duration: .2s;} .text_permalink:hover {border-bottom: 1px solid {color:Secondary};} h2 {font-size: 14px;} h2 a {text-decoration: none; border-bottom: 1px solid; -webkit-transition-duration: .2s;} h2 a:hover {border-bottom: 1px solid {color:Background};} .label {margin-right: 10px; font-weight: bold;} .album_art {display: inline-block; margin-right: 10px; float: left;} .album_art img {width: 150px; height: 150px;} .audio {display: inline-block; min-height: 150px; max-width: 207px;} ol.notes {margin-left: -45px; list-style-type: none; width: 400px;} ol.notes a:hover {text-decoration: none;} ol.notes blockquote {margin-top: -3px; margin-left: 0px; padding-left: 13px; padding-top: 5px; border-left: 11px solid {color:Primary}; margin-bottom: 0px;} ol.notes li.note {padding: 5px;} li.note img {margin-right: 10px; width: 11px; height: auto; opacity: .5; -webkit-transition-duration: .3s;} li.note:hover img {opacity: 1;} .entry blockquote {border-left: 2px solid {color:Primary}; padding-left: 10px; margin-left: 25px;} .player {-webkit-box-shadow: 1px 1px 1px 1px {color:Shadow};} #tags {margin-bottom: 20px;} #tags a {margin-right: 10px; opacity: .7; text-decoration: none;} #tags a:hover {opacity: 1;} .nav_1 {display: inline-block; width: 50%; margin-bottom: 20px;} .nav_2 {display: inline-block; width: 50%; text-align: right; margin-bottom: 20px;} #nav a {text-decoration: none;} #nav a:hover {font-weight: bold;} .audio_symbol {padding: 7px; background-color: {color:Background}; opacity: .9; border-radius: 100px; position: absolute; margin-top: 7px; margin-left: 7px; font-size: 14px; height: 15px; width: 15px; -webkit-text-stroke: 1px transparent;} {block:IfInfiniteScrolling}.regular_pagination {display: none;}{/block:IfInfiniteScrolling} </style> </head> <body> <div id="right"><div style="display: block;"><div class="title"><a href="/">{Title}</a></div></div> <div id="description">{Description}</div> {block:AskEnabled}<div style="display: block;"><div class="link"></div></div>{/block:AskEnabled} <div style="display: block;"><div class="link"></div></div> <div style="display: block;"></a></div></div> {block:SubmissionsEnabled}<div style="display: block;"></a></div></div>{/block:SubmissionsEnabled} {block:HasPages}{block:Pages}<div style="display: block;"><div class="link"><a href="{URL}">{Label}<div class="exclamation">!</div></a></div></div>{/block:Pages}{/block:HasPages} <div style="display: block;"><div class="link"></a></div></div></div> <div id="center"> 1. Under the picture, there are some tags (funny, meme, comic). When you hover over the tags, they turn white/bright. Is there a way to make this stay white/bright? (http://plustom.tumblr.com/post/18287272359) 2. Under the picture, there are pictures of some people. When you hover over their pictures, they turn white/bright. Is there a way to make this stay white/bright? (http://plustom.tumblr.com/post/18287272359) 3. Under the pictures of the people, there is a link that says "Previous Post". When you hover over it, it gets bold. Is there a way to make this stay unbold? (http://plustom.tumblr.com/post/18287272359) Current HTML code: (Excuse the faces). HTML Code: body {font-family: {font:Text}; font-size: 12px; color: {color:Font}; background-color: {color:Background};} #right {width: 250px; left: 50%; top: 50px; margin-left: -400px; position: absolute; {block:IfFixedSidebar}position: fixed;{/block:IfFixedSidebar} -webkit-transition-duration: .3s;} #right:hover {opacity: 1;} #right a {text-decoration: none;} .title {padding-bottom: 10px; border-bottom: 2px solid {color:Tertiary}; font-size: 14px; display: inline-block; font-weight: bold; margin-bottom: 10px;} a {color: {color:Font};} .link {font-size: 11px; display: inline-block; margin-top: 5px; font-weight: bold;} #center {width: 400px; margin: auto; margin-top: 50px;} #description {margin-bottom: 5px; font-size: 11px; max-width: 200px;} .entry {margin-bottom: 20px; padding-bottom: 20px; border-bottom: 2px solid {color:Secondary};} .entry img {-webkit-box-shadow: 1px 1px 1px 1px {color:Shadow} !important; max-width: 400px;} .perma {position: absolute; opacity: 0; -webkit-transition-duration: .2s; z-index: 1;} {block:IndexPage}.entry:hover .perma {opacity: 1;}{/block:IndexPage} .permalink {display: inline-block; padding: 10px; background-color: {color:Primary}; color: {color:Primary Font};} .permalink:hover .exclamation {display: inline-block; margin-left: 1px; opacity: 0; -webkit-transition-duration: .2s;} .link:hover .exclamation {opacity: 1;} .text_perma {width: 100px; text-align: right; position: absolute; margin-left: -110px; -webkit-transition-duration: .2s; opacity: 0;} {block:IndexPage}.entry:hover .text_perma {opacity: 1;}{/block:IndexPage} .text_permalink {border-bottom: 1px solid {color:Background}; display: inline-block; -webkit-transition-duration: .2s;} .text_permalink:hover {border-bottom: 1px solid {color:Secondary};} h2 {font-size: 14px;} h2 a {text-decoration: none; border-bottom: 1px solid; -webkit-transition-duration: .2s;} h2 a:hover {border-bottom: 1px solid {color:Background};} .label {margin-right: 10px; font-weight: bold;} .album_art {display: inline-block; margin-right: 10px; float: left;} .album_art img {width: 150px; height: 150px;} .audio {display: inline-block; min-height: 150px; max-width: 207px;} ol.notes {margin-left: -45px; list-style-type: none; width: 400px;} ol.notes a:hover {text-decoration: none;} ol.notes blockquote {margin-top: -3px; margin-left: 0px; padding-left: 13px; padding-top: 5px; border-left: 11px solid {color:Primary}; margin-bottom: 0px;} ol.notes li.note {padding: 5px;} li.note img {margin-right: 10px; width: 11px; height: auto; opacity: .5; -webkit-transition-duration: .3s;} li.note:hover img {opacity: 1;} .entry blockquote {border-left: 2px solid {color:Primary}; padding-left: 10px; margin-left: 25px;} .player {-webkit-box-shadow: 1px 1px 1px 1px {color:Shadow};} #tags {margin-bottom: 20px;} #tags a {margin-right: 10px; opacity: .7; text-decoration: none;} #tags a:hover {opacity: 1;} .nav_1 {display: inline-block; width: 50%; margin-bottom: 20px;} .nav_2 {display: inline-block; width: 50%; text-align: right; margin-bottom: 20px;} #nav a {text-decoration: none;} #nav a:hover {font-weight: bold;} .audio_symbol {padding: 7px; background-color: {color:Background}; opacity: .9; border-radius: 100px; position: absolute; margin-top: 7px; margin-left: 7px; font-size: 14px; height: 15px; width: 15px; -webkit-text-stroke: 1px transparent;} {block:IfInfiniteScrolling}.regular_pagination {display: none;}{/block:IfInfiniteScrolling} im going to start off saying that thanks for helping me with the layout changer, it works awesome, thank u guys for ur patience well i have a site aka spt.byethost7.com i have a few questions - I want when someone clicks a link on my menu i want the site not to move just the middle part which is where i will have the stuff of which the link will represent. for example: http://www.pokenebula.mihopa.net/ click Berry Dex under General, ull see that the page doesnt change just the middle part, can ya tell me please? - Is byethost a good host? - can i get the best free host? if so please tell me thanks for ur time Hello all. I'm new to these forums. A new free MMO is being launched on June 20, and I have decided to make a nice guild page for the guild me and a friend have made. However, having absolutely no experience whatsoever with coding, I've run into some problems. The site may be viewed he www.maliceadmin.5gbfree.com I have set the site up perfectly the way I want it on my main desktop. Everything is aligned perfectly, no trouble at all. This is on a 19 inch monitor at 1280x960 resolution. However, I was just surfing the web upstairs here on my laptop and decided to check out my site. The text is not aligned properly as it was shown on my main desktop. I'm completely new to coding so please be very detailed in your responses. Does anybody know what the problem might be? Also, I couldn't figure out how to adjust the height of my table. For example, when text reaches the end of the black box, I want it to cut off and have a scrollbar to be scrollable. My final and least important question why the text size and alignment works on Firefox, but not IE. That would be all. Thanks for your time. Okay I'll be very happy of any help I get. So I know something about html- code but not enough. I need to create a site witch has a background image, centered switching page(like example: http://www.oipolloi.com/), and three links: Home, Gallery and Contact. Thanks already. Hello this is my first post i know some things about html but not too many i want to make a site but dont know some thing yet. i dont want to download a template i make it with notepad now. 1)how exactly i can put images at the exact place and there isnt any space between pictures? 2)how i can put pictures on pictures, i want to make a small image that inside there will be links and those links will be small images 3)i want in the middle of site to be some news that will be written in front of an the image for news how i do that. 4)also i want to make a small windows that will saw some picture and those pictures will change every 5 seconds for all these things will i need any other programm or i can do it just with notepad? |