0% found this document useful (0 votes)
27 views

HTML Css Notes 1

Uploaded by

ismailhansal3
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
27 views

HTML Css Notes 1

Uploaded by

ismailhansal3
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
You are on page 1/ 4

tag h1 : principal header

tag h2: second header


p: paragraph
div : divisions(to regroup lot of tags into blocs)

how to link html with css :


-create a new file inside the folder called style.css
-go to head tag and add <link rel="stylesheet" href="style.css"> (rel:relation,
href:hyper reference(the path))

how to style tags into css :


-for example : p{color : red;}

if i wanna target a specific tag (to give id):


-i can use the attribute class
for example : <h2 class="title"> bonjour </h2>
-but in css i have to add a poinctuation :
for example : .title

Difference btwn IDs and classes : id is unique, it should be one per element BUT
classes can be used for a a lot of elements
- it works trough attribute : <p id="something">

TEXT CSS :
color :#2F2570;
font-family: Georgia, 'Times New Roman', Times, serif;
font-style: italic;
font-size: 22px;
text-align: left;
text-decoration: wavy;
text-indent: 30px;
text-transform:uppercase;
word-spacing: 10px;
line-heigh:50px;(space betwn texts)
margin : 50px (to do space)

++++++++++++++++++
I can create a new window just by creating a new folder in html. calling it
contact.html for example
I can link it by just using the anchor <a href="contact.info"> click</a>
i can use it also for linking to a web site <a href="https://www.youtube.com/watch?
v=3SNUxn1Cn1o"> visit my channel</a>
but this will open it on the same window, so to open it from a different window
what i can do is to add an attribute :
target

I can go straight to something in the page like a link for examlpe, for that i have
to specifie an id for that tag, then on the
top i can use another <a href="#id of the thing i wanna go straight for it">
-how to reset stylesheet : (always on the bottom of the css page !)

+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
+

html, body, div, span, object, iframe,


h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
margin:0;
padding:0;
border:0;
outline:0;
font-size:100%;
vertical-align:baseline;
background:transparent;
}

body {
line-height:1;
}

article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {
display:block;
}

nav ul {
list-style:none;
}
blockquote, q {
quotes:none;
}

blockquote:before, blockquote:after,
q:before, q:after {
content:'';
content:none;
}

a {
margin:0;
padding:0;
font-size:100%;
vertical-align:baseline;
background:transparent;
}

/* change colours to suit your needs */


ins {
background-color:#ff9;
color:#000;
text-decoration:none;
}

/* change colours to suit your needs */


mark {
background-color:#ff9;
color:#000;
font-style:italic;
font-weight:bold;
}

del {
text-decoration: line-through;
}

abbr[title], dfn[title] {
border-bottom:1px dotted;
cursor:help;
}

table {
border-collapse:collapse;
border-spacing:0;
}

/* change border colour to suit your needs */


hr {
display:block;
height:1px;
border:0;
border-top:1px solid #cccccc;
margin:1em 0;
padding:0;
}

input, select {
vertical-align:middle;
}
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
++++++++++++++++++++++

You might also like