New User Special Price Expires in

Let's log you in.

Sign in with Facebook


Don't have a StudySoup account? Create one here!


Create a StudySoup account

Be part of our community, it's free to join!

Sign up with Facebook


Create your account
By creating an account you agree to StudySoup's terms and conditions and privacy policy

Already have a StudySoup account? Login here

Network Media 1

by: Jennyfer Skiles

Network Media 1 DESMA 161A

Jennyfer Skiles
GPA 3.86

C. McWilliams

Almost Ready


These notes were just uploaded, and will be ready to view shortly.

Purchase these notes here, or revisit this page.

Either way, we'll remind you when they're ready :)

Preview These Notes for FREE

Get a free preview of these Notes, just enter your email below.

Unlock Preview
Unlock Preview

Preview these materials now for free

Why put in your email? Get access to more of this material and other relevant free materials for your school

View Preview

About this Document

C. McWilliams
Class Notes
25 ?




Popular in Course

Popular in Design Media Arts

This 27 page Class Notes was uploaded by Jennyfer Skiles on Friday September 4, 2015. The Class Notes belongs to DESMA 161A at University of California - Los Angeles taught by C. McWilliams in Fall. Since its upload, it has received 85 views. For similar materials see /class/177916/desma-161a-university-of-california-los-angeles in Design Media Arts at University of California - Los Angeles.


Reviews for Network Media 1


Report this Material


What is Karma?


Karma is the currency of StudySoup.

You can buy or earn more Karma at anytime and redeem it for class notes, study guides, flashcards, and more!

Date Created: 09/04/15
CSS Chandler McWilliams 161A Adding CSS to a Document lnline style on a tag lth1 stylequotcolor redquotgtRed Herringlth1gt Documentwide embedded styles ltheadgt ltstyle typequottextcssquotgt lt hl color red fontsize 36pt gt ltsty1egt ltheadgt Linking to external CSS files ltheadgt ltlink re1quotsty1esheetquot hrefquot1ayoutcssquot typequottestcssquotgt ltheadgt First Example lthtmlgt ltheadgt lttitlegtCSS Examplelttitlegt ltstyle typequottextcssquotgt hl fontsize 32pt fontfamily HelveticaArial color gray margin 30px p fontstyle italic lineheight 17 width 400px ltstylegt ltheadgt ltbodygt lth1gtNew and improved markup using CSS Styleslth1gt ltpgtCSS provides a powerful set of properties for manipulating the look of HTML elementsltpgt ltbodygt lthtmlgt Styling a Tag Styles can be applied to HTML elements by tag Notice that the tag name doesnothavetheltgt hl color blue I0 fontfamily sansserif fontsize 10pt body backgroundcolorFFFFCC marginleft100px Anatomy of a CSS Rule Styles are made up of rules Rules begin with thing you want to select called the selector followed by a opening brace Next you specify one or more properties you want to style and the value for each property followed by a semi colon Finally the rule is closed by adding a closing brace I0 fontfamily Arial sansserif lineheight 16em backgroundcolor red How Selectors Work It sometimes helps to imagine your document visually to understand how a CSS rule will be applied html How Selectors Work hl fontfamily sansserif html How Selectors Work p fontfamily sansserif html How Selectors Work a fontfamily sansserif html How Selectors Work h2 em fontfamily sansserif html Classes Classes are a way to selectively apply rules to only certain elements in a document You define a class just as you would any other CSS rule but the selector begins with a dot followed by the name of the class attention backgroundcolor red color white fontweight bold fontsize 20px You then apply the class to an element by adding the class attribute to its tag ltp classquotattentionquotgtPlease pay attention p1easeltpgt IDs IDs also allow you to selectively apply rules to only certain elements in a document However there should only be one element with a given ID on a page IDs are intended to be a unique marker for an element You define an ID just as you would any other CSS rule but the selector begins with a hash followed by the name of the ID callout backgroundcolor green color white fontfamily Georgia Serif You then apply the ID to an element by adding the ID attribute to its tag ltp idquotcalloutquotgt0uoth the Raven quotNevermore ltpgt Inheritance Elements can inherit the properties oftheir parent elements For example links ltagt tags inside a paragraph will inherit the fontfamily of the paragraph that contains them unless they are specifically told to use anotherfont Inheritance makes it easy to set certain properties once and have them affect the entire document Not all properties are inherited most noticeably the underline text decoration and color of links are not inherited from their parents by default Inheritance p fontfamily sansserif html Inheritance body fontfamily sansserif html Some Type Properties fontfamily fontstyle fontweight fontsize font wordspacing letterspacing textdecoration texttransform textalign textindent color p fontfamily Verdanasansserif hl fontstyle italic h2 fontweight bold p fontsize 13px hl font 12pt Times serif h3 wordspacing 3px subhead letterspacing 2pt a1ink textdecoration underline hl texttransform uppercase p textalign justify p textindent 10px caption color 6644EE PseudoClasses Pseudoclasses are defined by a selector followed by a colon then the pseduoclass s name They can add interactive effects to links such as changing the color when the user rolls over the link link color FFGOOO textdecoration none visited color OGFFOO textdecoration none hover color FFOOFF textdecoration underline active color OOOOFF textdecoration none QJQJQJQ When defining the link pseudoclasses the order is important they must appear as link visited hover active One way to remember the order is LoVeHAte Color There are three ways to define a color in CSS Color names hex values and rgb values CSS provides 16 named colors aqua black blue fuchsia gray green lime maroon navy olive purple red silver teal white and yellow Hex colors are specified using the hash and a hex code p color ff6600 RGB colors are defined using rgb Values can be a percentage or a number between 0 and 255 hl backgroundcolor rgb100 40 0 p color rgb255 102 0 Measurements pt point absoluteTypographical unit 1 point equals 172 inches pc pica absoluteTypographical unit 1 pica is equivalent to 12 point in inch absolute 1 inch is equivalent to 254 centimeters mm millimeters absolute cm centimeters absolute px pixel absoluterelative Depends on the output device em em relative 1 em in a 24pt size type is 24pt ex ex relative Refers to height ofthe small character x percent relative Can be relative to the size ofthe element itself to the size ofthe parent element etc Font Size Keywords Fonts can also be specified using keywords There are 7 size keywords in CSS each is about 20 larger than the last xxsmall xsmall small normally about 12px medium large xlarge xxlarge Block vs Inline Elements XHTML is primarily made up of 2 types of elements block and inline Block elements are always displayed as ifthey have a linebreak before and after Some block elements are ltpgt lth2gt ltdivgt Inline elements appear in the flow of your text like ltagt ltimggt and ltspangt Block elements can also have a width and height set using CSS Box Model Visible Area Width Height Border Padding Margin Box Properties margin margintop bottom left right border bordertop bottom 1eft right borderstyle borderwidth bordercolor padding paddingtop bottom 1eft right width height background backgroundcolor backgroundimage backgroundrepeat Box Properties Borders margins and padding can be specified by explicitly naming the property p margintop 10px Or by using the shorthand format and specifying all values at once p margin 10px will set all margins to 10px p margin 5px 0px 10px 2px this would set the top to 5px right to 0px bottom to 10px left to 2px When using the shorthand syntax the sizes are set starting at the top and moving clockwise You can remember they are TRouBLEd top right bottom left Background Images You can add images to the background of elements or the entire document by using the backgroundimage property body backgroundimage urlpatternjpg By default the image is tiled it the element is larger than the imageYou can modify the image tiling by using backgroundrepeat body backgroundrepeat repeatx only tile horizontally body backgroundrepeat repeaty only tile vertically body backgroundrepeat norepeat no tiling Also you can place the image in its element using either absolute or relative positions div backgroundposition top left div backgroundposition 50 50 div backgroundposition 50px 150px Position and Display CSS can control where an element appears onscreen and ifthe element is displayed at all position absolute relative fixed contrpls hOW an element is pOSItIoned onscreen top any measu rement value the position of the element either left relative to its container or the 39 document depending on the value of bottom position right display inline block none how an element should be drawn on screen 39 floated elements are drawn with a box like float 39 left rlght none block elements but allow inline and other floated elements to flow around them Visibility Visible hidden Ifan element is drawn or not its box will still be visible clip rect5px 10px 10px 5px Crllips an element s content to the s ape overflow visible hidden scroll clips contents to the element s box auto scroll Will show a scrollbar z index number sets the stacking orderelements with higher numbers are always in front Using CSS for Different Media You can create different stylesheets for different contexts When viewed in the web browser the user will see the screen stylesheet If a print stylesheet is provided that style will be used automatically when the page is pnnted lthtmlgt ltheadgt lt1ink re1quotsty1esheetquot mediaquotscreenquot hrefquotwebsitecssquotgt ltlink re1quotstylesheetquot mediaquotprintquot hrefquotprintcssquotgt lt1ink re1quotsty1esheetquot mediaquotaura1quot hrefquotspeakercssquotgt ltlink re1quotstylesheetquot mediaquotbraillequot hrefquotbrai11ecssquotgt ltheadgt ltbodygtltbodygt lthtm1gt


