Submit Search
Upload
CSS - Style your site
•
3 likes
•
1,369 views
Ramses Cabello
Follow
Brief keynote explaining CSS use and syntax.
Read less
Read more
Design
Technology
Education
Report
Share
Report
Share
1 of 34
Download now
Download to read offline
Recommended
Lebua foods of thailand-revisedv4
Lebua foods of thailand-revisedv4
lebua Hotels & Resorts
P1
P1
Heytor de Souza
Design Thinking - Overview - 05 August 2014
Design Thinking - Overview - 05 August 2014
Ian H Smith
3Com 655-0246-01
3Com 655-0246-01
savomir
Scotland
Scotland
Paulo Vaz Pato
Seis cosas que quizás no sabías de Halloween
Seis cosas que quizás no sabías de Halloween
JPEDRAZA12
United liberation movement for west papua
United liberation movement for west papua
Isco Alarcon
Doubling your sales teams productivity and active selling time
Doubling your sales teams productivity and active selling time
Heinz Marketing Inc
Recommended
Lebua foods of thailand-revisedv4
Lebua foods of thailand-revisedv4
lebua Hotels & Resorts
P1
P1
Heytor de Souza
Design Thinking - Overview - 05 August 2014
Design Thinking - Overview - 05 August 2014
Ian H Smith
3Com 655-0246-01
3Com 655-0246-01
savomir
Scotland
Scotland
Paulo Vaz Pato
Seis cosas que quizás no sabías de Halloween
Seis cosas que quizás no sabías de Halloween
JPEDRAZA12
United liberation movement for west papua
United liberation movement for west papua
Isco Alarcon
Doubling your sales teams productivity and active selling time
Doubling your sales teams productivity and active selling time
Heinz Marketing Inc
Social Media: Strategies That Fell Short
Social Media: Strategies That Fell Short
Barbara Nixon
How to reduce professional liability associated with patient portals
How to reduce professional liability associated with patient portals
mosmedicalreview
Social Media Strategies (July 2011) at Seattle's School of Visual Concepts
Social Media Strategies (July 2011) at Seattle's School of Visual Concepts
social3i
INTRODUCCIÓN A LA COMPUTACIÓN
INTRODUCCIÓN A LA COMPUTACIÓN
Octavio Arias
Sample
Sample
Nishant 12 Rayan
Taller4 diagnóstico de necesidades y borrador del adiestramiento (1)
Taller4 diagnóstico de necesidades y borrador del adiestramiento (1)
Isamalia Muniz
Audiens Shop
Audiens Shop
Audiens Shop
APP101_HARDY_week3_assignment
APP101_HARDY_week3_assignment
Natasha Hardy
Análisis de la pedagogía invertida como tendencia de aprendizaje
Análisis de la pedagogía invertida como tendencia de aprendizaje
Rojas Uni Yenny
NIRC_ICSI
NIRC_ICSI
New Corporate Laws Treatise(NCLT)
Konsep asuhan keperawatan Leukemia
Konsep asuhan keperawatan Leukemia
Verar Oka
FORCH. EL MODELO PARA EL CAMBIO AVANZADO
FORCH. EL MODELO PARA EL CAMBIO AVANZADO
Dr.Jose A Santos. +4500 contactos
Ict 8 css
Ict 8 css
Christian Reglos
OOP CSS Presenation
OOP CSS Presenation
RobotDeathSquad
Introduction to HTML
Introduction to HTML
Abzetdin Adamov
CSS: How To Learn Easily
CSS: How To Learn Easily
shabab shihan
Intro to HTML and CSS - Class 2 Slides
Intro to HTML and CSS - Class 2 Slides
Heather Rock
Hardcore CSS
Hardcore CSS
PDX Web & Design
Cascading Style Sheet
Cascading Style Sheet
Meenakshi Paul
css1.ppt
css1.ppt
BalasundaramSr
waxaada canshuurahaiyosiyaaddaguudeexamarwaaardaydaDAALBADAN.ppt
waxaada canshuurahaiyosiyaaddaguudeexamarwaaardaydaDAALBADAN.ppt
Ismaciil2
Css Introduction
Css Introduction
SathyaseelanK1
More Related Content
Viewers also liked
Social Media: Strategies That Fell Short
Social Media: Strategies That Fell Short
Barbara Nixon
How to reduce professional liability associated with patient portals
How to reduce professional liability associated with patient portals
mosmedicalreview
Social Media Strategies (July 2011) at Seattle's School of Visual Concepts
Social Media Strategies (July 2011) at Seattle's School of Visual Concepts
social3i
INTRODUCCIÓN A LA COMPUTACIÓN
INTRODUCCIÓN A LA COMPUTACIÓN
Octavio Arias
Sample
Sample
Nishant 12 Rayan
Taller4 diagnóstico de necesidades y borrador del adiestramiento (1)
Taller4 diagnóstico de necesidades y borrador del adiestramiento (1)
Isamalia Muniz
Audiens Shop
Audiens Shop
Audiens Shop
APP101_HARDY_week3_assignment
APP101_HARDY_week3_assignment
Natasha Hardy
Análisis de la pedagogía invertida como tendencia de aprendizaje
Análisis de la pedagogía invertida como tendencia de aprendizaje
Rojas Uni Yenny
NIRC_ICSI
NIRC_ICSI
New Corporate Laws Treatise(NCLT)
Konsep asuhan keperawatan Leukemia
Konsep asuhan keperawatan Leukemia
Verar Oka
FORCH. EL MODELO PARA EL CAMBIO AVANZADO
FORCH. EL MODELO PARA EL CAMBIO AVANZADO
Dr.Jose A Santos. +4500 contactos
Viewers also liked
(12)
Social Media: Strategies That Fell Short
Social Media: Strategies That Fell Short
How to reduce professional liability associated with patient portals
How to reduce professional liability associated with patient portals
Social Media Strategies (July 2011) at Seattle's School of Visual Concepts
Social Media Strategies (July 2011) at Seattle's School of Visual Concepts
INTRODUCCIÓN A LA COMPUTACIÓN
INTRODUCCIÓN A LA COMPUTACIÓN
Sample
Sample
Taller4 diagnóstico de necesidades y borrador del adiestramiento (1)
Taller4 diagnóstico de necesidades y borrador del adiestramiento (1)
Audiens Shop
Audiens Shop
APP101_HARDY_week3_assignment
APP101_HARDY_week3_assignment
Análisis de la pedagogía invertida como tendencia de aprendizaje
Análisis de la pedagogía invertida como tendencia de aprendizaje
NIRC_ICSI
NIRC_ICSI
Konsep asuhan keperawatan Leukemia
Konsep asuhan keperawatan Leukemia
FORCH. EL MODELO PARA EL CAMBIO AVANZADO
FORCH. EL MODELO PARA EL CAMBIO AVANZADO
Similar to CSS - Style your site
Ict 8 css
Ict 8 css
Christian Reglos
OOP CSS Presenation
OOP CSS Presenation
RobotDeathSquad
Introduction to HTML
Introduction to HTML
Abzetdin Adamov
CSS: How To Learn Easily
CSS: How To Learn Easily
shabab shihan
Intro to HTML and CSS - Class 2 Slides
Intro to HTML and CSS - Class 2 Slides
Heather Rock
Hardcore CSS
Hardcore CSS
PDX Web & Design
Cascading Style Sheet
Cascading Style Sheet
Meenakshi Paul
css1.ppt
css1.ppt
BalasundaramSr
waxaada canshuurahaiyosiyaaddaguudeexamarwaaardaydaDAALBADAN.ppt
waxaada canshuurahaiyosiyaaddaguudeexamarwaaardaydaDAALBADAN.ppt
Ismaciil2
Css Introduction
Css Introduction
SathyaseelanK1
Session 3
Session 3
Lại Đức Chung
Concept of CSS part 2
Concept of CSS part 2
SURBHI SAROHA
Unit 2-CSS & Bootstrap.ppt
Unit 2-CSS & Bootstrap.ppt
TusharTikia
CSS
CSS
People Strategists
Web Typography
Web Typography
Shawn Calvert
Journey To The Front End World - Part2 - The Cosmetic
Journey To The Front End World - Part2 - The Cosmetic
Irfan Maulana
CSS-part-1.ppt
CSS-part-1.ppt
AshwaniKumarYadav19
Web topic 15 1 basic css layout
Web topic 15 1 basic css layout
CK Yang
Intro to css
Intro to css
Rajashekarkorva
css-handbook
css-handbook
RaviKumar76265
Similar to CSS - Style your site
(20)
Ict 8 css
Ict 8 css
OOP CSS Presenation
OOP CSS Presenation
Introduction to HTML
Introduction to HTML
CSS: How To Learn Easily
CSS: How To Learn Easily
Intro to HTML and CSS - Class 2 Slides
Intro to HTML and CSS - Class 2 Slides
Hardcore CSS
Hardcore CSS
Cascading Style Sheet
Cascading Style Sheet
css1.ppt
css1.ppt
waxaada canshuurahaiyosiyaaddaguudeexamarwaaardaydaDAALBADAN.ppt
waxaada canshuurahaiyosiyaaddaguudeexamarwaaardaydaDAALBADAN.ppt
Css Introduction
Css Introduction
Session 3
Session 3
Concept of CSS part 2
Concept of CSS part 2
Unit 2-CSS & Bootstrap.ppt
Unit 2-CSS & Bootstrap.ppt
CSS
CSS
Web Typography
Web Typography
Journey To The Front End World - Part2 - The Cosmetic
Journey To The Front End World - Part2 - The Cosmetic
CSS-part-1.ppt
CSS-part-1.ppt
Web topic 15 1 basic css layout
Web topic 15 1 basic css layout
Intro to css
Intro to css
css-handbook
css-handbook
More from Ramses Cabello
Accessibility First
Accessibility First
Ramses Cabello
Adobe Illustrator – Minimal introduction
Adobe Illustrator – Minimal introduction
Ramses Cabello
Till Altmann - Industrial Designer in Unisto (Switzerland)
Till Altmann - Industrial Designer in Unisto (Switzerland)
Ramses Cabello
HTML+CSS Resources
HTML+CSS Resources
Ramses Cabello
Meet the grids - Web design using Grids
Meet the grids - Web design using Grids
Ramses Cabello
Introduction to HTML5+CSS
Introduction to HTML5+CSS
Ramses Cabello
More from Ramses Cabello
(6)
Accessibility First
Accessibility First
Adobe Illustrator – Minimal introduction
Adobe Illustrator – Minimal introduction
Till Altmann - Industrial Designer in Unisto (Switzerland)
Till Altmann - Industrial Designer in Unisto (Switzerland)
HTML+CSS Resources
HTML+CSS Resources
Meet the grids - Web design using Grids
Meet the grids - Web design using Grids
Introduction to HTML5+CSS
Introduction to HTML5+CSS
Recently uploaded
Dubai Calls Girl Tapes O525547819 Real Tapes Escort Services Dubai
Dubai Calls Girl Tapes O525547819 Real Tapes Escort Services Dubai
kojalkojal131
cda.pptx critical discourse analysis ppt
cda.pptx critical discourse analysis ppt
MaryamAfzal41
DAKSHIN BIHAR GRAMIN BANK: REDEFINING THE DIGITAL BANKING EXPERIENCE WITH A U...
DAKSHIN BIHAR GRAMIN BANK: REDEFINING THE DIGITAL BANKING EXPERIENCE WITH A U...
Rishabh Aryan
2024新版美国旧金山州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree
2024新版美国旧金山州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree
yuu sss
专业一比一美国亚利桑那大学毕业证成绩单pdf电子版制作修改#真实工艺展示#真实防伪#diploma#degree
专业一比一美国亚利桑那大学毕业证成绩单pdf电子版制作修改#真实工艺展示#真实防伪#diploma#degree
yuu sss
How to Empower the future of UX Design with Gen AI
How to Empower the future of UX Design with Gen AI
yuj
Call Girls in Ashok Nagar Delhi ✡️9711147426✡️ Escorts Service
Call Girls in Ashok Nagar Delhi ✡️9711147426✡️ Escorts Service
jennyeacort
Unveiling the Future: Columbus, Ohio Condominiums Through the Lens of 3D Arch...
Unveiling the Future: Columbus, Ohio Condominiums Through the Lens of 3D Arch...
Yantram Animation Studio Corporation
Design principles on typography in design
Design principles on typography in design
nooreen17
Create Web Pages by programming of your chice.pdf
Create Web Pages by programming of your chice.pdf
workingdev2003
1比1办理美国北卡罗莱纳州立大学毕业证成绩单pdf电子版制作修改
1比1办理美国北卡罗莱纳州立大学毕业证成绩单pdf电子版制作修改
yuu sss
在线办理ohio毕业证俄亥俄大学毕业证成绩单留信学历认证
在线办理ohio毕业证俄亥俄大学毕业证成绩单留信学历认证
nhjeo1gg
Apresentação Clamo Cristo -letra música Matheus Rizzo
Apresentação Clamo Cristo -letra música Matheus Rizzo
CarolTelles6
办理(UC毕业证书)查尔斯顿大学毕业证成绩单原版一比一
办理(UC毕业证书)查尔斯顿大学毕业证成绩单原版一比一
z xss
澳洲UQ学位证,昆士兰大学毕业证书1:1制作
澳洲UQ学位证,昆士兰大学毕业证书1:1制作
aecnsnzk
MT. Marseille an Archipelago. Strategies for Integrating Residential Communit...
MT. Marseille an Archipelago. Strategies for Integrating Residential Communit...
katerynaivanenko1
办理卡尔顿大学毕业证成绩单|购买加拿大文凭证书
办理卡尔顿大学毕业证成绩单|购买加拿大文凭证书
zdzoqco
Iconic Global Solution - web design, Digital Marketing services
Iconic Global Solution - web design, Digital Marketing services
Iconic global solution
Pearl Disrtrict urban analyusis study pptx
Pearl Disrtrict urban analyusis study pptx
DanielTamiru4
(办理学位证)埃迪斯科文大学毕业证成绩单原版一比一
(办理学位证)埃迪斯科文大学毕业证成绩单原版一比一
Fi sss
Recently uploaded
(20)
Dubai Calls Girl Tapes O525547819 Real Tapes Escort Services Dubai
Dubai Calls Girl Tapes O525547819 Real Tapes Escort Services Dubai
cda.pptx critical discourse analysis ppt
cda.pptx critical discourse analysis ppt
DAKSHIN BIHAR GRAMIN BANK: REDEFINING THE DIGITAL BANKING EXPERIENCE WITH A U...
DAKSHIN BIHAR GRAMIN BANK: REDEFINING THE DIGITAL BANKING EXPERIENCE WITH A U...
2024新版美国旧金山州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree
2024新版美国旧金山州立大学毕业证成绩单pdf电子版制作修改#毕业文凭制作#回国入职#diploma#degree
专业一比一美国亚利桑那大学毕业证成绩单pdf电子版制作修改#真实工艺展示#真实防伪#diploma#degree
专业一比一美国亚利桑那大学毕业证成绩单pdf电子版制作修改#真实工艺展示#真实防伪#diploma#degree
How to Empower the future of UX Design with Gen AI
How to Empower the future of UX Design with Gen AI
Call Girls in Ashok Nagar Delhi ✡️9711147426✡️ Escorts Service
Call Girls in Ashok Nagar Delhi ✡️9711147426✡️ Escorts Service
Unveiling the Future: Columbus, Ohio Condominiums Through the Lens of 3D Arch...
Unveiling the Future: Columbus, Ohio Condominiums Through the Lens of 3D Arch...
Design principles on typography in design
Design principles on typography in design
Create Web Pages by programming of your chice.pdf
Create Web Pages by programming of your chice.pdf
1比1办理美国北卡罗莱纳州立大学毕业证成绩单pdf电子版制作修改
1比1办理美国北卡罗莱纳州立大学毕业证成绩单pdf电子版制作修改
在线办理ohio毕业证俄亥俄大学毕业证成绩单留信学历认证
在线办理ohio毕业证俄亥俄大学毕业证成绩单留信学历认证
Apresentação Clamo Cristo -letra música Matheus Rizzo
Apresentação Clamo Cristo -letra música Matheus Rizzo
办理(UC毕业证书)查尔斯顿大学毕业证成绩单原版一比一
办理(UC毕业证书)查尔斯顿大学毕业证成绩单原版一比一
澳洲UQ学位证,昆士兰大学毕业证书1:1制作
澳洲UQ学位证,昆士兰大学毕业证书1:1制作
MT. Marseille an Archipelago. Strategies for Integrating Residential Communit...
MT. Marseille an Archipelago. Strategies for Integrating Residential Communit...
办理卡尔顿大学毕业证成绩单|购买加拿大文凭证书
办理卡尔顿大学毕业证成绩单|购买加拿大文凭证书
Iconic Global Solution - web design, Digital Marketing services
Iconic Global Solution - web design, Digital Marketing services
Pearl Disrtrict urban analyusis study pptx
Pearl Disrtrict urban analyusis study pptx
(办理学位证)埃迪斯科文大学毕业证成绩单原版一比一
(办理学位证)埃迪斯科文大学毕业证成绩单原版一比一
CSS - Style your site
1.
CSS Styling your site ramses.cabello@gmail.com
@ramsescabello
2.
CSS helps HTML
looking a lot more beautiful.
3.
each element in
the HTML body has a reference. CSS uses that reference to give attributes to it.
4.
give everything a
name. and THINK carefully about it.
5.
there’s 3 main
kind of references. elements (body, ...)
6.
there’s 3 main
kind of references. elements (body, ...) classes (p, div, ul ...)
7.
there’s 3 main
kind of references. elements bodyv classes .name identity #name
8.
let’s see an
example.
9.
class=”black” .black .black .black
10.
class=”black” id=”roundcorners” .black .black #roundcorners .black
11.
let’s see an
example.
12.
we have a
box called: example
13.
example is 650px
wide
14.
example is 325px
tall
15.
example is black
16.
example is at
the bottom
17.
example has no
border
18.
example has rounded corners
of 50px
19.
example is not
visible.
20.
CSS gives visual
attributes. background color border position font-face shadow gradient width
21.
CSS gives visual
attributes. CSS declares behaviours.
22.
CSS gives visual
attributes. CSS declares behaviours.
23.
CSS gives visual
attributes. CSS declares behaviours.
24.
summing up CSS gives
style. CSS calls elements from the body you decide the name of the elements element > classes > id Feel free to play with the CSS.
25.
css syntax reference { attribute:
value; }
26.
css syntax body { background-color:
#000000; }
27.
css syntax .cita { background-color:
#FFFFFF; color: #000000; border-left: 3px solid #555555; } <p class=”cita”> “Keep it simple” - Anonymous </p>
28.
css syntax “Keep it
simple” - Anonymous
29.
css syntax #nueva { background-color:
#29ABE2; border-left: #2E3192; } <p class=”cita” id=”nueva”> “Keep it simple” - Anonymous </p>
30.
“Keep it simple”
- Anonymous css syntax
31.
online resources http://css3generator.com/
32.
online resources http://www.w3schools.com/css/
33.
online resources http://realworldcss3.com/resources/
34.
#ProdGrafULPGC
Download now