this site was made as a fun school project using html, CSS javascript and jquery. you can see what html, css javascript and jquery do below and you can veiw the code on google crome by right clicking on the page and clicking view page sorce. when you view on test.html (main page), game.html (the game page) i have added comments so you can see what its doing. its all html unless specified
html or hypertext markup language is a form of code used to build websites. what html dose it makes the content of a page. i can say "have this text here" or "show this image" with code. this page runs off html. for html i use code like <.img src="goat.jpg"> (without the dot at begining) to make the webpage display the file goat.jpg. for text i use tags to specify what its going to be. for example i can use the h1 tag to make a title. the GOATWORLD at the top of the screen is a h1. this means it is of most inportance. then there is h2, h3, h4, h5 and h6. all really just less and less of inportance. then theres the p tag or the paragraph tag. this is just for bodys of text. if you look though the code of this site you will notice there are alot of div tags as well. what i do is i take a area of text and put it in a div so i can give it an id. i use the id in css to targit only that area of text.
CSS just like html is used to build websites. CSS makes the webpage look interesting. for example i can say
"make this text blue"
or i can change the size or make the position. with the goatworld banner at the top of the screen i used this code
h1 {
font-family: arial, "Comic Sans MS";
color: #fff;
text-align: center;
background-color: #ff0000;
background-position: center top;
padding: 13px 12px;
margin: 0px;
border: white 1px solid;
}
most of this code you can get but some things such as margin may be a bit confusing. the h1 at the start is targiting the top of the text. you see in html h1 h2 h3 h4 h5 and h6 are how inporten somthing is. but how big is it? this is where the box model comes in. it basicly is the area of an object. it starts as the content. so the text or image its targing. then the padding. thats kind of the spacing of the opject. next comes the border. its pretty self explanitory but the padding keeps it away from the text or image. and lastly the margin. its how far away all other objects have to be from it. click here to view all the css for the page
javascript is a very popular coding language but in this site i only use a bit of JS. if the click the alert button in the navagation bar you will get popups. that javascript being used there.
Jquery is a form of javascript that makes some things easyer to do. on mobile if you click the icon with the three lines you will see a menu slides down. what i am doing is if that button is clicked it will find the menu and slide toggle so it shows. on a desktop a example of jquery is the upload goat button that slides down a form to upload a goat