سلام شما برای شروع کار با برنامه نویسی تحت وب به چند چیز احتیاج دارید.
1:شما به یک ویرایشگر متن احتیاج دارید که کد های خود را در ان بنویسید که معمولا از (نوت پد) استفاده میشود.
2:شما به یک مرورگر وب احتیاج دارید که پس از سیو کردن کد خود بتوانید اعمال ان را ببینید توصیه می شود از (فایر فوکس) استفاده کنید.
3:حالا که چیز های مورد نیاز خود را فهمیده اید میتوانید از کد های همین وبلاگ برای ساختن وب خود به راحتی استفاده کنید.
<html>
<head>
<style>
ul#menu {
padding: 0;
}
ul#menu li {
display: inline;
}
ul#menu li a {
background-color: black;
color: white;
padding: 10px 20px;
text-decoration: none;
border-radius: 4px 4px 0 0;
}
ul#menu li a:hover {
background-color: orange;
}
</style>
</head>
<body>
<h2>Horizontal List</h2>
<ul id="menu">
<li><a href="/html/default.asp">HTML</a></li>
<li><a href="/css/default.asp">CSS</a></li>
<li><a href="/js/default.asp">JavaScript</a></li>
<li><a href="/php/default.asp">PHP</a></li>
</ul>
</body>
</html>
<html>
<body>
<button type="button"
onclick="document.getElementById('demo').innerHTML = Date()">
برای نمایش تاریخ و زمان کلیک کنید.</button>
<p id="demo"></p>
</body>
</html>
<html>
<body>
<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML = "متن مورد نظر شما";
</script>
</body>
</html>
<html>
<head>
<style>
body {
background-color: #d0e4fe;
}
h1 {
color: orange;
text-align: center;
}
p {
font-family: "tahoma";
font-size: اندازه خط به عددpx;
}
</style>
</head>
<body>
<h1>welcome</h1>
<p>This is a paragraph.</p>
</body>
</html>
<html>
<body>
<button onclick="myFunction()">Try it</button>
<p id="demo"></p>
<script>
function myFunction() {
document.getElementById("demo").innerHTML = Math.random();
}
</script>
</body>
</html>
<html>
<body>
<h2 style="color:red">I am Red</h2>
<h2 style="color:blue">I am Blue</h2>
</body>
</html>
<html>
<head>
<style>
p {
background-color: yellow;
}
p.ex {
margin-top: 200px;
margin-bottom: 200px;
margin-right: 100px;
margin-left: 50px;
}
</style>
</head>
<body>
<p>This is a paragraph with no specified margins.</p>
<p class="ex">This is a paragraph with specified margins.</p>
</body>
</html>
<html>
<head>
<style>
div {
width: 100px;
height: 100px;
background: red;
position: relative;
-webkit-animation: mymove 5s infinite; /* Chrome, Safari, Opera */
-webkit-animation-delay: 2s; /* Chrome, Safari, Opera */
animation: mymove 5s infinite;
animation-delay: 2s;
}
/* Chrome, Safari, Opera */
@-webkit-keyframes mymove {
from {left: 0px;}
to {left: 200px;}
}
@keyframes mymove {
from {left: 0px;}
to {left: 200px;}
}
</style>
</head>
<body>
<div></div>
</body>
</html>
<html>
<body>
<h2>list</h2>
<ul>
<li>مهدی</li>
<li>حسین</li>
<li>سعید</li>
</ul>
</body>
</html>
