HTML and CSS Notes

Question	Answer
What is a script element for?	Script elements ex: <script> </script> Are for running jQuery and JavaScript in your program
What do jQuery functions start with?	A dollar sign operator $ AKA bling
How do you select a class with jQuery?	$(".className")
How do you select an id with jQuery?	$("#idName")
How do you select a type of element/tag with jQuery?	$("elementName") ex: $("div")
How do you adjust the properties of elements with jQuery?	with .prop()
What does jQuery's appendTo() function do?	It moves elements from one div to another ex: $("#target4").appendTo("#left-well");
What does jQuery's clone() function do?	Used with appendTo it will copy something to another element. ex: $("#target2").clone().appendTo("#right-well");
How do you start and end a comment in HTML?	start a comment <!-- end a comment -->
What kind of styling is <h2 style="color: red">	In-line styling
How do you style an element using css?	just the name for elements followed by brackets. . for classes. # for id's ex: h2 { color: red; }
How do you assign a class to an element?	put class="className in the element. ex: <h2 class="myClass" >
How do you assign multiple classes to one element?	how you would with one. but put a space between each class name. ex: <h2 class="class1 class2">
how do you set a font family in css?	h2 { font-family: Sans-serif; } (but use whatever font you want)
CSS: How do you set a second font to default to when the first isn't available?	h2 { font-family: Sans-serif, Monospace; }
how do you insert an image into html?	<img src = "urllink" /> (image source tags are self closing. and also need an alt attribute)
What is an alt attribute in a img src element?	It is for relevant text to appear when an image fails to load. (backup essentially) ex: <img src="stupidfaceimgurl" alt="dumb guys face" />
What are some properties css borders might have?	style, width, and color ex: border-style: , border-width: , border-color:
In what ways can you assign a border-radius value in css	you can assign it in pixels or percentage
What is an 'a' element?	a element stands for anchor. and is an element you use to link to connect to content outside of the current webpage
How do you make text a link in html?	Add an 'a' element with a href attribute. ex: <a href="urllink" > I'm a link! </a>
What is nesting?	Nesting is putting one element inside of another. (makes the outer one the parent. and the inner the child.)
How do you make a dead link?	with a hashtag baby. ex: <a href="#"> I'm dead </a>
How do you start an unordered list in html?	<ul> followed by <li> for reach item then </li> and </ul> when your done with the list
How do you make input elements?	use <input > (input elements are self closing btw) (also usually put it's type to text with type="text")
What is placeholder text and how do you apply it?	placeholder text is what appears in a text input field to kind of explain what you want to be put in. <input type="text" placeholder ="catphotourlplz" >
How do you submit data to a server using nothing more than pure HTML?	put an action in a form element. ex: <form action="/url-where-you-want-to-submit-form-data"></form>
How do you make html require a field to have entered information in?	just add 'required' in the input tag ex: <input type="text" required > ( also requires a button but yeah
What is a radio button and how do you make one?	Radio buttons are a type of input. Usually multi choice field of buttons where you can only choose one. (they need a label tag and a name too) <label> <input type="radio" name="indoor-outdoor"> Indoor </label>
What are checkboxes and how do you add one?	Check boxes are a type of input. Usually multiple choice but you can pick and choose which ones you have checked. (need a label tag and name) <label><input type="checkbox" name="personality"> Loving</label>
How do you make a radio or checkbox button checked by default?	add checked into the element tag. ex: <input type="radio" name="test-name" checked>
What is padding?	controls the amount of space between the element and its border. (usually between text and the edge)
What is margin?	Margin is the space between an elements border and surrounding elements. (usually how far the border is from other things on the page)
How do you make an element bigger by modifying it's margin?	You make the margin a negative value. The element will grow because your decreasing the distance from the border to other elements.
How do you modify an elements padding or margin on all sides in one swoop?	starts like a clock. top right bottom left. ex: div { padding: 10px 15px 10px 15px ; }
What are block elements?	Elements that take up the entire width of the page, and they always start on a new line.
What are in-line elements?	Elements that sit next to other elements and don't start on a new line.
Does every HTML page contain a body element?	Yes. and you can add properties to it. Ex: body { background-color: blue; color: green; font-family: monospace; }
Will an assigned class override your body's element's CSS property?	Yes if the class properties conflict with the body's properties then the class properties will be in effect.
If an element has two assigned classes with the same properties assigned different values which one will take effect?	The second class that is listed in the styles CSS. (because cascading style sheet) Even if the second listed one is assigned first in your element.
What takes precedence over class properties?	ID's. If a class and id are assigned with conflicting values. The id values will override the class properties.
What takes precedence over id's?	In-line style. if the in-line style and assigned id have conflicting values. the in-line style will override the id. ex: <h1 style="color:green
What is the ultimate way to override any conflicting css properties?	use !important in the css property ex: pink-text { color: pink !important ; }
What are the two way to declare colors?	Using Hex Code and RGB ex: #000000 (black) ( 0 , 0 , 0 ) (black)

Next up

Description

Resource summary

Similar

	Created by Alexander Lynds over 7 years ago