Buy Material

Are you sure you want to buy this material for

25 Karma

Buy Material

BOOM! Enjoy Your Free Notes!

We've added these Notes to your profile, click here to view them now.


You're already Subscribed!

Looks like you've already subscribed to StudySoup, you won't need to purchase another subscription to get this material. To access this material simply click 'View Full Document'

Why people love StudySoup

Jim McGreen Ohio University

"Knowing I can count on the Elite Notetaker in my class allows me to focus on what the professor is saying instead of just scribbling notes the whole time and falling behind."

Amaris Trozzo George Washington University

"I made $350 in just two days after posting my first study guide."

Steve Martinelli UC Los Angeles

"There's no way I would have passed my Organic Chemistry class this semester without the notes and study guides I got from StudySoup."


"Their 'Elite Notetakers' are making over $1,200/month in sales by creating high quality content that helps their classmates in a time of need."

Become an Elite Notetaker and start selling your notes online!

Refund Policy


All subscriptions to StudySoup are paid in full at the time of subscribing. To change your credit card information or to cancel your subscription, go to "Edit Settings". All credit card information will be available there. If you should decide to cancel your subscription, it will continue to be valid until the next payment period, as all payments for the current period were made in advance. For special circumstances, please email


StudySoup has more than 1 million course-specific study resources to help students study smarter. If you’re having trouble finding what you’re looking for, our customer support team can help you find what you need! Feel free to contact them here:

Recurring Subscriptions: If you have canceled your recurring subscription on the day of renewal and have not downloaded any documents, you may request a refund by submitting an email to

Satisfaction Guarantee: If you’re not satisfied with your subscription, you can contact us for further help. Contact must be made within 3 business days of your subscription purchase and your refund request will be subject for review.

Please Note: Refunds can never be provided more than 30 days after the initial purchase date regardless of your activity on the site.