Hello guys and gals,
I just started coding maby a year ago have been going slow learned html and css not perfectly but hey im here trying to get better.
I notice that the tribute project has three different code places html css and javascript and I read that you can do html or css but css preferably since thats what you learned, I put alot of code into the html with css inline I think but now I need to resize the image and I found a way to do that in the css window now I doubt that professional codersa have three windows and in the real world it all has to go in one page can someone explain that to me and maby show me a picture of what the actual code is gonna look like in one window with html and css on top of it.
Thank you so much everyone
-AstralWolf
I doubt that professional codersa have three windows and in the real world it all has to go in one page
Quite the opposite. One of the mantras of programming is Don’t Repeat Yourself. To that end, HTML, CSS, and JavaScript are kept in their own files so they can be used over and over. If you look at the source for the page we’re on, you’ll see things like this in the header:
<link rel='preload' href='/forum/assets/google-universal-analytics-f35b4da49411e6f5559073523aab983da483976a3954c79c756f8579f6fbd6ef.js' as='script'/>
<script src='/forum/assets/google-universal-analytics-f35b4da49411e6f5559073523aab983da483976a3954c79c756f8579f6fbd6ef.js'></script>
<link href="/forum/stylesheets/desktop_1_3be540ccafb29304257cc356caa34ae401c7fb8f.css?__ws=www.freecodecamp.org" media="all" rel="stylesheet" data-target="desktop" data-theme-id="5"/>
<link href="/forum/stylesheets/desktop_theme_5_b5ef61072528f05b31a1c95f970bdbd24a9ed0de.css?__ws=www.freecodecamp.org" media="all" rel="stylesheet" data-target="desktop_theme" data-theme-id="5"/>
Those link and script elements tell the browser to load those external resources alongside the HTML file we’re looking at. Some of them aren’t even FCC assets; you can see they’re loading files from Google. This is all very common and you should follow this practice by avoiding inline styles and using the external CSS and JS files.
I don’t know your coding set up but it sounds like you are using codepen. The FCC projects by default is set up with 3 windows- HTML, CSS and Javascript. If you were to develop the tribute page in your own editor you have more control over what windows to have.
In-line CSS tends to get confusing with HTML- and as the poster above mentioned- it may be easier to have HTML in one file with a reference to a CSS file and put all your CSS in a 2nd file.
To each their own…
If you have never used an editor and you don’t have one installed you can look at something like codesandbox to see how using an editor works/looks.
I would suggest learning to use an editor (like VS Code).
thanks so much guys yes im using codepen and when im not im using vscode.
but this was great it answered all my questions so thank you so much!