Skilled Gaming
Design/Web/Programming/IT => HTML => Developing => Tutoriale/Tutorials => Topic started by: ReePs on 19 July 2014, 18:28:16
-
Umm , prima oara , proiectul e doar orientativ , prefer sa nu folositi coding-ul meu pentru web site-urile voastre deoarece este sub copyright-ul meu si sunt capabil sa va plimb prin tribunale :)) ( glumesc , sau nu. )
In primul rand pentru partea HTML :
<!DOCTYPE html>
<html>
<head>
<link rel='stylesheet' href='style.css'/>
<script type="text/javascript" src="script.js"></script>
</head>
<body style="background-image:url(http://www.dentons.com/~/media/Images/Background%20Images/Offices/New%20York/new_york_opt_02.jpg)">
<div id="box1"><h1 id="Home"><a href="www.google.com">Home</h1><h1 id="Category"><a href="www.google.com">Category</h1><h1 id="Contact"><a href="www.google.com">Contact</h1><h1 id="About"><a href="www.google.com">About Us</h1> </div>
<hr noshade size=2>
<div id="box2"><a href="www.google.com
"><input class="submit-button" type="button" onclick="spam()" value="View Full Article"><iframe id="video1" width="420" height="315" src="//www.youtube.com/embed/8mkmUdUYgH0" frameborder="0" allowfullscreen></iframe>
</div>
<div id="box3"><a href="www.google.com
"><input class="submit-button" type="button" onclick="spam()" value="View Full Article"></div>
<div id="box4"><a href="www.google.com
"><input class="submit-button" type="button" onclick="spam()" value="View Full Article"></div>
<div id="box5"><a href="www.google.com
"><input class="submit-button" type="button" onclick="spam()" value="View Full Article"></div>
<div id="box6"><a href="www.google.com
"><input class="submit-button" type="button" onclick="spam()" value="View Full Article"></div>
<div id="box7"><script type="text/javascript" src="//code.jquery.com/jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="http://s3.amazonaws.com/codecademy-content/courses/hour-of-code/js/alphabet.js"></script>
<canvas id="myCanvas"></canvas>
<script type="text/javascript" src="http://s3.amazonaws.com/codecademy-content/courses/hour-of-code/js/bubbles.js"></script>
<script type="text/javascript" src="script.js"></script>
</div>
<div id="box8"> </div>
<div id="bbox"></div>
</body>
</html>
Acum la CSS :
#box1 {
width: 1200px;
height: 70px;
padding: 10px;
margin: 0px;
margin-top:10px;
b;
}
#Home {
margin-left:90;
}
h1 {font-size:50px;
font-family:"Comic Sans MS", cursive, sans-serif;
color:green;
display:inline;
margin-top:-7px;
width: 1280px;
height: 70px;
padding: 10px;
border: 2px solid transparent;
margin: 0px;
margin-top:10px;
}
#Category { margin-left:60px }
#Contact { margin-left:60px }
#About { margin-left:60px }
#box2 { width: 600px;
height: 400px;
padding: 10px;
border: 2px solid black;
margin-left: 50px;
margin-top:60px;
}
#box3 { width: 600px;
height: 300px;
padding: 10px;
border: 2px solid black;
margin-left: 50px;
margin-top:60px;
}
#box4 {width: 500px;
height: 200px;
padding: 10px;
border: 2px solid black;
margin-left: 720px;
margin-top:-800;
}
#box5 { width: 500px;
height: 200px;
padding: 10px;
border: 2px solid black;
margin-left: 720px;
margin-top:50;
}
#box6 {width: 500px;
height: 200px;
padding: 10px;
border: 2px solid black;
margin-left: 720px;
margin-top:50;
}
#box7 { width: 170px;
height: 300px;
padding: 10px;
border: 2px solid transparent;
margin-left: 150px;
margin-top:-100px;
}
#box { width: 100px;
height: 1000px;
padding: 10px;
border: 1px solid black;
margin-left: 38px;
margin-top:-960px;
background-color:black;
opacity:0.8;
;}
#video1 { margin-top:-50px;
margin-left:180px;
border-radius:10px
}
a:link {
text-decoration: none;
color:black
}
a:visited {
text-decoration: none;
color:black
}
a:hover {
color:#60b6e8;
background-color: transparent;
}
a:active {
text-decoration: italic;
color:black
}
hr { color:black;
border-radius:90px;
}
.submit-button { height:50px;
width:170px;
font-family:"Comic Sans MS", cursive, sans-serif;
font-size:20px;
background-color:black;
opacity:0.3;
color:white;
display:block;
margin-left:0px;
border-radius:10px;
margin-top:10px;
}
#box8 { ;width: 1170px;
height: 70px;
padding: 10px;
border: 2px solid black;
margin-left:50px;
margin-top:60px;}
Si insfarsit , JavaScript :
var myName = "Kell Dope";
var red = [0, 100, 63];
var orange = [40, 100, 60];
var green = [75, 100, 40];
var blue = [196, 77, 55];
var purple = [280, 50, 60];
var letterColors = [red, orange, green, blue, purple];
drawName(myName, letterColors);
if(10 < 3)
{
bubbleShape = 'square';
}
else
{
bubbleShape = 'circle';
}
bounceBubbles()
( Webpage-ul nu este inca gata , inca nu am postat pagina deci probabil o sa fac mai multe update-uri pana sa imi deschid site-ul. )
Preview: http://www.codecademy.com/ReePs/codebits/kahcLX/edit ,
PS: Nu sunt expert , am 1 luna experienta in HTML , nu fiti asprii :D.
Pace.
-
Nu este rau pentru un incepator .
-
Imi place chestia aia cu "Kell Dope". :))
-
Felicitari :D. :-bd
-
Tribunale :-ss , :)) Gud jab
-
E foarte bine pentru un incepator , bravo :D
-
Multumesc Frumos :D
-
Bine lucrat,frumos tutorial!
-
E bun pentru un incepator ! bravo :D