89 Sayfalık HTML Kodları

devidoff

Katılımcı Üye
22 Ara 2006
458
14
Turquie
89 Sayfalık HTML Kodları


http://rapidshare.de/files/14003557/html_kodlar__89_sayfa.rar.html

89 Sayfalık HTML Kodları anlatımlı çok işinize yarayacak
 

Black_Knight

Katılımcı Üye
12 Eki 2006
444
2
çok bravo işime yaradı saol kardeş bravo tşk saol hack bir yıkım değil yapımdır arayıyordum
gerçekten saol kardeşşşiyiiii bulmuşsun
 

devidoff

Katılımcı Üye
22 Ara 2006
458
14
Turquie
Dosttum ben de tam bununla ilgileniyordum ama konuyu açalı uzun oldu biliyorsunuz rapidsharede hemen siliyor çok kalmıyor.Ve ben arşivlerimi farklı bilgisayarlar farklı serverlere yönlendiriyorum ve bu arşive ulaşmam zaman alır ben msjınızı hemen gördüğümü ve en kısa sürede düzeltilecegini gereken ihtiyacın yerine getireceğini belirtmek için yazdım
 

devidoff

Katılımcı Üye
22 Ara 2006
458
14
Turquie
Şimdilik Bunları Alın da :)

Diyalog Kutusu

<FORM>
<INPUT TYPE="button" VALUE="Lütfen Buraya Tıklayınız!!!"
onClick='alert("Sizin Siteniz
www.sitenizin ismi.com ")'>
<FORM>

Ziyaretçi Selamlama

<SCRIPT LANGUAGE="JavaScript">
<!--
function GetCookie(name) {
var arg=name+"=";
var alen=arg.length;
var clen=****************.length;
var i=0;
while (i<clen) {
var j=i+alen;
if
(****************.substring(i,j)==arg)
return "here";
i=****************.indexOf(" ",i)+1;
if (i==0) break;
}
return null;
}
var visit=GetCookie("shant");
if (visit==null){
alert("Hoşgeldiniz...");
var expire=new Date();
expire=new
Date(expire.getTime()+7776000000);
****************="shant=here; expires="+expire;
}
// -->
</SCRIPT>


-------------------------------------------------------------------------



Browser Bilgileri
<center>
<script language="Javascript">
<!--

***************("Kullanılan donanım : <b>"+navigator.appName+" "+navigator.appVersion+"</b>");
//-->
</script>
</center>

<center>
<script language="Javascript">
<!--

***************("www.turktechnic.com")

//-->
</script>
</center>


--------------------------------------------------------------------------

Yönlendirme

<SCRIPT LANGUAGE="JavaScript">

var shant="http://www.sitenizinismi.com"
***************('Lütfen bekleyiniz!!! Açılacak sayfa ' + shant)
function forPage()
{
********.href=shant
}
setTimeout ("forPage()", 1000);

</SCRIPT>

İsteğe Göre Arka Fon

<script language="JavaScript">
<!--

function backbs(clr) {
document.bgColor = clr
}

//-->
</script>
<form>
<input type="button" value="Aqua-turkuaz" onclick="backbs('aqua')">
<input type="button" value="Yellow-sarı" onclick="backbs('yellow')">
<input type="button" value="Khaki-haki" onclicke="backbs('khaki')">
<input type="button" value="White-beyaz" onclick="backbs('white')">
<input type="button" value="Gray-gri" onclick="backbs('gray')">
</form>





--------------------------------------------------------------------------

Sağ Tuş Kilidi


<script language="Javascript1.2">
<!--

var mymessage = "Üzgünüm Sağ Tuş Kullanmanız Engellenmiştir!!!";

function rtclickcheck(keyp){
if (navigator.appName == "Netscape" && keyp.which == 3) {
alert(mymessage);
return false;
}

if (navigator.appVersion.indexOf("MSIE") != -1 && event.button == 2) {
alert(mymessage);
return false;
}
}

document.onmousedown = rtclickcheck
//-->
</script>




-----------------------------------------------------------------------

Buton Şeklinde Saat


<SCRIPT LANGUAGE="JavaScript">

<!-- Begin
day = new Date();
miVisit = day.getTime();
function clock() {
dayTwo = new Date();
hrNow = dayTwo.getHours();
mnNow = dayTwo.getMinutes();
scNow = dayTwo.getSeconds();
miNow = dayTwo.getTime();
if (hrNow == 0) {
hour = 12;
ap = " AM";
} else if(hrNow <= 11) {
ap = " AM";
hour = hrNow;
} else if(hrNow == 12) {
ap = " PM";
hour = 12;
} else if (hrNow >= 13) {
hour = (hrNow - 12);
ap = " PM";
}
if (hrNow >= 13) {
hour = hrNow - 12;
}
if (mnNow <= 9) {
min = "0" + mnNow;
}
else (min = mnNow)
if (scNow <= 9) {
secs = "0" + scNow;
} else {
secs = scNow;
}
time = hour + ":" + min + ":" + secs + ap;
document.form.button.value = time;
self.status = time;
setTimeout('clock()', 1000);
}
function timeInfo() {
milliSince = miNow;
milliNow = miNow - miVisit;
secsVisit = Math.round(milliNow / 1000);
minsVisit = Math.round((milliNow / 1000) / 60);
alert("There have been " + milliSince + " milliseconds since midnight, January 1, 1970. "
+ "You have spent " + milliNow + " of those milliseconds on this page. "
+ ".... About " + minsVisit + " minutes, and "
+ secsVisit + " seconds.");
}
***************("<form name=\"form\">"
+ "<input type=button value=\"Click for info!\""
+ " name=button onClick=\"timeInfo()\"></form>");
onError = null;
clock();
// End -->
</SCRIPT>

Status Bar'da Değişen Yazılar



<script language="JavaScript">

<!--
// please keep these lines on when you copy the source
// made by: Nicolas -
http://www.javascript-page.com

var currentmsg = 0
var MsgTime = 2000
var MsgEndTime = 4000

function initArray(n) {
this.length = n;
for (var i =1; i <= n; i++) {
this = ' '
}
}

msg = new initArray(4)
msg[0]="1. msg ****llica Team ®"
msg[1]="2. msg ****llica Team ®"
msg[2]="3. msg ****llica Team ®"
msg[3]="4. msg Soru ve sorunlarınız için mail:
http://www.geocities.com/ResearchTriangle/1500[/URL]
***************("You have been to this page "+num_visits+" times.");//-->
</script>


--------------------------------------------------------------------------

Renk Değiştiren Yazı

<HTML>

<HEAD>
<TITLE>Insert Your Title</TITLE>
<**** name="Generator" content="Soft Lite ScriptWorx 3.0">
</HEAD>

<BODY topmargin="0" leftmargin="0" link="#0000FF" vlink="#800080" alink="#FF0000">

<!-- Type your text here //-->

<SCRIPT LANGUAGE="JavaScript">
<!--

//enter the message you wish to be shown, including html tags
var message='<b><font color=000000 size=5>www.sim-it.net</font></b>'

//enter a color name to be used as the background color of the message
var backgroundcolor="yellow"

//enter 0 for always display, 1 for a set period, 2 for random display mode
var displaymode=0

//if displaymode is set to display for a set period, enter the period below (1000=1 sec)
var displayduration=10000

//enter 0 for non-flashing message, 1 for flashing
var flashmode=1
//if above is set to flashing, enter the flash-to color below
var flashtocolor="lightgreen"

function regenerate(){
window.********.reload()
}

var which=0

function regenerate2(){
if (document.layers)
setTimeout("window.onresize=regenerate",400)
}


function display2(){
if (document.layers){
if (topmsg.visibility=="show")
topmsg.visibility="hide"
else
topmsg.visibility="show"
}
else if (document.all){
if (topmsg.style.visibility=="visible")
topmsg.style.visibility="hidden"
else
topmsg.style.visibility="visible"
setTimeout("display2()",Math.round(Math.random()*1 0000)+10000)
}
}

function flash(){
if (which==0){
if (document.layers)
topmsg.bgColor=flashtocolor
else
topmsg.style.backgroundColor=flashtocolor
which=1
}
else{
if (document.layers)
topmsg.bgColor=backgroundcolor
else
topmsg.style.backgroundColor=backgroundcolor
which=0
}
}


if (document.all){
***************('<span id="topmsg" style="position:absolute;visibility:hidden">'+mess age+'</span>')
}


function logoit(){
document.all.topmsg.style.left=document.body.scrol lLeft+document.body.clientWidth/2-document.all.topmsg.offsetWidth/2
document.all.topmsg.style.top=document.body.scroll Top+document.body.clientHeight-document.all.topmsg.offsetHeight-4
}


function logoit2(){
topmsg.left=pageXOffset+window.innerWidth/2-topmsg.document.width/2
topmsg.top=pageYOffset+window.innerHeight-topmsg.document.height-5
setTimeout("logoit2()",90)
}

function setmessage(){
document.all.topmsg.style.left=document.body.scrol lLeft+document.body.clientWidth/2-document.all.topmsg.offsetWidth/2
document.all.topmsg.style.top=document.body.scroll Top+document.body.clientHeight-document.all.topmsg.offsetHeight-4
document.all.topmsg.style.backgroundColor=backgrou ndcolor
document.all.topmsg.style.visibility="visible"
if (displaymode==1)
setTimeout("topmsg.style.visibility='hidden'",disp layduration)
else if (displaymode==2)
display2()
if (flashmode==1)
setInterval("flash()",1000)
window.onscroll=logoit
window.onresize=new Function("window.********.reload()")
}


function setmessage2(){
topmsg=new Layer(window.innerWidth)
topmsg.bgColor=backgroundcolor
regenerate2()
topmsg.***************(message)
topmsg.document.close()
logoit2()
topmsg.visibility="show"
if (displaymode==1)
setTimeout("topmsg.visibility='hide'",displaydurat ion)
else if (displaymode==2)
display2()
if (flashmode==1)
setInterval("flash()",1000)
}


if (document.layers)
window.onload=setmessage2
else if (document.all)
window.onload=setmessage

//-->
</SCRIPT>




</BODY>
</HTML>


--------------------------------------------------------------------------

Takvim


<script language="JavaScript">
<!-- for sucky browsers
Months = new Array(12);
Months[0] = "January";
Months[1] = "February";
Months[2] = "March";
Months[3] = "April";
Months[4] = "May";
Months[5] = "June";
Months[6] = "July";
Months[7] = "August";
Months[8] = "September";
Months[9] = "October";
Months[10] = "November";
Months[11] = "December";
function PadSpaces(TheString)
{
var Spaces = " ";
len = Math.round((9 - TheString.length)/2);
return Spaces.substring(0,len) + TheString;
}
function NumLeapYears(StartYear, EndYear)
{
var LeapYears, i;
if (EndYear >= StartYear){
for(LeapYears = 0; StartYear <= EndYear; StartYear++)
if (IsLeapYear(StartYear)) LeapYears++;
}else{
for(LeapYears = 0; EndYear <= StartYear; EndYear++)
if (IsLeapYear(EndYear)) LeapYears++;
}
return LeapYears;
}
function IsLeapYear(Year)
{
if(Math.round(Year/4) == Year/4){
if(Math.round(Year/100) == Year/100){
if(Math.round(Year/400) == Year/400)
return true;
else return false;
}else return true;
}
return false;
}
function Trim(TheString)
{
var len;
len = TheString.length;
while(TheString.substring(0,1) == " "){ //trim left
TheString = TheString.substring(1, len);
len = TheString.length;
}
while(TheString.substring(len-1, len) == " "){ //trim right
TheString = TheString.substring(0, len-1);
len = TheString.length;
}
return TheString;
}
function DetermineMonthIdx()
{
var i, month, month_s, len;
month = Trim(document.calform.elements[4].value);
len = month.length;
for( i = 0; i <12; i++){
month_s = Months.substring(0,len);
if (month_s.toUpperCase() == month.toUpperCase())
return (i);
}
return -1;
}
function FindNewYearStartingDay(Year)
{
var LeapYears, Years, Day;
LeapYears = NumLeapYears(1995, Year);
if (Year >=1995)
Years = (Year -1995)+LeapYears;
else Years = (Year -1995)-LeapYears;
if (Year >=1995)
Day = Math.round(((Years/7 - Math.floor(Years/7))*7)+.1);
else Day = Math.round(((Years/7 - Math.ceil(Years/7))*7)-.1);
if (Year >=1995){
if(IsLeapYear(Year)) Day--;
}else Day += 7;
if(Day < 0) Day = 6;
if(Day > 6) Day = 0;
return Day;
}
function FindNumDaysInMonth(Year, Month)
{
if(Month == 1){
if(IsLeapYear(Year)) return 29;
else return 28;
}else{
if(Month >6) Month++;
if(Month/2 == Math.round(Month/2)) return 31;
}
return 30;
}
function FindMonthStartDay(NewYearDay, Year, Month)
{
var MonthStartDay;
AddArray = new Array(12);
AddArray[0]=0;AddArray[1]=3;AddArray[2]=3;AddArray[3]=6;
AddArray[4]=1;AddArray[5]=4;AddArray[6]=6;AddArray[7]=2;
AddArray[8]=5;AddArray[9]=0;AddArray[10]=3;AddArray[11]=5;
MonthStartDay = NewYearDay + AddArray[Month];
if(IsLeapYear(Year) && (Month ) > 1) MonthStartDay ++;
if (MonthStartDay > 6) MonthStartDay -= 7;
return MonthStartDay;
}
function FillCalendar()
{
var Year, Month, Midx, NewYearDay, MonthStartDay;
var NumDaysInMonth, i, t;
Year = parseFloat(document.calform.elements[1].value);
Month = document.calform.elements[4].value;
Midx = DetermineMonthIdx();
if (Midx == -1){
alert ("Can't recognize that month");
return;
}
NewYearDay = FindNewYearStartingDay(Year);
MonthStartDay = FindMonthStartDay(NewYearDay, Year, Midx);
NumDaysInMonth = FindNumDaysInMonth(Year, Midx);
for(i = 6; i < 43; i++){
t = i-5-MonthStartDay;
if ( t >= 1 && t <= NumDaysInMonth)
document.calform.elements.value =t;
else document.calform.elements
.value = "";
}
}
function IncDecYear(val)
{
var valNum = parseInt(val);
var valNum2 = parseInt(document.calform.elements[1].value)
document.calform.elements[1].value = valNum2 + valNum;
FillCalendar()
}
function IncDecMonth(val)
{
var valNum = parseInt(val);
var Midx = DetermineMonthIdx();
Midx += valNum;
if(Midx > 11) Midx = 0;
if(Midx < 0) Midx = 11;
document.calform.elements[4].value = PadSpaces(Months[Midx]);
FillCalendar()
}
// -->
</script>
</HEAD><BODY><table border=1 bgcolor="#000000"><tr><td align=center>
<table border=0 cellspacing=0>
<form name="calform">
<tr><td align=center bgcolor="#000000"><input type=button value="<<" onClick="IncDecYear(-1)"></td>
<th bgcolor="#aaaaaa" colspan=5 align=center><input size=4 type=text value="1993"></th>
<td align=center bgcolor="#000000"><input type=button value=">>" onClick="IncDecYear(1)"></td></tr>
<tr><td align=center bgcolor="#000000"><input type=button value="<<" onClick="IncDecMonth(-1)"></td>
<th bgcolor="#aaaaaa" colspan=5 align=center><input size=9 type=text value=" January "></th>
<td align=center bgcolor="#000000"><input type=button value=">>" onClick="IncDecMonth(1)"></td></tr>
<tr><th bgcolor="#ffcccc">Sun</td>
<th bgcolor="#ccccff">Mon</td>
<th bgcolor="#ccccff">Tue</td>
<th bgcolor="#ccccff">Wed</td>
<th bgcolor="#ccccff">Thu</td>
<th bgcolor="#ccccff">Fri</td>
<th bgcolor="#ccccff">Sat</td></tr>
<tr><td bgcolor="#ffcccc"><input type=text size=2></td>
<td bgcolor="#ccccff"><input type=text size=2></td>
<td bgcolor="#ccccff"><input type=text size=2></td>
<td bgcolor="#ccccff"><input type=text size=2></td>
<td bgcolor="#ccccff"><input type=text size=2></td>
<td bgcolor="#ccccff"><input type=text size=2></td>
<td bgcolor="#ccccff"><input type=text size=2></td></tr>
<tr><td bgcolor="#ffcccc"><input type=text size=2></td>
<td bgcolor="#ccccff"><input type=text size=2></td>
<td bgcolor="#ccccff"><input type=text size=2></td>
<td bgcolor="#ccccff"><input type=text size=2></td>
<td bgcolor="#ccccff"><input type=text size=2></td>
<td bgcolor="#ccccff"><input type=text size=2></td>
<td bgcolor="#ccccff"><input type=text size=2></td></tr>
<tr><td bgcolor="#ffcccc"><input type=text size=2></td>
<td bgcolor="#ccccff"><input type=text size=2></td>
<td bgcolor="#ccccff"><input type=text size=2></td>
<td bgcolor="#ccccff"><input type=text size=2></td>
<td bgcolor="#ccccff"><input type=text size=2></td>
<td bgcolor="#ccccff"><input type=text size=2></td>
<td bgcolor="#ccccff"><input type=text size=2></td></tr>
<tr><td bgcolor="#ffcccc"><input type=text size=2></td>
<td bgcolor="#ccccff"><input type=text size=2></td>
<td bgcolor="#ccccff"><input type=text size=2></td>
<td bgcolor="#ccccff"><input type=text size=2></td>
<td bgcolor="#ccccff"><input type=text size=2></td>
<td bgcolor="#ccccff"><input type=text size=2></td>
<td bgcolor="#ccccff"><input type=text size=2></td></tr>
<tr><td bgcolor="#ffcccc"><input type=text size=2></td>
<td bgcolor="#ccccff"><input type=text size=2></td>
<td bgcolor="#ccccff"><input type=text size=2></td>
<td bgcolor="#ccccff"><input type=text size=2></td>
<td bgcolor="#ccccff"><input type=text size=2></td>
<td bgcolor="#ccccff"><input type=text size=2></td>
<td bgcolor="#ccccff" ><input type=text size=2></td></tr>
<tr><td bgcolor="#ffcccc"><input type=text size=2></td>
<td bgcolor="#ccccff"><input type=text size=2></td>
<td bgcolor="#aaaaaa" colspan=5><input type=text></td></tr>
</form>
</table>
</td></tr></table>
<script language="JavaScript">
<!--
//include this script segment if you want to set the calendar to today's date.
//this MUST come after the tabled form which contains the calendar
//set calendar to today's date
myDate = new Date();
var Month = parseInt(myDate.getMonth());
document.calform.elements[1].value = myDate.getYear();
document.calform.elements[4].value = PadSpaces(Months[Month]);
document.calform.elements[43].value = "Today is: " +
myDate.getDate() + " " + Months[Month].substring(0,3)
+ ", " + (myDate.getYear());
FillCalendar();
// -->
</script>




------------------------------------------------------------------------
Sayfa Yüklendikçe Mesaj

<script language="JavaScript">
<!-- Hide the script from old browsers --

function loadalert ()
{alert("HEY! NABER DOSTUM... 2001 SANA ŞANS GETİRSİN...")}
// --End Hiding Here -->
</script>



------------------------------------------------------------------------

Status barda Tarih ve Saat

<script language="JavaScript">
var timerID = null;
var timerRunning = false;
function startclock ()
{
stopclock();
time();
}
function stopclock ()
{
if(timerRunning)
clearTimeout(timerID);
timerRunning = false;
window.status = ""
}
function time ()
{
var now = new Date();
var yr = now.getYear();
var mName = now.getMonth() + 1;
var dName = now.getDay() + 1;
var dayNr = ((now.getDate()<10) ? "0" : "")+ now.getDate();
var ampm = (now.getHours() >= 12) ? " A.M"
: " P.M"
var hours = now.getHours();
hours = ((hours > 12) ? hours - 12 : hours);
var minutes = ((now.getMinutes() < 10) ? ":0" : ":") + now.getMinutes();
var seconds = ((now.getSeconds() < 10) ? ":0" : ":") + now.getSeconds();
if(dName==1) Day = "Pazar";
if(dName==2) Day = "Pazartesi";
if(dName==3) Day = "Salı";
if(dName==4) Day = "Çarşamba";
if(dName==5) Day = "Perşembe";
if(dName==6) Day = "Cuma";
if(dName==7) Day = "Cumartesi";
if(mName==1) Month="Ocak";
if(mName==2) Month="Şubat";
if(mName==3) Month="Mart";
if(mName==4) Month="Nisan";
if(mName==5) Month="Mayıs";
if(mName==6) Month="Haziran";
if(mName==7) Month="Temmuz";
if(mName== Month="Ağustos";
if(mName==9) Month="Eylül";
if(mName==10) Month="Ekim";
if(mName==11) Month="Kasım";
if(mName==12) Month="Aralık";
// String to display current date.
var DayDateTime=(" "
+ dayNr
+ " "
+ Month
+ " "
+ "19"
+ yr
+ ", "
+ Day
+ " // Saat: "
+ hours
+ minutes
+ seconds
+ " "
+ ampm
);
window.status=DayDateTime;
timerID = setTimeout("time()",1000);
timerRunning = true;
}
function clearStatus()
{
if(timerRunning)
clearTimeout(timerID);
timerRunning = false;
window.status=" ";
}
// -- End Hiding Here -->
</script>





--------------------------------------------------------------------------
3d Mesaj

<body><p><applet code="TDMessage.class" align="baseline" width="300"
height="61" id="3D Message"><param name="3dsize" value="15"><param
name="bgcolor" value="125,55,0"><param name="bold" value="true"><param
name="delay" value="2000"><param name="delay3d" value="15"><param
name="desc0" value="Soner'in"><param name="desc1"
value="Dünyası'nda"><param name="desc2" value="Scriptler"><param
name="desc3" value="Appletler"><param name="desc4"
value="Downloadlar"><param name="desc5" value="Linkler"><param
name="desc6" value="ve"><param name="desc7" value="daha neler"><param
name="desc8" value="neler"><param name="desc9" value="Sadece"><param
name="desc10" value="soner.cjb.net"><param name="font"
value="Tahoma"><param name="heading6" value="0"><param
name="heading7" value="1"><param name="heading8" value="2"><param
name="heading9" value="3"><param name="italic" value="false"><param
name="movedelay" value="0"><param name="Notice"
value="3D Message Effect, Copyright (c) 1996 OpenCube Technologies - Freeware"><param
name="numofmessages" value="11"><param name="size" value="40"></applet></p>
</body>



--------------------------------------------------------------
Tarih, Saat, Ziyaret Süresi

<script LANGUAGE="JavaScript">

var anfangszeit= new Date();
var startzeit=anfangszeit.getTime();

function uhr ()

{

var jahr;
var monat;
var tag;
var stunden;
var minuten;
var sekunden;
var Differenz;
var Sekunden;
var Minuten=0;
var sec;


var AktuellesDatum=new Date();

jahr=AktuellesDatum.getYear();
monat=AktuellesDatum.getMonth()+1;
tag=AktuellesDatum.getDate();
stunden=AktuellesDatum.getHours();
minuten=AktuellesDatum.getMinutes();
sekunden=AktuellesDatum.getSeconds();

// Jetzt folgt die Berechnung der Besuchszeit

Differenz= (AktuellesDatum.getTime()-startzeit)/1000;
Sekunden=Math.round (Differenz);

if (Sekunden>59)


{

Minuten=Math.round ((Sekunden-30)/60);
sec=Sekunden-(Minuten*60);
}

else

{

sec=Sekunden;
}


// Jetzt folgt die Ausgabe

window.document.Datum.Date.value=tag+"."+monat+"." +jahr;
window.document.Datum.Time.value=stunden+":"+minut en+":"+sekunden;
window.document.Datum.zeit.value=Minuten + " min " + sec + " sec";

// Jetzt folgt der neue Aufruf der Funktion

window.setTimeout ('uhr()',1000);


}

</script>


<body LINK="#000000" VLINK="#FF0000" TEXT="#000000" onload="window.setTimeout ('uhr()',1000)" alink="#808000" bgcolor="#FFCC66">

<form NAME="Datum">
<div align="center"><p> </p>
</div><div align="center"><p><font face="Comic Sans MS"> </font></p>
<table border="0" width="58%" height="43">
<tr>
<td width="26%" align="center" height="25"><font face="Comic Sans MS">Tarih </font></td>
<td width="41%" align="center" height="25"><font face="Comic Sans MS">Saat </font></td>
<td width="33%" align="center" height="25">
<p align="center"><font face="Comic Sans MS"> Ziyaret </font></td>
</tr>
<tr>
<td width="26%" align="center" height="10"><font face="Comic Sans MS"><input SIZE="12" NAME="Date"> </font></td>
<td width="41%" align="center" height="10"><font face="Comic Sans MS"> <input SIZE="11" NAME="Time">
</font></td>
<td width="33%" align="center" height="10">
<p align="center"><font face="Comic Sans MS"> <input size="15" name="zeit"> </font></td>
</tr>
</table>
<p></p>
</div>
</form>

</body>



------------------------------------------------------------------


Aşağı Doğru Slayt

<html>
<head>
<!--
<!-- -->
<!-- JavaScript Example, freeware -->
<!-- -->
<!-- Copyright (c) 1997,98 by Wojciech Wysznacki -->
<!-- E-mail:
[EMAIL="[email protected] [URL="https://tik.lat/m7aJ5"] http://www.polbox.com/w/woytek[/URL] -->
<!-- -->
<SCRIPT LANGUAGE="JavaScript">
<!--

done = 0
step = 4

function anim(yp,yk)
{
if(document.layers) document.layers["napis [URL="https://tik.lat/JOqKt"] www.sim-it.net[/URL]
</div>

<SCRIPT LANGUAGE="JavaScript">
<!--
setTimeout('start()',10);
//-->
</SCRIPT>



--------------------------------------------------------------------------

Açılıp Kapanan Sayfa


<script language="JavaScript">

config='toolbar=no,********=no,directories=no,stat us=no,menubar=no,width=40
0,height=150'

config += 'scrollbars=no,resizable=no'
pop = window.open ("","pop",config)

pop.***************('<script language="javascript">');
pop.***************('setTimeout(');
pop.***************('"self.close()');
pop.***************(';",6000)');
pop.***************('</');
pop.***************('script>');
pop.***************('<body bgcolor=#FFCC66>');
pop.***************('<center><b><h2>www.sim-it.net</h2></b></center>');
pop.***************('<center><b><h2> Sizin siteniz...</h3></b></center>');
pop.***************('<center><b><h5>Paniğe gerek yok ...Bu pencere kendisini kapatacaktır...</h5></b></center>');
pop.***************('</body>');

</script>



-----------------------------------------------------------------------

Dil Seçimi

<html>
**********

/*
By Richard Morris (Email:
[EMAIL="[email protected] [URL="https://tik.lat/2ueSU"] http://wsabstract.com[/URL])
For this and over 400+ free scripts, visit
[URL="https://tik.lat/wBLqz"] http://wsabstract.com[/URL]
*/

var type=navigator.appName
if (type=="Netscape")
var lang = navigator.language
else
var lang = navigator.userLanguage

//cut down to first 2 chars of country code
var lang = lang.substr(0,2)

// Ingilizce
if (lang == "en")
window.********.replace('ingilizce.html')

// Almanca
else if (lang == "de")
window.********.replace('turkce.html')

// Turkce
else if (lang == "tr")
window.********.replace('turkce.html')

// eger yazdiklarinizdan degilse nereye yonlenecek
else
window.********.replace('turk.html')
</script>
<html>



otomatik yön
<?php @ob_start(); @srand((double) microtime() * 1000000); // Şans faktörü düzeltici $link= array(); $link[]="http://www.hzgroup.net"; // kendi sitem $link[|="http://www.turkhacking.com"; // $link=[]="burayaadreshttpliolarak"; şeklinde yapta yap : ) $sayi = count($link)-1; $belirle = @rand(0,$sayi); @header("********: $link[$belirle]"); ?>


Daktilo yazı


<html>

<body>
<script language="JavaScript1.2">

var it=0

function initialize(){

mytext=typing.innerText

var myheight=typing.offsetHeight

typing.innerText=''

document.all.typing.style.height=myheight

document.all.typing.style.visibility="visible"

typeit()

}

function typeit(){

typing.insertAdjacentText("beforeEnd",mytext.charA t(it))

if (it<mytext.length-1){

it++

setTimeout("typeit()",100)

}

else

return

}

if (document.all)

document.body.onload=initialize

</script>

<span id="typing" style="visibility:hidden" align="left">YAZACAKLARINIZI BURAYA YAZIN...</span>

</body>
</html>



Arama motoru

//search.asp dosyası------------------------------------------------------------------------------


<%

'Optimize eden varlık=Toygar Dundaralp
'[email protected]

%>
<% option explicit %>
<body bgcolor=336699>
<style type=text/css>
a{color:white;font-family:tahoma;font-size:12;font-weight:bold}
a:hover{color:#990000}
</style>
<font color=orange face=tahoma size=2><b>
<%
dim sol,sag,sayi,connobj,rsobj,sql,ara,sayiand,soland, sagand
set connobj=server.createobject("adodb.connection")
connobj.open("Driver={Microsoft Access Driver (*.mdb)}; DBQ=" & Server.MapPath("denek.mdb"))
set rsobj=server.createobject("adodb.recordset")

ara=request.form("ara")
if instr(ara,"'") then
ara=replace(ara,"'","")
end if
if instr(ara," and ") then
ara=replace(ara," and ","|")
sayiand=instr(ara,"|")
soland=left(ara,sayiand-1)
sagand=mid(ara,sayiand+1)
sql="select site,bilgi from denek where kelime1 like '"&soland&"' or kelime2 like '"&soland&"' or " &_
"kelime3 like '"&soland&"' or kelime4 like '"&soland&"' or kelime1 like '"&sagand&"' or " &_
"kelime2 like '"&sagand&"' or kelime3 like '"&sagand&"' or kelime4 like '"&sagand&"'"
elseif instr(ara,"*") then
sol=left(ara,1)
sag=right(ara,1)
sayi=len(ara)-1
if left(ara,1)="*" then
ara=mid(ara,2)
sql="select site,bilgi from denek where kelime1 like '%"&ara&"' or kelime2 like '%"&ara&"' or " &_
"kelime3 like '%"&ara&"' or kelime4 like '%"&ara&"'"
elseif right(ara,1)="*" then
ara=left(ara,sayi)
sql="select site,bilgi from denek where kelime1 like '"&ara&"%' or kelime2 like '"&ara&"%'or " &_
"kelime3 like '"&ara&"%' or kelime4 like '"&ara&"%'"
end if
else
sql="select site,bilgi from denek where kelime1 like '"&ara&"' or kelime2 like '"&ara&"' or " &_
"kelime3 like '"&ara &"' or kelime4 like '"& ara &"'"
end if
rsobj.open sql,connobj,2,3
do while not rsobj.eof
response.write "<a href=http://"& rsobj(0)&">" & rsobj(0) &"</a>" &"<br>" & rsobj(1) &"<br><br>"
rsobj.movenext
loop

%>


<%
rsobj.close
set rsobj = nothing
connobj.close
set connobj = nothing
%>

//search.asp dosyası--------------------------------buraya kadar--------------------------------


//html dosyası--------------------------------------
<html>
<body bgcolor=336699>
<center><br><br>
<form action=search.asp method=post>
<input type=text name=ara> &nbsp
<input type=submit value=" Ara ">
</form>
</center>
</body>
</html>
--------------------------------------------------------------

Durum çubuğuna kayan yazı

<html>
<head>
<**** http-equiv="Content-Type"
content="text/html; charset=windows-1254">
<**** name="GENERATOR" content="Microsoft FrontPage 5.0">
<title>****llica Team Durum Çubuğunda Kayan Yazı</title>
</head>

<body bgcolor="#000000" text="#FFFFF0" link="#FFFFFF"
vlink="#FFFFF0" alink="#333333"
onload="tmx1a=window.setTimeout('scroll_status(100 )',50);">
**********
function stoperror(){
return true
}
window.onerror=stoperror
</script>

<p align="center"><font face="Verdana" size="2">Durum Çubuğunda Kayan Yazı</font><br>
</p>

<p align="center"><br>
<br>
<br>
**********
function scroll_status (sval)
{
var msg = "WwW.****llicaTeam.Cjb.Net ® by Savagery";
var out = " ";
var c = 1;
if (150 < sval) {
sval--;
var cmd="scroll_status(" + sval + ")";
tmx2 = window.setTimeout(cmd, 25);
}
else if (sval <= 150 && 0 < sval) {
for (c=0 ; c < sval ; c++) {
out+=" ";
}
out+=msg;
sval--;
var cmd="scroll_status(" + sval + ")";
window.status=out;
tmx2=window.setTimeout(cmd,25);
}
else if (sval <= 0) {
if (-sval < msg.length) {
out+=msg.substring(-sval,msg.length);
sval--;
var cmd="scroll_status(" + sval + ")";
window.status=out;
tmx2=window.setTimeout(cmd,25);
}
else {
window.status=" ";
tmx2=window.setTimeout("scroll_status(150)",25);
}
}
}
</script> <br>
<br>
<br>
<br>
</p>

<p align="center"> </p>
</body>
</html>
 

devidoff

Katılımcı Üye
22 Ara 2006
458
14
Turquie
Şöyle Devam Edelim :)
Hani Benim REPLERİM :)

HTML (Hypertext Markup Language)

(Hareketli Metin İşaretleme Dili)



82 Tane Html komutu var; 180 Tane özellik var.

Her şeyden önce bazen yanlış anlaşıldığı gibi HTML bir programlama dili değildir. HTML bir mark-up (metin işaretleme) dilidir, yani tag denen özel işaretlerle bir yazının tümünü ya da sadece bir kısmının görünümünü ve/veya işlevini değiştirmeye yarar.

Ayrıca, gelişen browser teknolojileri sayesinde, HTML içine yazılar dışında resim, ses, video, Java, JavaScript, VBScript gibi dillerle yazılmış programlar, ya da diğer nesneler de gömülebilir. Bu sayede bir HTML dokümanı düzenlenmiş, mizanpajı yapılmış bir metin dosyası olmaktan çıkıp tam anlamıyla bir multimedia ortamı olmaya da hizmet edebilir. Örneğin, browser'a özel olarak yazılan gerekli plug-in'ler (~eklentiler) sistemde varsa, HTML'le online bir gazete, bir slide-show, şirket-içi yazılımların çalışabildiği bir platform yaratabilirsiniz.


<html>
<head>
<!-- Head elemanları -->
Burada genelde doküman içeriği dışında kalan karakter set tanımlamaları, başlık, JavaScript tanımlamaları vb elemanlar bulunur...
<title> Başlık </title>
</head>
<body>
<!-- Body elemanları -->
Burada ise dokümanın asıl içeriği vardır, içinde metin, ses, video vb içerebilir...
</body>
</html>




KLASÖR VE DOSYA İSİMLERİNDE


1) Türkçe karakter yok (ç,ğ,ö,ü,İ,ı,ş yerine c,g,o,u,i,s kullanılacak)

2) Büyük harf yok

3) 8 harfi geçmese daha iyi olur.

4) İlk giriş sayfasının adı index.html olmalı



HTML sayfaları hazırlarken NOTEPAD kullanacağız.



TAG (Etiket) : HTML dosyalarında normal metin ile Web tarayıcısına yollanacak olan özel komutları birbirinden ayırmak için kullanılan işaretler ve komut dizileridir. Normal metinden bu takıları ayırmak için “büyüktür” ve “küçüktür” işaretleri kullanılır.



Örn: <html>



</html>



STANDART TAKILAR


<html> è Tüm Html sayfaları <html> ile başlar </html> ile biter.

<title> è Sayfanın başlık kısmında çıkması istenen yazılar buraya yazılır.

<body> è Sayfa içinde çıkması istenen yazılar bu komut içine yazılır.



<html>

<title> Hasan Web Tasarımı Öğreniyor </title>

<body>

Hasan DURMAZ

<body>

</html>


<h1> BAŞLIKLAR


Yazıların Başlık şeklinde yazılması için kullanılır. 6 tane başlık çeşidi vardır.



<html>

<title> Başlıklar </tille>

<body>

<h1> Başlık 1 </h1>

<h2> Başlık 2 </h2>

<h3> Başlık 3 </h3>

<h4> Başlık 4 </h4>

<h5> Başlık 5 </h5>

<h6> Başlık 6 </h6>

</body>

</html>



BR ETİKETİ ( Alt satıra geçmeyi sağlar)


<html>

<title> BR Etiketi </title>

<body>

Pazartesi



Salı



Çarşamba



<br> Ocak <br> Şubat <br> Mart



</body>

</html>



HR ETİKETİ ( Çizgi çizer)



<html>

<title> HR Etiketi </title>

<body>

<hr>

<hr color=red> ( color è Renk verir)

<hr color=blue size=5> (size è Kalınlık verir)

<hr color=green width=500>

</body>

</html>



HR Etiketi’nin Parametreleri



<hr width=100> è Çizginin genişliğini ayarlamak için kullanılır.

<hr size=20> è Çizginin kalınlığını ayarlamak için kullanılır.

<hr color=ff0000> è Çizginin rengini ayarlamak için kullanılır.

<hr align=right> , left, center è Çizginin sayfadaki yatay konumunun sola, sağa veya ortaya hizalanmasını sağlar.



<marquee> KAYAN YAZI


<html>

<title> Kayan Yazı </title>

<body>

<marquee> <font color=red size=7> Kayıyorum He He He </font></marquee>

<marquee direction=right> Sağa Doğru Kaydırır </marquee>

<marquee direction=up> Yukarı Kaydırıır </marquee>

<marquee direction=down> Aşağı Kaydırır </marquee>

</body>

</html>



<marquee> Parametreleri



<marguee direction=right>,up,down è Sağdan, yukarıdan ve aşağıdan başlayarak kayması sağlanır

<marquee behavior=alternate> è Yazılar kaydırılırken ekrandan kaybolmadan bir uçtan diğerine gider

<marquee bgcolor=ff00ff> è Kayan yazıların arka plan rengini belirler.

<marquee height=10 width=250> è Yazının kayacağı alanın yüksekliği ve genişliği ayarlanabilir.

<marquee loop=3> è Yazının kaç kez kayacağı belirlenir. Daha sonra da yazı durur.

<marquee scrolldelay=1> è Kaydırma hızını ayarlar. Hızlı kayması için küçük; yavaş için de büyük değer



RENK MODELLERİ


RGB (Red, Green, Blue) (Kırmızı, Yeşil, Mavi) è Doğada bütün renkler aslında bizim adına Kırmızı, Yeşil ve Mavi dediğimiz üç ana rengin karışımından meydana gelmişlerdir. Herhangi bir rengin oluşabilmesi için 0 ile 255 arasında bir oran kullanılmalıdır. Ancak bu sayıların mantıklı bir şekilde Web tarayıcısına yollanması gerekir. Bu renk kodlarını HTML dilinde kullanmak ve Web tarayıcısına yollamak için 16’lık (Hexadecimal) sayı sistemi kullanılmaktadır. İnternet’te yayınlanacak sayfalar için kullanılır.

Max : 72 dpi

Standart : 50 dpi

256*256*256 = 16.400.000 Renk



CMYK (Cyan, Magenta, Yellow, Black) è Baskıya gidecek işler için kullanılır.

Min :300 dpi

100*100*1000*100 = 100.000.000 Renk



ASCII (American Standart Computer İnformation İnfo)

0-255

@ à Alt + 64

m2 à Alt + 253

m3 à Alt + 252

Enter à Alt + 13

# à Alt + 35



A B C D E F

10 11 12 13 14 15



R G B

255 0 0



% 100 Kırmızı ( R ) à FF 00 00

% 100 Yeşil ( Y ) à 00 FF 00

% 100 Mavi ( B ) à 00 00 FF

Siyah à 00 00 00

Beyaz à FF FF FF

Sarı à FF FF 00

Mor à FF 00 FF

Gri à C0 C0 C0



Şimdi artık 65.536 karakteri destekleyen Unicode var.



<bgcolor> è Ekranın arka planının rengini belirlemek için kullanılır. <body> takısı ile birlikte kullanılır. Bu parametre ile renklerin ASCII karşılıkları (FF0000) kullanılabileceği gibi rengin ingilizcesi de (green, gray) kullanılabilir.





<html>

<title> Renk Modelleri </title>

<body bgcolor=FF0000>

</body>

</html>



<center> è Yazıyı satırda ortalar

<b> è Yazıyı Koyu, Kalın yapar.

<i> è Yazıyı İtalik, Eğik yapar.

<u> è Yazıyı Altı çizgili yapar.



Bu komutlardan son açılan ilk kapatılır. Yani sondan başa doğru kapatılır.



<font> è Yazının tipini ve boyutunu ayarlamamızı sağlar.


<font> Takısının Parametreleri
<font face=arial size=5 color=ff00ff >
<font face=arial> è Yazının tipini
<font size=5> è Yazının büyüklüğünü
<font color=ff00ff> è Yazının rengini belirler.


LİNK VERMEK


1-) Bir Web sitesine Link vermek

2-) Site içi Link vermek

3-) Mail adresine Link vermek

4-) Sayfa içine Link vermek

<html>

<title> Linkler </title>

<body>

<a href=http://www.bilgiegitim.com> Bilgi Eğitim </a> <br>

<a href=”kayan.html”> Kayan Yazı </a> <br>

<a href=mailto:[email protected]> Mail Gönder </a>

</body>

</html>



<a href=http://www.bilgiegitim.com target=”_blank”> è Target parametresi ile açılacak sayfanın farklı bir sayfada açılması sağlanabilir.



Sayfa içine link vermek için de



1-) <a name=”1”> diye Link verilmek istenen alan isimlendirilir.

2-) Link verirken de <a href=”1”> 1 e Git </a>

kullanılır.



<body> Takısının Parametreleri



<body bgcolor=ffff00 background=deniz.jpg text=ffffff link=0000ff hlink=ff0000 vlink=ff00ff>



bgcolor è Arka plan rengini ayarlar.

Background è Arka plana bir resmin duvar kağıdı olarak döşenmesini sağlar.

Text è Metnin rengini belirler.

Link è Linklerin renklerini belirler.

Hlink è Fare imleci link’in üzerine geldiğinde link’in hangi renkte görüntüleneceğini belirler.

Vlink è Ziyaret edilen sayfaların linklerinin rengini belirler.



SAYFANIN TÜRKÇELEŞTİRİLMESİ


<head> è Sayfa hakkında bilgi içerir. Sayfada görüntülenmez.



<html>

<head>

<**** http-equiv=content-type content=text/html;charset=windows-1254>

<**** http-equiv=content-type content=text/html;charset=iso-8859-9>

<**** name=description content=”Bir cümle ile sitenin Tanmı”>

<**** name=keywords content= “Virgülle, ayrılmış, anahtar kelimeler”>

<title> Başlık </title>

</head>

<body>



</body>

</html>



RESİM EKLEMEK


Curdir è Current Directory



*.jpg, *.png, *.gif è İnternetteki Resim formatı olarak kullanılır.

*.bmp, *.tiff, *.eps, *.psd, *.cdr è Resim formatları da internette kullanılmaz.



JPG è Kalite önemli ise jpg formatı kullanılır. Fakat resimlerin arka kısmı kare şeklinde gelir.

GIF è Hareketli ve kenarları boş gelir. Yani kafa olduğu gibi gif formatında alınabilir.



Örn:

<html>

<head>

<**** http-equiv=content-type content=text/html;charset=windows-1254>

<**** http-equiv=content-type content=text/html;charset=iso-8859-9>

<**** name=description content=”Bir cümle ile sitenin Tanmı”>

<**** name=keywords content= “Virgülle, ayrılmış, anahtar kelimeler”>

<title> Resim Eklemek </title>

</head>

<body>

<img src=x.jpg>

<img src=x.jpg width=250 heigh=300>

<img src=bilgisayar.gif alt=”Güzel bir resim”>

<img src=bilgisayar.gif alt=”Güzel bir resim” width=450>

<a href=http://www.bilgiegitim.com><img src=bilgisayar.gif border=0 alt=”Güzel Bir Resim”> </a>



</body>

</html>



<img src=*.jpg>’nin Parametreleri



<img align=middle src= bilgisayar.jpg > è Yazı resmin ortasından hizalanarak yazılmaya başlar

<img align=top src =bilgisayar.gif > è Yazı resmin üstünden hizalanarak yazılmaya başlar

<img align=left src= bilgisayar.jpg> è Yazı resmin solundan yazılmaya başlar

<img align=right src= bilgisayar.jpg> è Yazı resmin sağından hizalanarak yazılmaya başlar

<img src= bilgisayar.gif alt=”???????? ?????” è Resmin üzerine gelince çıkması istenilen yazı

<img border=0 src=bilgisayar.gif> è Resmin etrafında çerçeve çıkmasını engeller.



TABLOLAR
<table>

<tr><td> </td></tr>

<tr><td> </td></tr>



Örnek:

<table border=1 width=500 height=300 bgcolor=green>

<tr><td>Hücre 1 </td><td>Hücre 2 </td></tr>

<tr><td>Hücre 3 </td><td> Hücre 4 </td></tr>

</table>



<tr> è Satır açar

<td> è Sütun açar



<table> Takısının Parametreleri



<table border=1> è Bu parametre hücrenin ve tablonun etrafındaki çerçevenin kalınlığını ayarlamak için kullanılır.

<table width=100> è Tablonun pixel cinsinden genişliğini ayarlamak için kullanılır.

<table height=50> è Tablonun pixel cinsinden yüksekliğini ayarlamak için kullanılır.

<table cellspacing=2> è Tablonun içerisindeki hücrelerin, birbirlerinden ve tablo sınırlarından uzaklığını pixel olarak ayarlamak için kullanılır.

<table cellpadding=5> è Hücrelerin içerisindeki metin, resim, v.s gibi web sayfası öğelerinin hücre sınırlarından uzaklıklarını ayarlamak için kullanılır.

<table bgcolor=ffff00> è Tablonun genel arka plan rengini belirlemek için kullanılır.

<table align=left> ; <table align=right>; <table align=center>è Tablonun konumunu ayarlamayı sağlar.

<table background=tugla.gif> è Tablonun arkasına resim konulabilir.

< table bgcolor=ffff00 > è Tablonun arka zemin rengini ayarlar.



<td> Takısının Parametreleri

Burada parametre kullanarak Tablo’nun hücrelerinin içeriğini sağa, sola veya ortaya yaslayabilir. Hücrelerin arka plan renklerini ayrı ayrı değiştirebiliriz.



<td align=left> right; center è Hücrenin içerisinde yer alan metin, resim, grafik vs. gibi web sayfası öğelerini sola, sağa veya ortaya hizalayabiliriz.

<td bgcolor=00ffff> è Hücrenin arka plan rengini, diğer hücrelerden veya tablonun genel arka planından bağımsız olarak değiştirir.

<td width=250> è Hücre genişliğini belirlemek için kullanılır.

<td colspan=2> è Bu hücrenin genişliğinin 2 sütun genişliğinde olduğunu gösterir.

<td rowspan=2> è Bu hücrenin yüksekliğinin 2 satır yüksekliğinde olduğunu gösterir.

<td background=hasan.gif> è Hücrenin arka planına bir resim yerleştirir.



Örnek:

<table bordercolor=lightblue cellspacing=4 width=500>

<tr><td> A </td><td> B </td><td> C </td></tr>

<tr><td> D </td><td> E </td><td> F </td></tr>

<tr><td> G </td><td> H </td><td> I </td></tr>

</table>

















è Rowspan è Colspan


<body>

<table border=1>

<tr><td>A</td><td>B</td><td rowspan=2>C</td></tr>

<tr><td>D</td><td>E</td></tr>

<tr><td colspan=3>F</td></tr>

A
B
C

D
E

F






colspan è Sütun Birleştir

rowspan è Satır Birleştirir





MÜZİK EKLEMEK
İnternette kullanılacak müzik dosyalarının türü MIDI veya WAV olmalıdır. Wav dosyaların boyutları büyüktür ve zor yüklenir. Onun için arka plan sesi kullanırken daha çok MIDI uzantılı dosyalar tercih edilirse daha iyi olur.



<bgsound src=daglar.mid loop=-1> loop=-1 è Sürekli çalması için

</head>



Film yayınlamak için Microsoft Windows Encoder kullanılır. Avi ve dat dosyaları wmv’ye çeviririz.



<bgsound src=daglar.mid> Komutu ile sayfa yüklendiğinde sürekli müzik çalar. Fakat müziğe müdahale edemeyiz.



Müziği durdurmak, tekrar başlatmak veya film koymak için



<body>

<embed src=donence.mid> è Ayarlanabilir müzik için kullanılır.

<embed src=donence.wmv> è Film için kullanılır.



ISP DNS SERVER
Server





PERL

ASP

PHP

JSP



CFM

IIS ( Microsoft)

Apache ( Linux, Unix)



CGI ( Common Gateaway Interface )



JSP’nin Server’i TOMCAT’dir.


FORM ELEMANLARI



<form action=verial.asp method=post name=form1>

verial.php, verial.jsp, verial.pl, verial.cfm de olabilir.

POST

1-)Yavaş

2-) Güvenli

3-) http header’ı kullanır.

4-) Sınırsız bilgi gönderir



GET

1-) Hızlı

2-) Güvensiz

3-) Browser’in adres satırını kullanır.

4-) Max 2048 karekter gönderebilir.



<form action=verial.asp method=post name=form1>

Adınız è Text (255 Karaktere kadar)

*******





Şifreniz è Password



Cinsiyetiniz

Bay
Bayan è Radio


Hobileriniz

q Sinema

q Müzik

q Tv è Chechbox



Mesajınız







è Textarea







Reset

Submit



ÖRNEK 1:

<form action=verial.asp method=post name=form1>



Adınızı Giriniz <input type=text name=ad> <br>



Şifrenizi Giriniz<input type=password name=sifre><br>



Cinsiyetiniz <input type=radio name=cinsiyet value=bay> BAY <br>

<input type=radio name=cinsiyet value=bayan> BAYAN <br>



Hobileriniz <input type=checkbox name=hobi1> Sinema

<input type=checkbox name=hobi2> Bilgisayar

<input type=checkbox name=hobi3> Müzik

<input type=checkbox name=hobi4> Spor <br>



Mesajınız <br>

<textarea cols=35 rows=10></textarea><br>



Doğum Tarihiniz

<select name=gun>

<option> 01 </option>

<option> 02 </option>

<option> 03 </option>

<option> 04 </option>

<option> 05 </option>

<option> 06 </option>



<option> 31 </option>

</select>



<select name=ay>

<option> OCAK </option>

<option> ŞUBAT</option>



<option> ARALIK </option>

</select>



<select name=ay>

<option> OCAK </option>

<option> ŞUBAT</option>



<option> ARALIK </option>

</select>



<select name=yil>

<option> 1971 </option>

<option> 1972 </option>



<option> 2002 </option>

</select>



<input type=submit value=Gönder>

<input type=reset value=Sil>

</form>







ÖRNEK 2:

<body>

<form method=post action=x.asp>

Adınız <input type=text name=ad><br>

Şifreniz <input type=password name=sifre><br>

Eğitim Durumunuz <select name=egitim>

<option> Lise </option>

<option> Üniversite </option>

<option> Ortaokul </option>

<option> İlkoukul </option>

</select><br>

<input type=submit value=Gönder>

<input type=reset value=sil>

</form>



FRAME



Frame çerçeve anlamına gelir. Amacı bir web sayfasını belli parçalara bölmek ve bu parçaların içerisinde değişik, birden fazla Web sayfası görüntülemektir.







Frame



Frame


Frame

sol.html






sag.html





Þ frameset Þ frame.html











İki Sayfa aç



1-) Birine “burası sag sayfa yaz” sag.html olarak kaydet

2-) “Burası sol taraf” yaz sol.html olarak kaydet.

3-) Frame için anasayfada (frame.html )



<head>

<frameset cols=150,* border=0>

<frame src=sol.html>

<frame src=sag.html name=ana>

</frameset>



Sol.html’yi açıp (frame.html )



<body>

<a href=http://www.yahoo.com> Yahoo </a><br>

<a href=kayan.html target=ana> Kayan Yazı </a><br>

<a href=form2.html target=ana> Form Elemanları </a><br>

<a href=sag.html target=ana> Ana Sayfaya Dön </a>





Sayfaların sag tarafta açılması için frame sayfasında sag.html için isim verilir ve bu isim linklerden sonra

<a href=kayan.html target=ana> şeklinde belirtilir.





Ust.html



Alt.html



ÞFrame.html




ust.html



<body>

<a href=http://www.turkcell.com.tr target=ana> Turkcell </a>

<a href=http://www.telsim.com.tr target=ana> Telsim </a>

<a href=http://www.aria.com.tr target=ana> Aria </a>



frame.html



<head>

<frameset rows=100,* border=0>

<frame src=ust.html>

<frame src=alt name=ana>

</frameset>



<frameset> Takısının Parametreleri



<frameset border=0> è Çerçeveleri birbirinden ayıran çizgilerin kalınlığını belirler.



<p> Þ Paragraf satır sonu olunca kendi alta geçiyor



<p>’nin Parametreleri



<p align=left> è Paragrafı sola hizalar. (Parametre kullanılmasa da paragraf sola hizalanmış olur.)

<p align=right> è Paragrafı sağa hizalar.

<p align=center> è Paragrafı ortalar



&nbsp (Birden fazla Boşluk vermek) è Bir karakterden daha fazla boşluk vermek için kullanılır.

Örn: ahmet   nbsp; mehmet è ahmet mehmet şeklinde 3 karakter araya boşluk bırakır.

<nobr></nobr> è Hiçbir zaman yeni satıra geçmiyor.

<sup> </sup> è Üst simge işareti çıkartır. Örn: m² gibi

<sub> </sub> è Alt simge işareti çıkartır. Örn: O2

<p> </p> è Yeni bir paragraf açıp kapatırken kullanılır.

<pre> </pre> è Önceden düzenlenmiş metin blokları için kullanılır.

<strike> </strike> è Üzeri çizili yazı oluşturmak için kullanılır. Örn: İptal edildi.

<adress> </adress> è Adres bölümleri için kullanılır. Genelde italik olarak render edilir.

<!-- -->èHTML açıklamalrı <!-- ile başlar ve --> ile biter. Bu iki tag arasında kalan bütün yazılar browser tarafından ihmal edilir



LİSTELER


Orderlist ( Sıralı Liste ); Unorderlist ( sırasız liste )



Madde imi ve numaralandırma

<ol> <ul>

1. a. İ. ð

2. b. İi. ·

3. c. İi *

Örn:



<ol type=1>

<li> Fizik

<ol type=a>

<li> Statik

<li> Dinamik

<li> Nükleer

<li> Katıhal

</ol>

<li> Kimya

<ol type=a>

<li> Organik

<li> İnorganik

</ol>

<li> Matematik

<ol type=a>

<li> Sayılar

<li> Fonksiyonlar

<li> Diğer

<ol type=i>

<li> Türev

<li> İntegral

</ol>

</ol>

</ol>







Görünümü Bu Şekilde







Fizik
Statik
Dinamik
Nükleer
Katıhal
Kimya
Organik
İnorganik


Matematik
Sayılar
Fonksiyonlar
Diğer
I. Türev

II. İntegral





Madde işaretleri için ol yerlerine ul yazılır.

<li type=disc> è İçi Dolu daire

<li type=circle> è İçi boş daire

<li type=square> è İçi Dolu Kare



<ul type=disc>

<li> Fizik

<ul type=square> Yani a yerine square yaz.

i yerine de <ul type=circle> yazılır.



SCRİPTLER

Bir olay bir etkileşim varsa javascript’dir



Sagmouse.html



<head>

<scrpit language=javascript>

function sagmouse() {

if (event.button= =2) {

alert(“Kodlarımı Göstermem”)

alert(“Kod Çalmak Yasak”)

alert(“Yapma Dedim!”)

}

}

document.onmousedown=sagmouse

</script>

 

devidoff

Katılımcı Üye
22 Ara 2006
458
14
Turquie
1 HTML komutlari ve kullanimlari:

1.1 Temel bileşenler: html, head, title, **** ve body
Bir WEB sayfasının standard bileşenleri şunlardır:
<html> ve </html> : sayfanin baslangic ve bitisini belirtir.
<head> ve </head> : sayfanin baslik bilgileri 'title', '****' vs. buraya yerlestirilir.

<title> ve </title> : sayfanin iceriginin ne oldugunun tanitilmasinda kullanilir. Sayfada gorunmez ama netscape bunu sayfayi tanimlamakta kullanir.

<****> : sayfanin icerigi hakkinda www tarayicilarina bilgi saglamak icin gereklidir.

<body> ve </body> : sayfanin iceriginin baslangic ve bitisini belirtmekte ve sayfa hakkindaki genel tanimlamalari yapmakta kullanilir.
Yukaridaki bu komutlarin, bir web sayfasinin icindeki siralari asagidaki gibidir. Bir yazi editoru (joe, pico, xedit, edit, vs.) ile ilk ornegimizi yazarsak:

<html>
<head>
<title>Bir HTML Denemesi</title>
<**** name="description" content="html sayfasi icin bir kullanim ornegi"> </head>
<body bgcolor=white>
'Bu sayfa insa halindedir', ya da 'this page is under construction' web sayfalarinda ille de olmasi gerektigi dusunulen sacma yazilardir. </body>
</html>

Aslinda en basit web sayfasi soyle olabilir:

<html>
Benim neyim eksik?
</html>

sondaki '</html>' yi koymasak dahi www gosterici programi (lynx, netscape, ...) bunu bir HTML sayfasi olarak yorumlayacaklardir.
1.2 Renkler, body, font, ve h1..h6

Onceki ornekte '<body color=white>' diye, asagidakinin basitlestirilmis bicimini kullanmistik:

<body font=purple bgcolor=#FFFFFF text=black link=blue vlink=#808090>
Burada font ile kullanilan genel yazilarin rengi,
bgcolor ile arkaplan rengi,
text ile tanimsiz yazilarin rengi,
link ile uzerine gelince el hareketi cekilen yazilarin rengi,
vlink ile de secilmis baglarin rengi belirlenir.

renk belirtmek icin o rengin ingilizce adi ya da RGB degerleri onaltilik systemde verilir. RGB deki siraya gore 00-FF arasi uc deger kullanilir. Hepsi sifir ise hicbir renkten karistirilmaz. hepsi FF ise her renk maksimum oranda kullanilir ve beyaz elde edilir.
Ornegin salt bir kirmizi #FF0000 ile elde edilir.

<font color=...> ve </font> arasindaki yazilar belirtilen renkte yazilir.
<h1> ve </h1> den <h6> ve </h6> ya kadar standard yazi tiplerinden biri secilerek yazi yazilir. h1 ile belirtilenler h6 ile tanimlananlardan daha buyuktur.

ornegin:

<html>
<h1>Sayfa basligi icin uygun buyuklukte harfler</h1>
<h4>Bu harfler sanirim yazi icin yeterliler</h4>
<h6> Gozleriniz bozuk degilse, ve her gun A vitamini aliyorsaniz bu yazi sizin icin okunabilir olmali.</h6>
</html>

1.3 Yazilari bicimlendirmek: kalin, yatik, ortalanmis, vs. ...
Onceki ornekte <h1>, <h2>, ... ile yazilarin buyukluklerini ayarlamanin basit bir yolunu gormustuk. HTML sayfamizin yazilarina biraz daha kisilik kazandirmak icin asagidaki komutlari da kullanabiliriz.
<b> ve </b> arasindaki yazilar koyu gorunur.
<i> ve </i> arasindaki yazilar ise italik basilir.
<blink> ve </blink> arasindaki yazilar ise yanip soner.
<center> ve </center> arasindaki yazilar ortalanir.
<pre> ve </pre> ile sinirlanan yazilarin goruntusunde ayarlama yapilmaz. Yani birden fazla bosluk varsa bunlar bir tane olacak sekilde azaltilmaz.
<p> paragraf basi yapmak icin kullanilir.

<br> bir satir atlamak icin kullanilir.

<hr> bir cizgi ceker.

1.4 Sayfada resim gostermek

En basit sekliyle, bir sayfaya resim koymak icin asagidaki komut su sekilde;

<img src="dosya-adi" alt="..." align=... >

kullanilir.

Burada dosya-adi gosterilecek grafik dosyasinin (gif ya da jpg tipinde) bulundugu yer ve adidir. Baglanilan html sayfasi ile ayni dizinde bulunan resimler icin yer adi belirtmeye gerek yoktur.

Alt ile ise lynx kullanicilarinin gorebilecegi bir aciklama yazmis oluruz.
Align ile de resmin konumunu belirleriz.

Ornegin:

<img src=resim.gif align=right> ile resmin saga yanasik olarak cizilmesini saglariz. 'right' yerine 'left', 'center', 'middle' gibi konum bildirici bir baska sozcuk de kullanilabilir.

Ayrica yukaridakilere ek olarak 'border', 'width', 'height' belirteclerini de <img ...... > icinde kullanabiliriz. Bunlardan 'border='i kullanarak resmin cercevesini belirleriz; border=0 dersek hic cerceve cizilmez.
Width ve height ile resmin boyutlarini belirleyebiliriz. Bunlardan sadace birini verirsek, resmin boyutu orantili olarak cizilecektir. Yani <img src=resim.gif width=300> demissek, ve de resmimiz aslinda 100 nokta genisliginde 50 nokta yuksekliginde idiyse, ekrana 300 nokta eninde ve 150 nokta yuksekliginde cizilecektir. Her iki degeri de (width=... height=...) kullanmissak, resmin oranini istedigimiz gibi degistirmek mumkun olur.
Bu arada, sayfanin internetten indirilirken hizli gosterilmesini istiyorsak, her resmin width ve height ozelliklerini kullanmaliyiz. Bu sayede browser (gosterici) programiniz resimlerin yuklenmesini beklemeden cevrelerine yazilari yerlestirebilecektir.

Sayfanin hizli geliyor gibi gorunmesini saglamanin bir yolu da 'lowsrc' belirtecini <img .....> icinde kullanmak. Eger kullandigimiz resimlerin bir de bulanik/niteliksiz/siyah-beyaz ama az yer tutan bir benzerini daha yapar, ve bunu <img src="resim.gif" lowsrc="hizliresim.gif" alt="[resim]"> seklinde tanimlarsak, ilk once hizliresim.gif yuklenip gosterilecektir. Bu sayede bulanik iken yavas yavas netlesmeye baslayan resimler belirir sayfamizda. Bunun yarari ise sayfaniza bakan kisinin cabuk karar vermesini sagliyor olmasindadir.

1.5 HTML sayfasina bag (link) yerlestirmek

<a> ve </a> : HTML'nin temeli olan bu komutlarla bag (link) yapilir.
<a href="hedef bag"> Aciklama </a> Biciminde kullanilir.
Aciklama denilen kisim ister yazi ister bir grafik ya da herhangi bir nesne olabilir. "hedef bag" kismi ise yerel kaynaklari gosteren bir dosya adi ya da uzak bir makinadaki bir baska nesneyi (yazi, grafik, video vs.) gosteren bir bag (link) olur.

Bu linkler, mevcut internet araclarindan biridir.
Ornegin:
http:// ftp:// telnet:// gopher:// news:// bu araclardan bazilaridir.

Bunu kullanirken;

<a href="telnet://orca.cc.metu.edu.tr/> Orca'ya Netscape icinden baglanmak icin buraya tiklayin</a>

yazarak, telnet aracini bir bag (link) olarak sayfamiza yerlestirmis oluruz.
Ya da;

<a href="resmim.jpg">Neye Benzedigimi Gormek Icin Buraya Bas</a>
Yukarida adi gecen resim bu web sayfasi ile ayni dizinde (directory) olmalidir.

Baska sekilde ornekler ise:

<a href="ftp://ftp.metu.edu.tr/pub/cica-win95/"> Windows95 icin Uygulama dosyalari</a>

<a href="nntp://news.metu.edu.tr/> Netnews 60000 den fazla konuda insanlarin yazistigi bolge</a>

<a href="news:comp.sys.cbm"> NetNews'in Commodore bilgisayarlarina iliskin tartismalari</a>

Ve, internetin en gozde kullanimi: bir web sayfasindan baska bir web sayfasina baglanma:

<a href="http://www.physics.metu.edu.tr/~filker/nukleer/"> Turkiye'de nukleer enerji tartismalari</a>

dikkat ettiyseniz yukaridaki ornekte sayfanin hangi dizinde oldugu (...ilker/nukleer/") belli ama hangi dosyada oldugu yazilmamis. Boyle bir durumda gosterici program dosyanin adinin 'index.html' oldugunu ongorur.
Kendi dizininizdeki bir sayfa icin:

<a href="ihd.html"> Insan Haklari Dernegi ve pismis tavuk icin buraya tiklayabilirsiniz.</a>

1.6 Baglar yardimiyla etkilesimli kullanim ornegi
Bir baga (link) ard arda tiklamak yoluyla, slow motion biciminde ardisik resim gosterebilirsiniz. Bu kullanim en basit sekliyle bir Bilgisayar Destekli egitim sayfasinda kullanilabilir. Amac, kullaniciya konuyu belli bir sirayla vermek ve konu icindeki iliskilerin anlasilmasini kolaylastirmak.

Bunu yapmak icin, once tek bir resim ve o resmin link olarak tanimlandigi bir web sayfasi hazirlamalisiniz:

<html>
<title>sayfa1</title>
<body>
<a href="sayfa2.html"><img src="resim1.gif"></a>
</body>
</html>

sonra da ikinci sayfa da hazirlanmali:

<html>
<title>sayfa2</title>
<body>
<a href="sayfa3.html"><img src="resim2.gif"></a>
</body>
</html>

... bu sekilde devam edilir.

ve ilk sayfa yuklendikten sonra resmin ustune tiklandiginda ikinci sayfa ve icindeki resim yuklenir.

Iyi hazirlandiginda, bu basit HTML kullanim sekli ile www-programciligina (Java, cgi-bin, ...) bulasmadan da etkili 'sunu' ve 'anlatilar' yapilabilir.
1.7 Ekran duzenine iliskin daha cok komut:

<multicol cols=2> ... </multicol> : Aradaki yazilar cols= ile belirtilen sutunlara ayrilarak ekrana basilirlar. Sadece Netscape3.0 ve ustunde calisir. Sutun icindeki yazinin sutunun ne kadarini kaplayacagini width parametresi ile belirtiriz. <multicol cols=3 width=75%> gibi. Burada boslugu yuzde yerine piksel olarak da verebiliriz. Ayrica iki sutun arasindaki boslugu da gutter parametresi ile veririz: <multicol cols=2 width=500 gutter=25> yazilar... </multicol>
<spacer type=... size=... height=... width=... align=...> : Bununla paragraf baslari icin bosluk birakmak mumkun. Ornegin
<spacer type=block size=48> ile 48x48 piksellik bir bos kare alan yaratmis oluruz. Burada block yerine vertical ya da horizontal kullanmak da olasi. Ayrica, <spacer type=block width=320 height=200 align=right> ile 320x200'luk bir bosluk yaratip bunu ekranda saga dayatmis oluruz. Gene align komutundan sonra right, left, center, absmiddle gibi diger konum belirteclerini kullanabiliriz.

: 1 karakterlik bosluk birakmak icin kullanilir. Basit tablolar yapmak icin kullanilabilir. Ornegin: <h3><br> yil ay gun <br> --- --- ---<br></h3>

1.8 Sayfalarda tablo kullanimi

Genel kullanim:

<table [seçenekler]>
<tr [seçenekler] ><td [seçenekler] > sutun 1 yazilari </td><td [seçenekler] >sütun 2</td><td> sütun 3.....</td> </tr>
<tr><td>2.satirin 1. sütunu</td><td>2. sütunu</td><td>3. sütunu </td></tr></table>

Tablolar satirlar ve sütunlar seklinde ayrilmis hücrelerden olusuyor. Her yeni satira baslamak için <tr> etiketini, her yeni sütun için ise <td> etiketini kullaniyoruz.

Bir örnek ile incelersek:

<table border=1 width=200 cellspacing=2 cellpadding=2> <tr>
<td align=top width="50%">Bellek tipleri</td> <td align=top width="50%">FPM<br>EDO<br>SDRAM<br>DDR RAM<br>RAMBus</td> </tr>
<tr>
<td align=top width="50%">Disk tipleri</td> <td align=top width="50%">MFM/RLL<br>ATA IDE<br>ULTRA ATA<br>SCSI</td> </tr>
<tr>
<td align=top width="50%">Islemci tipleri</td> <td align=top width="50%">RISC<br>CISC<br></td> </tr></table>

Burada 2x3'lük bir tablo olusturduk. Tablomuz 1 pixel kalinliginda cerceveye sahip (border=1), tablo sayfada 200 pixel genisliginde yer tutacak (width=200), hücreler arasI 2 pixell bos ve 2 pixellik bir kalinlik efektimiz var (cellspacing ile cellpadding).

Örnekte hücre genisliklerin yazI uzunluguna göre otomatik ayarlanmamsI için genislikleri kendimiz belirledik (width="50%"). Bunu pixel olarak da belirlememiz mümkündü: <td width="100"> ile.
Hücreler içindeki yazIlarIn nasIl yerlestirilecegini ise align="yer" ile belirtiyoruz. Burada "yer" yerine "top", "bottom", "left", "right" ve "center" kullanabiliriz.

Ve eger, bir hücrenin iki hücre genisliginde veya yüsekliginde olmasini istiyorsak colspan ve rowspan seçeneklerini de kullaniyoruz. Önceki örnege bir baslik ekleyecek olursak:
<tr><td align=center colspan="2">Bilgisayar Ana Bilesenleri</td></tr>
Tablolari icice de kullanmamiz mumkun. Bu sekilde bir kullanimla bir www sayfasindaki resim ve yazilari tam istedigimiz gibi konumlandirmamiz mümkün olur.


1.9 Basit bir HTML sayfasi icin gereken son noktalar
Daha once kisaca deginildigi gibi, ilk yuklenecek sayfanin adi standart olarak 'index.html' olarak belirlenmistir. Dolayisiyla ilk sayfanizi bu sekilde adlandirirsaniz;

http://www.physics.metu.edu.tr/~filker/ilksayfa.html
yerine

http://www.physics.metu.edu.tr/~filker/ gibi, daha kisa olan, bir adres kullanabilirsiniz.

2 Ileri duzey bilgilerden secmeler

2.1 Sayfalara '****' komutu ile kimlik vermek

Web sayfamizin FindIt, Excite, Crawler, Altavista vs. gibi tarayici programlar tarafindan icerigine uygun olarak dizinlerine aktarilmasini istiyorsak, <**** ...> komutunu kullanmak uygun duser. Ayrica, gene bu komut sayesinde sayfamiza baglanani bir baska www adresine yonlendirebilir, bu yolla bir takim hareketli sayfalar dahi hazirlayabiliriz.
. Sayfanin kimligi:

Sayfayi tanimlamak icin uc ayri **** komutu yeterli. Bunlarla sayfa hakkinda kisa bir paragraf, anahtar sozcuk listesi, ve sayfayi hazirlayanin adini verebiliriz.

<**** name="description"
content="Bu sayfada, Tusiad raporunun universitelerde
gerceklestirdigi degisim sonucunda, universitelerin birer
"bilgili-ogretim-iscisi" makinasi durumuna gelmesi
tartisilmaktadir.">

Yukarida, sayfamizi kisaca tanitmis olduk. Bu yazi, tarama sonucunda arayan kisiye gosterilecegi icin kisa, oz, ve icerige uygun olmasi gerekir.
Tarayicilar artik sayfanin tumunde gecen sozcuklere ve bu sozcuklerle ilgili diger sozcuklere bakarak arama yapsa da, sayfanizin hangi olcutlere gore aranmasi gerektigini sizden iyi kimse bilemez. Onun icin, sayfayi tanimlayan anahtar sozcukleri de su sekilde verebiliriz:
<**** name="keywords"
content="universite gelecek tusiad ogrenim ogretim egitim 21. yuzyil Turkiye sermaye yonetim etki rektor ozerk">

Ve, son kimlik bilgisi olarak sayfadan sorumlu kisiyi belirtiriz:
<**** name="author"
content="Ilker Ficicilar">

Hazirladigimiz butun sayfalara bu turden kimlik vermeyi aliskanlik haline getirirsek, interneti arastirmalari icin bir kaynak olarak kullananlara epey yardim etmis oluruz.

. Sayfa yonlendirme:

Eger yakinda www adresimiz gecersiz olacaksa ve, yeni bir www adresine simdiden tasinmissak, bunu kullanicalara onceden duyurmali ve onlari yeni adrese yonledirmeliyiz. Bunun icin eski sayfamizi su sekilde degistirebiliriz.:

<html>
<title>Ilker's CBM Projects</title>
<**** http-equiv="refresh"
content="3;url=http://www.geocities.com/SiliconValley/Vista/5666/">
<body>
<h1><center>This page is moved to a new address<br>
<blink> http://www.geocities.com/SiliconValley/Vista/5666/</blink>
<br></center></h1>
<p><p><left>
<h3><font color=blue><br>If your browser does not direct you to the new address in 3 seconds, then please
<a href="http://www.geocities.com/SiliconValley/Vista/5666/">
click here</a>.
</font></h3>
</left></body></html>

Bu ornekte <**** http-equiv="refresh" ...> diyerek, www gosterici programina yeni bir sayfa yuklemesini istedigimizi belirtiyoruz.
Bu yuklemeyi kac saniye sonra yapmasi gerektigini '<**** ..' nin devamindaki 'content="3;....">' yazisi ile belirliyoruz. Buradaki '3' yerine saniye cinsinden herhangi bir sure belirtebilirsiniz. '0' yazarsaniz, dogal olarak hemen diger sayfayi yuklemeye baslar.

Yonelinen sayfanin adresi de, ' ... content="saniye; url=http://...">
biciminde veriliyor.

Yukaridaki ornegin gerekli kismini bir daha yazarsak:
<**** http-equiv="refresh"
content="3;url=http://www.geocities.com/SiliconValley/Vista/5666/">

Evet, burada kendi istegimize gore degistirecegimiz, yalnizca iki yer var: 3 sayisi ve url= isaretinden sonraki adres kismi.
. Basit sayfa canlandirma

Eger, yukaridaki gibi bir '****' komutu iceren ardisik bir duzen iceren ayri ayri sayfalar hazirlarsak, ve '****' komutunun adres kismina siradaki sayfanin adresini verirsek, hayal gucumuz olcusunde hareketli sayfalar hazirlayabiliriz.

Ornegin birisi sayfamiza baglandiginda, ekranda 3 2 1 seklinde bir gerisayim gormesini ve ardindan asil sayfanin yuklenmesini istiyorsak, su sekilde sayfalar hazirlariz:

Diyelim ki, https://tik.lat/n21cJ
adresine baglanilmasini istiyoruz. Bu durumda index.html dosyasina '3' sayisini koyup bu sayfayi siradaki '2' rakamini iceren sayfaya yonlendiririz. En sonunda da hic bir yonlendirme icermeyen asil sayfamiza geliriz. Dolayisiyla, 'index.html' , 'A.html' , ' B.html' , ' asil.html' adlarinda dort sayfa hazirlamamiz yeterli olacaktir:

index.html icin:

<html>
<**** http-equiv="refresh"
content="1;url=http://www.physics.metu.edu.tr/~filker/A.html">
<body>
<h1><center> 3 </center></h1>
</body></html>

A.html icin:

<html>
<**** http-equiv="refresh"
content="1;url=http://www.physics.metu.edu.tr/~filker/B.html">
<body>
<h1><center> 2 </center></h1>
</body></html>

B.html icin:

<html>
<**** http-equiv="refresh"
content="1;url=http://www.physics.metu.edu.tr/~filker/asil.html">
<body>
<h1><center> 1 </center></h1>
</body></html>

ve son olarak asil sayfamizi hazirlariz:

asil.html :

<html>
<body bgcolor=black text=red>
<h2>
Bu sayfa 'WWW Sayfama Hos Geldiniz' yazisi icermemektedir :) <br>
<p>
...
...
vs.
</h2>
<hr>
<p><h5>
sayfayi en son 28 Subat 2000 tarihinde guncelledim.
</h5><br>
</body></html>

Biraz, zor ve yavas olsa da bu sekilde animasyonlar (canlandirma), TV yayinciligi (bir arkaplan programi ile surekli yeni resimler ve yeni bir index.html hazirlayarak), ve anlik bilgi sunumu ( borsa fiyatlari ) gerceklestirilebilir. Ama basit resim canlandirmalari icin sanirim 'animated gif' turu '.gif' dosyalari daha uygun duser.
2.2 Resimlerde 'MAP' kullanimi

Map'ler bir resmin degisik yerlerine tiklandiginda degisik baglarin yuklenmesi veya degisik bir cgi-bin isinin yapilmasi olarak tanimlanir.
Burada kullanacagimiz resmin '.gif' biciminde olmasi gereklidir. Sayfanin icinde bu resmi tanimladigimiz '<img ...' belirtecinin icine bir kac unsur daha ekleyerek ve bir de 'map' (harita) alaninin kisimlarini sekilleriyle birlikte tanimlayarak isimizi bitiririz.

. Resmin betimi:

<img src="filanca.gif" ISMAP usemap="#falanca" width=160 height=100>
ISMAP, resmin bir harita oldugunu.
usemap="..." hangi harita tanimini kullanmasi gerektigini, www gosterici programina soyluyor.

. Haritanin tanimi:

<map name="falanca">
<area shape="rect" coords"1,1,159,50" href="dikdortgen.html">
<area shape="circle" coords="80,100,40" href="daire.html">
<area shape="polyg" coords="10,110,150,110,80,190,9,110" href="ucgen.html">
<area shape="default" nohref>
</map>

name ile belirttigimiz isim '<img ..' icinde usemap="#..." ile kullandigimizin aynisi.
shape belirteci ile dikdortgen, daire, ya da poligon tanimlayabiliyoruz. Dikdortgenin koordinatlarini: X-sol_ust,Y-sol_ust,X-sag_alt,Y-sag_alt biciminde 'coords="..." ' kisminda belirtiyoruz. 'href="..." ' bolumu ise bu dikdortgen alana tiklanildiginda neyin yuklenmesi gerektigini soyluyor.

Cember icin X-merkez,Y-merkez,R-yaricap biciminde koordinat tanimliyoruz.
Poligonu tanimlarken sirayla ker bir kosenin X,Y biciminde koordinatlarini giriyoruz. Dikkat etmemiz gereken husus, poligonun noktalarini saat-yonunde tanimlamamiz gerektigidir. Ayrica poligonu kapamaya da tarayici programlar arasinda uyumsuzluk nedeniyle dikkat etmeliyiz. Yukaridaki ucgen ornegini incelemek aslinda poligon tanimi yapabilmek icin yeterli. Ucgen icin dort nokta kullandik (dorduncu ilkinin dibinde). Ayni zamanda bu ucgenin X,Y betimlemeleri de saat-yonunde girilmis (noktalari kagit uzerinde yaklasik olarak isaretlerseniz bu 'saat-yonu' kavramini daha iyi anlayabilirsiniz).
son olarak da '<area shape="default" nohref>' ile resmin diger bolgelerine tiklanildiginda hic bir sey yapilmamasi gerektigini soyluyoruz.
Evet bir 'map' tanimi icin gerekenler bu kadar.

2.3 Dinamik HTML

Asagidaki ornekte, mouse yazinin uzerine geldiginde, tiklamaksizin yazi degisir:

<h2 style="color:purple;" onmouseover="detay.style.display=''"
onmouseout="detay.style.display='none'">Flash Haber</h2>
<div id="detay" style="display:'none'; color:red;">

Son gelen haberlere gore, Yunanistan Turkiye'ye savas acti...
</div>
<font color=blue>Ayrintilar 19.30 Ana haber bulteninde</font>



 

devidoff

Katılımcı Üye
22 Ara 2006
458
14
Turquie
1. <HEAD> .......... </HEAD> Arasında Kullanılan Komutlar


<TITLE> .......... </TITLE> belirteç çifti: Bu belirteç çifti arasına browser' ın (listeleyici) başlık çubuğunda görülecek olan sayfanın başlığı yazılır.
<****> belirteci: Bu belirteç ile kullanılabilen birçok seçenek vardır. Örneğin bir kullanımı, bu belirteç ile sayfanızın içeriğini yansıtan bazı anahtar kelimeler ve tanımlamalar verilmesidir. Web üzerinde arama yapan arama motorları sayfaların **** belirteçlerine bakarak gruplandırma yaparlar. Bununla ilgili aşağıdaki örnekleri inceleyiniz.
<**** NAME="Description" CONTENT="HTML öğrenmek için yararlı bilgiler">
<**** NAME="Keywords" CONTENT="html, htm, web sayfası">
<**** NAME="Author" CONTENT="Ozge Donmezer">
Başka bir kullanım, sayfadaki yazıların hangi dil ailesine ait karakterlerle yazıldığını belirtmek içindir. Yine aşağıda bunula ilgili bir örnek verilmiştir.
<**** HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=iso-8858-9"> (Türkçe' nin dahil olduğu dil ailesine ait standard tanımlaması iso-8859-9' dur.)

2. <BODY> .......... </BODY> Arasında Kullanılan Komutlar


Her türlü yazı, formatlama bilgileri bu bölüme girdiğinden, bir HTML dökümanının esas kısmını da bu bölüm oluşturduğundan, bu bölümde oldukça fazla sayıda komuttan söz edilecektir. Bu komutlar belirli bir mantık sırasına göre verilecektir.
<BODY BGCOLOR=& TEXT=& LINK=& ALINK=& VLINK=&>
RRGGBB ile temsil edilen hexadecimal bir sayıdır. (R= Red, G= Green, B= Blue) Bu yöntem kullanılarak değişik renkler elde edilebilir. Pek tercih edilmemekle birlikte sayı yerine doğrudan renk isimleri de verilebilir (aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, white, yellow ). Bgcolor seçeneği, sayfanın zemininin, text, sayfa içindeki yazıların, link, bağlantı yazılarının, alink, aktif durumdaki bağlantı yazılarının, vlink, ziyaret edilmiş bağlantıların renklerini vermemiz için kullanılır.

Sayfanın zemin rengini tek renk vermek yerine, fona bir background resmi de koyabiliriz. <BODY BACKGROUND=”image_URL”
Sayfa kenarları ayarlamaları da aşağıdaki şekilde yapılır:
<BODY LEFTMARGIN=& TOPMARGIN=&>
& marjin miktarını temsil etmektedir. Leftmarjin seçeneği sol kenarı, Topmarjin üst kenarı ayarlamamızı sağlar.Bir döküman içerisindeki yazılardan istediğimiz kısmının font özelliklerini belirlemek için font belirteci değişik seçeneklerle kullanılır:
<FONT SIZE=&> Font büyüklüğü belirlenecek yazı </FONT>
1’ den 7’ ye kadar değişebilir. Sayıyı artırdıkça, belirteç çifti arasına yazdığımız yazının büyüklüğü de artar.
<FONT COLOR=&> Font rengi belirlenecek yazı </FONT>
& yerine yine altı basamaklı hexadecimal sayılar kullanarak ya da doğrudan renk ismini vererek, ayarlamamızı yaparız.
<FONT FACE=”&”> Karakter şekli belirlenecek yazi </FONT>
& yerine istedigimiz karakter tiplerinden birini yazabiliriz. (Örnegin; Times New Roman, Arial gibi…)
Döküman içindeki yazılardan istediğimiz bir kısmına kalın, italik, altı çizgili vb özellikleri verebiliriz:
<B> Kalın yapılacak yazı </B>
<I> İtalik yapılacak yazı </I>
<U> Altı çizili yapılacak yazı </U>
<SUP> Satırın biraz üst tarafında görünmesini istediğimiz yazı </SUP>
<SUB> Satırın biraz alt tarafında görünmesini istediğimiz yazı </SUB>
<STRIKE> Üstü çizili yapılacak yazı </STRIKE>
HTML dökümanımızda paragraf başı yapmak, sadece alt satıra geçmek ya da bir kısım yazıyı tek bir satırda yazmak istediğimiz zaman aşağıdaki balirteçleri kullanmalıyız. <P> …...Yeni bir paragraf yapmak istediğimiz zaman
kullandığımız bu belirteç, çiftiyle birlikte kullanılmaz. Okunabilirliği artırmak için, genelde satırın sonunda kullanılır. Bir satır boşluk bırakır.
<BR> …..Bir alt satıra geçmek için kullanılan bu belirtecin de çifti yoktur. Bu belirteç bir satır boşluk bırakmadan, bir alt satıra geçer.
<NOBR> Hep aynı satırda yer almasını istediğimiz yazı </NOBR> ….. Bu belirteç, çiftiyle birlikte kullanılır ve belirteç çifti arasına yazdığımız yazı, bir satırda görüntülenir.
Döküman içinde kullanacağımız başlık formatlarını ayarlamak için kullanacağımız belirteç ise aşağıda gösterilmiştir:
<H&> Başlık <H&> …..Bu belirteç çifti arasına da kullanacağımız başlığı yazarız. &, 1’ den 6’ ya kadar değişebilen bir sayıyı temsil eder. Sayı büyüdükçe, başlığın ebatları da küçülür.
Başlığı sağa, sola yaslamak ya da sayfanın tam ortasında bulunmasını sağlamak için <H&> belirteci ALIGN seçeneğiyle kullanılır.
<H& ALIGN=#> Sağa, sola ya da ortaya yaslayacağımız başlık </H>
& yerine 1’ den 6’ ya kadar bir sayı, # yerine de left, right ya da center gelmelidir.
Bir paragrafı olduğu gibi sağa, sola ya da ortaya yaslamak istedimiz zaman da <P> belirtecini çiftiyle beraber benzer şekilde ALIGN seçeneği ile kullanmalıyız.
<P ALIGN=#> Sağa, sola ya da ortaya yaslayacağımız paragraf </P>
# = left, right ya da center
Hazırladığımız dökümanda kullanmak istediğimiz özel karakter stilleri olabilir.Örneğin bir yerden alıntı yapmak istediğimizde, alıntı yaptığımız yazıların biraz eğik (italik gibi) görünmesini isteyebiliriz. Ya da bazı vurguladığımız kısımların daha çok göze çarpmasını isteyebiliriz. HTML’ de bu gibi özellikleri sağlayan belirteçler de vardır. Aşağıda bunlar verilecektir:
<EM> Önemli bir yazı </EM> …..Bu belirteç vurguyu belirtmek için kullanılır. (Dışarıya biraz eğik çıkar.)
<STRONG> Çok önemli bir yazı </STRONG> .…Bu belirteç çifti güçlü vurguyu belirtir. (Dışarıya biraz koyu çıkar.)
<CODE> Yazılar yazılar </CODE> …..Bu belirteç çifti yasa, kural belirten yazılar için kullanılır.
<SAMP> Örnek </SAMP> …..Örnek çıktı
<VAR> Değişken, emin değil </VAR> …..Değişken, karasız
<DFN> Tanımlama </DFN> …..Bu belirteç çifti tanımlama belirten yazılar için kullanılır. (Dışarıya hafif eğik çıkar.)
<CITE> Alıntı </CITE> …..Bu belirteç çifti alıntı yazılar için kullanılır.
<SMALL> Küçük yazı </SMALL> …..Bu belirteç çifti arasında yazılan yazılar dışarıya çok küçük çıkar.
<BIG> Büyük yazı </BIG> …..Bu belirteç çifti arasında yazılan yazılar dışarıya çok büyük çıkar.
<ADDRESS> Yazarın Adresi </ADDRESS> …..Bu format yazarın adresini yazmak içindir.
<BLOCKQUOTE> İçeriden başla </BLOCKQUOTE> …..Bu belirteç çifti arasına yazılan yazı sayfanın hem sağından hem solundan içeriye kayar.
<DIV ALIGN=LEFT|CENTER|RIGHT> Herhangi bir yazı ya da yazı grubu </DIV> …..Bu belirteç çifti herhangi bir yazı ya da yazı grubunun sağa, sola ya da ortaya yaslanmasını sağlar.
<CENTER> Ortalanacak yazı </CENTER> …..Bu belirteç çifti yazı ve resimleri sayfada ortalar .
<PRE> Formatlı metin </PRE> …..Bu belirteçler arasına yazılan her şey, yazıldığı gibi ekrana çıkar. Boşluklar, tab' lar, satır bölmeleri vb korunur.
<BLINK> Yanıp sönen yazı </BLINK> …..Bu belirteç çifti arasına yazılan yazılar dışarı çıktıklarında bir yanıp bir sönen şekilde görünürler.
Sayfamızda herhangi bir yere değişik boyutlarda çizgi çizmek isteyebiliriz.
Bunu <HR> belirteciyle yaparız. Boyutlarını ayarladığımız seçenekleriyle birlikte kullanımı aşağıdaki gibidir.
<HR SIZE=# WIDTH=# ALIGN=#> …..Çizginin uzunluğunu ayarlamak için kullandığımız WIDTH seçeneğini WIDTH=50% şeklinde de kullanabiliriz. Örneğin; bizim kullanımımız sayfanın %50’ si, yani yarısı uzunluğunda bir çizgi çizmek istediğimizi belirtir.
Sayfamızdan yapacağımız bağlantılara gelince; öncelikle Internet üzerindeki herhangi bir makinadaki bir dökümana bağlantı yapmaya bakalım:
<A HREF=”URL_adresi”> Buraya tıklayınız </A> …..Web sayfanızda “Buraya tıklayınız” yazısı çıkacaktır ve bu yazı bir link görünümünü almıştır. Üzerine tıkladığınızda yazdığınız URL adresine ulaşırsınız. URL adresi aşağıdaki gibidir.

<servis>://<adres>[:port_numarası]/<dizin>/dosya_adı
<servis> yerine webin dışında diğer internet servislerini sağlayan prottokolleri de yazabilirsiniz. Eğer, bulunduğunuz dizinde bir dökümana bağlantı yapmak istiyorsanız, sadece dökümanın adını yazmanız yeterlidir. Kendi makinanızda fakat başka bir dizin altındaki bir dökümana bağlantı yapmak için, dizin ismini ve döküman ismini yazmalısınız.
<A HREF=”fotograflarimuzgun.gif”> buraya tıklayınız </A>
Aynı dökümanın içinde bir yere bağlantı yapmak istiyorsak o zaman şöyle demeliyiz:
<A HREF=”#name”> buraya tıklayınız </A>
Gitmek istediğiniz yerin HTML kodunu ise şöyle yazmalısınız:
<A NAME=”name”></A> Buraya hoşgeldiniz.
“name” burada sizin tespit edeceğiniz herhangi bir isim olabilir. (Örneğin 1. Bölüme gitmek istiyorsanız, name yerine 1, aynı şekilde 1. Bölümün bulunduğu yere de name olarak 1 yazmalısınız.)
Başka bir dökümanın bir parçasına gitmek istiyorsanız, <A HREF=”URL#name”> hedef </A> yazmalısınız. Tabii gideceğiniz döküman parçasının başında da <A NAME=”name”></A> yazmalıdır.
HTML dökümanınız içinde bir resim dosyasını da bağlantı elemanı olarak kullanabilirsiniz. Örneğin;
Bana mail göndermek için zarfın üzerini tıklayın<A HREF=mailto:[email protected]><IMG SCR="envelope.gif"> </A> ……Bu dışarıya şöyle çıkar:
Bana mail göndermek için zarfın üzerini tıklayın ZARF RESMI
Eğer bağlantı yapılacak olan, bir dosyaysa, o dosyanın türü önemlidir. Dosyanın türü, Web sunucusu ve sizin Web istemciniz tarafından bilinen bir dosya türüyse (TXT, GIF, JPG, JPEG, PNG, XBM) bağlantı yazısının üzerine tıkladığınızda dosya açılır. Eğer ilgili dosya bilinmeyen bir dosya türüyse, o zaman bu bağlantı tıklandığında, web istemcisi o dosyayı "diske saklamak" ya da bir uygulama programıyla açmak şeklinde iki seçenek sunar. Bazı dosya tipleri ise, web istemcilerine yüklenen yardımcı "plug-in" ler ile işlenebilir. Bunlardan en popülerleri ses formatları (AU, WAV, MID); video formatları (RM, MOV, AVI) ve bazı özel tipte dosyalardır (AutoCAD çizim dosyaları gibi).
Kayan yazı görüntüsü elde edebilmek için kullanılacak olan belirteç çifti <marquee> ... </marquee> ‘dir.
<MARQUEE> Kayan yazı </MARQUEE> …..Bu belirteçler arasındaki yazı dışarıya kayan şekilde çıkar:
Bu belirteç çiftinin beraber kullanıldığı seçenekler aşağıda verilmiştir:
<MARQUEE SCROLLAMOUNT=#> Kayan yazı </MARQUEE> …..# burada kayma hızını belirten bir sayıdır.
<MARQUEE SCROLLDELAY=# SCROLLAMOUNT=#> Kayan yazı </MARQUEE> …..Scrolldelay seçeneği yazının hangi aralıklarla bekletileceğini belirten bir sayıdır.
Kayan yazının büyüklüğünü, genişliğini ayarlayabiliriz. Align seçeneği ise, top, middle ve bottom değerlerini alabilir.
<FONT SIZE=6>
<MARQUEE ALIGN=# WIDTH=#> Kayan yazı </MARQUEE>
</FONT>
Merhaba!
Kayan yazının arkaplan rengini bgcolor seçeneği ile aşağıdaki gibi verebiliriz.
<MARQUEE BGCOLOR=#>Kayan yazı </MARQUEE>
<height=# width=#> ANLAMLARINI
<hspace=# vspace=#> ANLAYAMADIM…
Listeler de incelenmesi gereken önemli bir konudur. Listeleri dört grupta inceleyebiliriz.
1- Sırasız (Unordered) Listeler: Bir seçenek belirtilmezse, siyah noktalı listeler oluşturur.
<UL>
<LI> Win 98
<LI> Win NT
</UL>
Win 98
Win NT
Fakat, siyah nokta yerine, içi boş daire ya da kare şekli çıkarmak ta mümkündür. Bunun için kullanılması gerekli seçenek TYPE seçeneğidir. TYPE seçeneğinin alabileceği değerler disc, circle ve square’ dir.
2- Sıralı (Ordered) Listeler: Bir seçenek belirtilmezse, 1, 2, 3 … numaralı listeler oluşturur.
<OL>
<LI> Win 98
<LI> Win NT
</OL>

Win98
WinNT
Burada da type seçeneğini kullanarak değişik sıralı listeler yaratmak mümkün olur.
<LI TYPE= #> # = A, a, I, i, 1
3-Açıklamalı Listeler:
<DL COMPACT>
<DT> Win98
<DD> Bir işletim sistemidir.
<DT> WinNT
<DD> Arayüzü Windows 95’ e çok benzeyen bir işletim sistemidir.
</DL>
Win98
Bir işletim sistemidir.

WinNT
Arayüzü Windows 95’ e çok benzeyen bir işletim sistemidir.
4-Içiçe Listeler:
Tüm liste çeşitleri, 3'den fazla bölüm kullanmadikça içiçe yazilabilir. Örnek olarak;
<UL>
<LI> Izmir’ deki üniversiteler
<UL>
<LI> Ege Üniversitesi
<LI> Dokuz Eylül Üniversitesi
</UL>
<LI> Ankara' nın belli başlı üniversiteleri
<UL>
<LI> Ankara
<LI> ODTÜ
</UL>
</UL>

Ekrandaki görüntüsü,
•İzmir’ deki üniversiteler
•Ege Üniversitesi
•Dokuz Eylül Üniversitesi
•Ankara'nın belli başlı üniversiteleri
•ANKARA
•ODTÜ
Web’ in ortak dili HTML kullanılarak hazırlanan sayfalarda, tablo ve form konuları da oldukça önmelidir. Fakat, burada amaç, tüm HTML komutlarını vermek değil, HTML dilinin temel mantığını anlatmak olduğu için, bu konulardan bahsedilmeyecektir.
 

devidoff

Katılımcı Üye
22 Ara 2006
458
14
Turquie
Sitenize resim eklemek için kullanacağınız kodlar :

<IMG SRC="27.jpg"> <IMG SRC="http://www.erayboztepe.bz.tc/images/27.jpg">


Sitenize Türkiye Haritası ekleyin

<p align="center"><a href="http://www.turkish-media.com/y_h/turk_map.htm"><img border="0" src="http://www.turkish-media.com/y_res/turkey.gif" width="113" height="50" alt="Türkiye Yol Haritasi"></a></p>



Sitenize güncel Tiyatro haberleri ekleyin

<!--webbot
bot="HTMLMarkup" startspan --><IFRAME SRC="http://www.tiyatrom.com/oyunlar.htm" width=180 height=250></IFRAME>
<!--webbot bot="HTMLMarkup" endspan -->



Sitenize tv de bugün ne olduğunu yayınlamak isterseniz , buyrun:

<SCRIPT LANGUAGE="JavaScript">
<!--
function openw(){
var anket=window.open("","tv_bugun","width=450,height=420,scrollbars=yes,menubar=no,res izable=yes");
}
//-->
</SCRIPT>
<form method="POST" action="http://webmasterim.com/tv_bugun/tv_bugun.php" target="tv_bugun">
<table border="0" cellpadding="0" cellspacing="0" style="border:dotted 2px silver;">
<tr>
<td bgcolor="#DCDCDC" align="center">
<font face="verdana" size="2" color="#000000"><b>TV'de Bugün</b></font></td>
</tr>
<tr>
<td bgcolor="#F5F5F5" align="center">
<SELECT name="chnl" style="font-family: Verdana; background-color:#F5F5F5; font-size:11px;">
<OPTION selected VALUE=****..:Kanallar:..</OPTION>
<OPTION VALUE="4">ATV</OPTION>
<OPTION VALUE="3">CNBC-E</OPTION>
<OPTION VALUE="2">CNN TURK</OPTION>
<OPTION VALUE="6">Discovery</OPTION>
<OPTION VALUE="13">FLASH TV</OPTION>
<OPTION VALUE="16">HABERTURK</OPTION>
<OPTION VALUE="26">Kanal 7</OPTION>
<OPTION VALUE="1">Kanal D</OPTION>
<OPTION VALUE="15">NTV</OPTION>
<OPTION VALUE="27">STV</OPTION>
<OPTION VALUE="7">SHOWTV</OPTION>
<OPTION VALUE="8">STAR</OPTION>
<OPTION VALUE="9">TGRT</OPTION>
<OPTION VALUE="10">TRT1</OPTION>
<OPTION VALUE="11">TRT2</OPTION>
<OPTION VALUE="12">TRT3</OPTION>
<OPTION VALUE="21">TV8</OPTION>
</SELECT>
</td>
</tr>
<tr>
<td bgcolor="#DCDCDC" align="center">
<input type="submit" value="Göster" style="font-family: Verdana; font-weight:bold; font-size:7pt; background-color:#DCDCDC;" onClick="openw();">
</td>
</tr>
</table>
<input type="hidden" name="site_ismi" value="eprem.sitemynet.com">
</form>
<script language="javascript" src="/mynet_sistem/hostingad.js"></script><script language="javascript" src="http://mysite.mynet.com/common/hostingad_1.js"></script>
 

devidoff

Katılımcı Üye
22 Ara 2006
458
14
Turquie
HTML’E GİRİŞ
HTML, HyperText Markup Language, browser‘lardan görebileceğimiz (İnternet Explorer,Netscape gibi) internet dökümanlarını yaratmaya yarayan bir işaretleme dilidir. İnternet üzerindeki tüm sayfaların kaynağı html’dir.Browser olmadan html kodları birşey ifade etmez.
HTML dökümanları herhangi bir yazı editörü ile düzenlenip *.htm, *.html, *.shtml gibi uzantılarla kaydedilir.Bunun için notepad, pico,wordpad gibi editörler yeterlidir.Bunların yanında Dreamweaver,Homesite gibi bu iş için hazırlanmış ve kodlamayı kolaylaştıran programlar da vardır.
Her html dökümanı <html> ile başlar ve </html> ile biter.<> şeklinde görülen komutlara etiket (tag) adı verilir.İki ana kısımdan oluşmaktadır: <head>…</head> ve <body>…</body>. head’ın içine <title>…</title> etiketi gömülür.title, browser’ımızın en üstünde yazan açıklamayı içerir.
title’dan sonra head kapatılır ve ana kısım olan body’ ye geçilir.Sayfamızda görüntülemek istediğimiz herşeyi body içine gömeriz.

Örnek:
img_html_hello.gif

Örneği göster(flash)
Herhangi bir web sayfasının html kodunu görmek istediğimiz zaman,mouse’ın sağ tuşuna tıklayıp view source/kaynağı görüntüle seçeneğini seçeriz.
METİNLER:

Başlıklar:
6 çeşit başlık vardır:<h1>,<h2>,…<h6>.Bunlardan en büyüğü <h1>,en küçüğü ise <h6>’dır.
<h1>H1 ile yapılan başlık</h1>
<h2>H2 ile yapılan başlık</h2>
<h3>H3 ile yapılan başlık</h3>
<h4>H4 ile yapılan başlık</h4>
<h5>H5 ile yapılan başlık</h5>
<h6>H6 ile yapılan başlık</h6>
H1 ile yapılan başlık

H2 ile yapılan başlık

H3 ile yapılan başlık

H4 ile yapılan başlık

H5 ile yapılan başlık

H6 ile yapılan başlık


Fontlar ve Metin Biçimleme:
<font color=”red” face=”arial” size=”3″>
Color, yazı karakterinin rengini,face yazı tipini (arial,verdana,tahoma gibi), size da boyutunu belirler. Size özniteliğinde kullanılan rakam 1′den 7′ye kadardır.
<b>…</b>: koyu renk yazı(bold)
<i>…</i> : italik
<p>…</p> : paragraf
<u>…</u> : alt çizgi (underline)
<center>…</center> : metni ortalar
<br> : satır atlama
<hr> : yatay çizgi (horizontal rule)
Not: Metin biçimlerken başladığınız etiketi kapatmayı unutmayın.

Renkler :
HTML dökümanlarında renkler ya İngilizce isimleriyle,ya da “hexadecimal” değerleriyle belirtilir.En sık kullanılan ve hemen hemen bütün browser’ların desteklediği 16 renkler aşağıdakilerdir:
RenkRenk adı:RenkRenk adı: aqua black blue fuchsia gray green lime maroon navy olive purple red silver teal white yellow
Renklerin hex-code‘larını pek çok ilgili siteden bulabilirsiniz.Mesela:
http://programci.wordpress.com/2006/10/02/html-dekullanilan-renk-kodlari/ Örnek :
<body bgcolor=”green”>
Bu örnekte artalan yeşile döner.
<body bgcolor=”#008000″> aynı sonucu verir.
Örnek :
<font color=”#4B0082″> => Font rengi “indigo” oldu.
LİNKLER:

Linkler <a>…</a> etiketi içinde, href=”" komutuyla belirtilir.
Örnek:
<a href=”http://www.metu.edu.tr” target=”_blank”>ODTÜ Ana Sayfası</a>
ODTÜ Ana Sayfası
Bu örnekte bir de target özniteliği verilmiştir.Adresi verilen web sayfasının başka bir pencerede açılmasını isterseniz target=”_blank” komutunu eklemeniz gerekir.Aynı pencerede açılmasını isterseniz de target=”_top” olmalıdır,ya da hiç belirtmezseniz de olur.
<a href=”http://www.metu.edu.tr” target=”_blank”>ODTÜ Ana Sayfası</a>
ODTÜ Ana Sayfası
Eğer hazırladığınız dökümanlar arasında bir bağlantı kurmak istiyorsanız,<a> etiketini aşağıdaki gibi kullanmalısınız.
<a href=”dosyaadi.html”>Önceki sayfa</a>
Bir mail adresine link vermek istiyorsanız:
<a href=”mailto:gokcet
img_et.gif
metu.edu.tr”>Mail atmak için tıklayın.</a>

[EMAIL="[email protected]
 

devidoff

Katılımcı Üye
22 Ara 2006
458
14
Turquie
Web sitesi hazırlamak için yasal olmayan bir yazılımı kullanmak yerine ücretsiz olan ve açık kaynak kodlu NVU’yu kullanabilirsiniz. Başarılı bir editör.
Boyutu: 6.57 Mb
Lisans: Ücretsiz
Sistem: Win9x / Me / 2000 / XP






nvubv4.jpg








 

devidoff

Katılımcı Üye
22 Ara 2006
458
14
Turquie
Tüm HTML Kodları Açıklamaları , Kullanım Şekilleri vs...

Tüm World Wide Web dokümanları HTML adı da verilen Hypertext Markup Language kullanılarak yaratılmıştır. Bu dil, bir dokümanı gizli etiketlerle işaretleyerek Web dokümanları yaratmanızı sağlar. Bu HTML etiketleri, bir Web dokümanının sunumunu, yapısını, etkileşimini belirler; bunlar < ve > karakterleriyle çevrilmiştir. Bunun bazı örnekleri paragraflar için <P> etiketi, satır kesmesi için <BR> etiketi ve resimler için <IMG> etiketi olabilir.
Bir Web dokümanını tarayıcınıza yüklerken bu etiketlerin hiçbirini görmemenize karşın, bunların doküman üzerinde yarattıkları etkilerin tümünü görebilirsiniz.
Muhtemelen çoğu zaman, herhangi bir HTML editörü kullanırken Web sayfalarınız bu HTML etiketlerine hiç bakmadan yaratacaksınız. Çoğu kişi, HTML'i geri planda kullanarak, dilin karmaşık kısımlarını gizleyen HTML editörleri ile çalışmanın daha kolay olduğunu düşünüyor. Ama hangi editörü kullanırsanız kullanın sonuçta kaynak koda bir göz attığınızı fark edeceksiniz. Yani profesyonelleşme yolunda ilerlemek istiyorsanız eninde sonunda HTML kodlamasına girmeniz gerekecek.
Bu yazımızda, bir Web sayfasında karşınıza çıkabilecek tüm HTML etiketlerinin amacını ve işlevini bulacaksınız. Bu, World Wide Web Consortium'un tanımladığı en güncel sürüm olan HTML 4.0'ı kapsıyor.
HTML 4.0'daki etiketlerin çoğu aynı niteliklere (attribute) sahiptir. Aşağıdaki listede bunların en sık kullanılanlarını görüyorsunuz:
  • accesskey="karakter": Form denetimlerinde ve <a> (anchor) etiketlerinde, doküman öğesine erişim için kullanılabilen tek karakter.
  • align="metin": Bir dokümanın bir kısmındaki bilginin hizalanması.
  • alt="metin": Resimleri, formları, nesneleri ve bir dokümanın diğer kısımlarını tanımlayan alternatif metin.
  • char="karakter": Bir tablonun içeriği hizalanırken, bir hizalama ekseni olarak davranan karakter.
  • charoff="sayı": Tablo içeriğini hizalarken, eksen karakterinden itibaren bırakılacak boşluk sayısı.
  • class="metin": Doküman öğesine atanmak üzere birbirinden boşluklarla ayrılmış bir veya daha fazla sınıf ismi.
  • dir="metin": Metin ve tabloların doğrultusu: "ltr" (left-to-right, yani soldan sağa) veya "rtl" (right-to-left, yani sağdan sola).
  • disabled: Bir form üzerindeki denetimi kullanıcı girdisini idare edemeyeceği şekilde iptal eden bir nitelik.
  • id="metin": Doküman öğesine verilecek isim.
  • lang="metin": Bir doküman öğesinin niteliklerinde ve içerdiği metinde kullanılan dil.
  • name="metin": Doküman öğesi için bir isim.
  • onblur="script": Bir doküman öğesi kullanıcı girişi odağını yitirdiğinde olan bir olay.
  • onchange="script": Bir doküman kullanıcı girişi odağını yitirdiğinde ve değeri odaktayken değiştirilen bir doküman öğesi.
  • onclick="script": Kullanıcı doküman öğesine fareyle tıkladığında olan bir olay.
  • ondblclick="script": Kullanıcı doküman öğesi üzerine fareyle çift tıkladığında olan bir olay.
  • onfocus="script": Bir doküman öğesi, kullanıcı girişi odağını aldığında olan bir olay.
  • onkeydown="script": Bir tuş basıldığında olan bir olay.
  • onkeypress="script": Bir tuşa basılıp bırakıldığında olan bir olay.
  • onkeyup="script": Bir tuş bırakıldığında olan bir olay.
  • onload="script": Tüm doküman veya bir frameset'teki tüm çerçeveler yüklendiğinde olan bir olay.
  • onmousedown="script": Fare doküman öğesi üzerindeyken fareyle tıkladığında olan bir olay.
  • onmouseout="script": Fare, bir doküman öğesi üzerindeyken o öğeden uzaklaşırken olan bir olay.
  • onmouseover="script": Fare imleci bir doküman öğesi üzerine getirildiğinde olan bir olay.
  • onmousemove="script": Fare imleci bir doküman öğesi üzerindeyken hareket ettirildiğinde olan bir olay.
  • onmouseup="script": İmleç bir doküman öğesi üzerindeyken kullanıcı fare öğesini bıraktığında olan bir olay.
  • onreset="script": Bir formdaki tüm kontroller resetlendiğinde olan bir olay.
  • onselect="script": Bir metin işleme kullanıcı kontrolü seçildiğinde olan bir olay.
  • onunload="script": Bir doküman bir pencere veya çerçeveden atıldığında olan bir olay.
  • readonly: Bir form kontrolündeki bir değerin değiştirilemeyeceğini belirten bir nitelik.
  • style="metin": Bu bağımsız doküman öğesi için stil bilgisi.
  • tabindex="sayı": Doküman öğesinin sekme sırasındaki konum.
  • target="metin": Bir dokümanın içinde açılması gereken çerçevenin adı.
  • title="metin": Bir doküman öğesi hakkında açıklayıcı metin.
  • usemap="URI": Bir imagemap'in doküman öğesiyle ilişkilendirilecek URI'si, bunun mevcut <MAP> öğesinin name niteliğine uyması gerekir.
  • valign="metin": Tablo hücreleri içindeki bilginin dikey hizalaması.
Etiketler

Bu bölümde, HTML'nin 4.0 versiyonunun bir parçası olan etiketlerin açıklamalarını göreceksiniz. Burada etiketlerin listelenmesinde büyük harfler kullanılmaktadır. Geleneksel olarak, bu etiketlerin büyük veya küçük harfle yazılması önemli değil, ancak W3C'nin gelecekteki tanımlarında etiketlerin çoğunda sadece küçük harflerin kullanılması gerekebilir (<!DOCTYPE> burada gördüğünüz tek istisna). Yani, HTML kodlarken, etiketleri küçük harflerle yazmalı veya kendinizi bunları birkaç yıl içinde değiştirmeye hazırlamalısınız.
<!DOCTYPE…>

  • Amacı: Bu etiket bir dokümanın ilk satırı olarak görülür ve kullanılan HTML versiyonunu belirtir.
  • Başlangıç Etiketi: Gerekli
  • Bitiş Etiketi: İzin verilmez
  • Nitelikler: Yok
  • Eski Nitelikler: Yok
  • Diğer Nitelikler: Yok
Aşağıdaki örnekte üç <!DOCTYPE> etiketi kullanılmaktadır:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN" "http://www.w3.org/TR/REC-html40/strict.dtd">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/REC-html40/loose.dtd">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Frameset//EN" "http://www.w3.org/TR/REC-html40/frameset.dtd">
Bu etiketlerin her biri, bir URI içerir. Bu URI'lerin dosya adları sırasıyla strict.dtd, loose.dtd ve frameset.dtd. Bu isimler, dokümandaki HTML desteğinin seviyesini aşağıdaki şekilde tanımlar:
  • Strict: Doküman eski hiçbir şeyi ve çerçeveleri kullanmaz.
  • Loose: Doküman, dilin görsel sunumla ilgili bazı eski öğelerini kullanır.
  • Frameset: Doküman, bir önceki düzeydekiyle aynı eski öğeleri kullanır ve ayrıca çerçeveler içerir.
İdeal olarak, Strict <!DOCTYPE>'ın kullanılması gerekir, çünkü bu HTML 4.0'la tam olarak uyumludur. Loose <!DOCTYPE> kullanmanın tek nedeni, Style Sheet'ler gibi sunuyla ilgili bazı HTML 4.0 öğelerinin henüz Web tarayıcısı geliştiricileri tarafından tam olarak desteklenmemesidir.
<A>

  • Amacı: Bu etiket bir yer imini (anchor) gösterir: Bu, World Wide Web'deki başka bir kaynakla ilişkili bir doküman parçasıdır. Bu aynı dokümanın iki kısmı arasında bir ilişki yaratmak için de kullanılabilir.
  • Başlangıç Etiketi: Gerekli
  • Bitiş Etiketi: Gerekli

  • Özel Nitelikler:
    • <LI type=square>coords="metin": Bir imagemap alanının yer imiyle (anchor) ilişkili geometrik şeklinin koordinatları.
    • name="metin": Yer iminin ismi.
    • href="URI": URI'i tarafından belirtilen, yer iminin ilişkilendirilmesi gereken Web üzerindeki bir kaynak.
    • hreflang="metin": Bir href niteliği tarafından belirtilen kaynağın dili.
    • type="isim": Web üzerinde ilişkili kaynağın içerik tipi.
    • rel="bağ_tipi": Geçerli dokümanın Web üzerindeki ilişkili kaynakla ilişkisinin tipi.
    • rev="bağ_tipi": Web üzerindeki ilişkili kaynağın geçerli dokümanla ilişkisi.
    • shape="metin": Yer imiyle ilişkili bir imagemap alanının geometrik şekli.
    • charset="metin": Web üzerindeki ilişkili kaynağın karakter kümesi
  • Eski Nitelikler: Yok
  • Diğer Nitelikler: accesskey, class, dir, id, lang, onblur, onclick, ondblclick, onfocus, onkeydown, onkeypress, onkeyup, onmousedown, onmousemove, onmouseout, onmouseover, onmouseup, style, tabindex, target, title
<ABBR>…</ABBR>

  • Amacı: Bu etiketin içinde kısaltma olan bir metin yer alır.
  • Başlangıç Etiketi: Gerekli
  • Bitiş Etiketi: Gerekli
  • Özel Nitelikler: Yok
  • Eski Nitelikler: Yok
  • Diğer Nitelikler: class, dir, id, lang, onclick, ondblclick, onkeydown, onkeypress, onkeyup, onmousedown, onmousemove, onmouseout, onmouseover, onmouseup, style, title
<ACRONYM>…</ACRONYM>

  • Amacı: Bu etiketin içinde sözcüklerin baş harflerinden oluşan bir kısaltma yer alır.
  • Başlangıç Etiketi: Gerekli
  • Bitiş Etiketi: Gerekli
  • Özel Nitelikler: Yok
  • Eski Nitelikler: Yok
  • Diğer Nitelikler: class, dir, id, lang, onclick, ondblclick, onkeydown, onkeypress, onkeyup, onmousedown, onmousemove, onmouseout, onmouseover, onmouseup, style, title
<ADDRESS>…</ADDRESS>

  • Amacı: Bu etiket, tüm dokümanın veya dokümanın belirli bir kısmının yazarının irtibat bilgilerini içerir. Web tarayıcılarının çoğu, bu bilgiyi diğer yazılardan farklı bir tarzda gösterir.
  • Başlangıç Etiketi: Gerekli
  • Bitiş Etiketi: Gerekli
  • Özel Nitelikler: Yok
  • Eski Nitelikler: Yok
  • Diğer Nitelikler: class, dir, id, lang, onclick, ondblclick, onkeydown, onkeypress, onkeyup, onmousedown, onmousemove, onmouseout, onmouseover, onmouseup
<APPLET>

Bu etiket artık kullanılmamaktadır. Günümüzde tarayıcıların çoğu Java applet'leri için <OBJECT> etiketini destekler. Java Plug-In'i durumunda, diğer plug-in'lerde olduğu gibi <EMBED> etiketi kullanılabilir.
<AREA>

  • Amacı: Bu etiket, bir imagemap üzerinde bir bağla ilişkilendirilmesi gereken bir alanı belirtir.
  • Başlangıç Etiketi: Gerekli
  • Bitiş Etiketi: İzin verilmez

  • Özel Nitelikler:
    • <LI type=square>href="URI": Imagemap'in ilişkilendirilmesi gereken bir URI.
    • shape="metin": Alanın geometrik şekli
    • coords="metin": Geometrik şeklin koordinatları
    • nohref: Bu nitelik alanın kendisiyle ilişkili bir bağlantıya sahip olmadığını belirtir.
  • Eski Nitelikler: Yok
  • Diğer Nitelikler: accesskey, alt, class, dir, id, lang, name, onblur, onclick, ondblclick, onfocus, onkeydown, onkeypress, onkeyup, onmousedown, onmousemove, onmouseout, onmouseover, onmouseup, style, tabindex, target, title
<B>…</B>

  • Amacı: Bu etiket, koyu gösterilmesi gereken metni içerir. Bu etiket eskimiş değildir, ancak HTML 4.0 tanımlarında daha iyi bir alternatif olarak Style Sheet kullanımı tavsiye edilmektedir.
  • Başlangıç Etiketi: Gerekli
  • Bitiş Etiketi: Gerekli
  • Özel Nitelikler: Yok
  • Eski Nitelikler: Yok
  • Diğer Nitelikler: class, dir, id, lang, onclick, ondblclick, onkeydown, onkeypress, onkeyup, onmousedown, onmousemove, onmouseout, onmouseover, onmouseup, style, title
<BASE>

  • Amacı: Bu etiket, dokümanın temel URI'sini açık olarak tanımlamakta kullanılır. Temel URI, dokümandaki tüm izafi URI'lerle bir arada kullanılarak Web üzerindeki bir kaynağı tam adresi oluşturulur.
  • Başlangıç Etiketi: Gerekli
  • Bitiş Etiketi: İzin verilmez

  • Özel Nitelikler:
    • href="URI": Dokümanın temel URI'si.
  • Eski Nitelikler: Yok
  • Diğer Nitelikler: target
<BASEFONT>…</BASEFONT>

Bu etiket artık kullanılmamaktadır.
<BIG>…</BIG>

  • Amacı: Bu etiket, normal yazı tipine göre daha büyük gösterilmesi gereken metni içerir. Hâlâ kullanılmaktadır, ancak HTML 4.0 tanımında daha iyi bir alternatif olarak Style Sheet kullanımı önerilmektedir.
  • Başlangıç Etiketi: Gerekli
  • Bitiş Etiketi: Gerekli
  • Özel Nitelikler: Yok
  • Eski Nitelikler: Yok
  • Diğer Nitelikler: class, dir, id, lang, onclick, ondblclick, onkeydown, onkeypress, onkeyup, onmousedown, onmousemove, onmouseout, onmouseover, onmouseup, style, title
<BLOCKQUOTE>…</BLOCKQUOTE>

  • Amacı: Bu etiket, doküman görüntülenirken kendi paragrafında görünmesi gereken bir alıntı metin bloğunu içerir. Daha kısa alıntılar <Q> etiketinin içinde kullanılabilir.
  • Başlangıç Etiketi: Gerekli
  • Bitiş Etiketi: Gerekli

  • Özel Nitelikler:
    • cite="URI": Alıntının kaynağı hakkında bilgi içeren bir dokümanın adresi.
  • Eski Nitelikler: Yok
  • Diğer Nitelikler: class, dir, id, lang, onclick, ondblclick, onkeydown, onkeypress, onkeyup, onmousedown, onmousemove, onmouseout, onmouseover, onmouseup, style, title
<BLOCKQUOTE> etiketi, bir alıntı söz konusu olmasa da, bir metin bloğuna girinti vermek için yaygın olarak kullanılmaktadır. Bu kullanım tarzı, HTML 4.0 ile eskimiştir ve aynı etkinin sağlanması için Style Sheet kullanımı önerilir.
<BODY>…</BODY>

  • Amacı: Bu etiket, doküman Web tarayıcısı gibi bir program tarafından yüklendiğinde görünmesi gereken doküman içeriğini içerir. Pek çok sunu niteliği artık kullanılmamakta, aynı iş için <STYLE> etiketi kullanılmaktadır.
  • Başlangıç Etiketi: Seçime bağlı
  • Bitiş Etiketi: Seçime bağlı
  • Özel Nitelikler: Yok
  • Eski Nitelikler: alink, background, bgcolor, link, text, vlink
  • Diğer Nitelikler: class, dir, id, lang, onclick, ondblclick, onkeydown, onkeyup, onkeypress, onload, onmousedown, onmousemove, onmouseout, onmouseover, onmouseup, onunload, style, title
<BR>

  • Amacı: Bu etiketi, bir dokümana boş bir satır ekleyerek, izleyen metnin ve diğer öğelerin yeni bir satırda gösterilmesini sağlar.
  • Başlangıç Etiketi: Gerekli
  • Bitiş Etiketi: İzin verilmez
  • Özel Nitelikler: Yok
  • Eski Nitelikler: clear
  • Diğer Nitelikler: class, id, style, title
<BUTTON>…</BUTTON>

  • Amacı: Bu etiket bir forma bir düğme kontrolü ekler.
  • Başlangıç Etiketi: Gerekli
  • Bitiş Etiketi: Gerekli

  • Özel Nitelikler:
    • <LI type=square>name="metin": Düğmenin adı
    • value="metin": Düğmenin ilk değeri
    • type="metin": Forma eklenecek düğmenin tipi
  • Eski Nitelikler: Yok
  • Diğer Nitelikler: accesskey, class, dir, disabled, id, lang, onblur, onclick, ondblclick, onfocus, onkeydown, onkeyup, onkeypress, onmousedown, onmousemove, onmouseout, onmouseover, onmouseup, style, tabindex, title
<CAPTION>…</CAPTION>

  • Amacı: Bu etiket, bir tablonun kısa bir tanımını içerir. <CAPTION> etiketinin bir <TABLE> etiketinden hemen sonra gelmesi gerekir. Bir tablo sadece bir tek kısa tanıma sahip olabilir.
  • Başlangıç Etiketi: Gerekli
  • Bitiş Etiketi: Gerekli
  • Özel Nitelikler: Yok
  • Eski Nitelikler: align
  • Diğer Nitelikler: class, dir, id, lang, onclick, ondblclick, onkeydown, onkeyup, onkeypress, onload, onmousedown, onmousemove, onmouseout, onmouseover, onmouseup, onunload, style, title
<CENTER>…</CENTER>

Bu etiket artık kullanılmamaktadır.
<CITE>…</CITE>

  • Amacı: Bu etiket, bir iktibası veya benzer türde başka bir kaynağa referansı içerir.
  • Başlangıç Etiketi: Gerekli
  • Bitiş Etiketi: Gerekli
  • Özel Nitelikler: Yok
  • Eski Nitelikler: Yok
  • Diğer Nitelikler: class, dir, id, lang, onclick, ondblclick, onkeydown, onkeypress, onkeyup, onmousedown, onmousemove, onmouseout, onmouseover, onmouseup, style, title
<CODE>…</CODE>

  • Amacı: Bu etiket, bir bilgisayar programlama dilindeki kaynak kodu veya benzer bilgiyi gösteren metni içerir.
  • Başlangıç Etiketi: Gerekli
  • Bitiş Etiketi: Gerekli
  • Özel Nitelikler: Yok
  • Eski Nitelikler: Yok
  • Diğer Nitelikler: class, dir, id, lang, onclick, ondblclick, onkeydown, onkeypress, onkeyup, onmousedown, onmousemove, onmouseout, onmouseover, onmouseup, style, title
<COL>…</COL>

  • Amacı: Bu etiket, bir tablonun yapılandırılması için bir sütununu içerir.
  • Başlangıç Etiketi: Gerekli
  • Bitiş Etiketi: İzin verilmez

  • Özel Nitelikler:
    • <LI type=square>span="sayı": Sütun grubundaki sütun sayısı.
    • width="sayı": Sütun grubundaki sütunların varsayılan genişliği.
  • Eski Nitelikler: Yok
  • Diğer Nitelikler: align, char, charoff, class, dir, id, lang, onclick, ondblclick, onkeydown, onkeypress, onkeyup, onmousedown, onmousemove, onmouseout, onmouseover, onmouseup, style, title, valign
<COLGROUP>…</COLGROUP>

  • Amacı: Bu etiket, bir tablodaki bir sütun grubunu aynı anda yapılandırmak üzere kapsar.
  • Başlangıç Etiketi: Gerekli
  • Bitiş Etiketi: Seçime bağlı

  • Özel Nitelikler:
    • <LI type=square>span="sayı": Sütun grubundaki sütun sayısı.
    • width="sayı": Sütun grubundaki sütunların varsayılan genişliği.
  • Eski Nitelikler: Yok
  • Diğer Nitelikler: align, char, charoff, class, dir, id, lang, onclick, ondblclick, onkeydown, onkeypress, onkeyup, onmousedown, onmousemove, onmouseout, onmouseover, onmouseup, style, title, valign
<DEL>…</DEL>

  • Amacı: Bu etiket, dokümanın eski düzenlemelerinden sonra silinen bir kısmını içerir. Bu etiketin içindeki metin genellikle üstü çizili karakterlerle gösterilir.
  • Başlangıç Etiketi: Gerekli
  • Bitiş Etiketi: Gerekli

  • Özel Nitelikler:
    • <LI type=square>cite="URI": Eklenen kısım hakkında bilgi içeren bir dokümanın adresi.
    • datetime="date_and_time": Eklemenin yapıldığı tarih ve saat.
  • Diğer Nitelikler: class, dir, id, lang, onclick, ondblclick, onkeydown,onkeypress, onkeyup, onmousedown, onmousemove, onmouseout, onmouseover, onmouseup, style, title
<DD>…</DD>

  • Amacı: Bu etiket, bir terimin tanımını sağlayan bir metin bloğunu içerir. Bu etiketin kendisi de bir <DD> etiketinin içinde yer alır. Bir tanım ve terim listesi, bir <DL> etiketinin içinde bulunur.
  • Başlangıç Etiketi: Gerekli
  • Bitiş Etiketi: Seçime bağlı
  • Özel Nitelikler: class, dir, id, lang, onclick, ondblclick, onkeydown, onkeypress, onkeyup, onmousedown, onmousemove, onmouseout, onmouseover, onmouseup, style, title
<DFN>…</DFN>

  • Amacı: Bu etiket, bir tanım ya da tanımlanan bir şey olan metni içerir.
  • Başlangıç Etiketi: Gerekli
  • Bitiş Etiketi: Gerekli
  • Özel Nitelikler: Yok
  • Eski Nitelikler: Yok
  • Diğer Nitelikler: class, dir, id, lang, onclick, ondblclick, onkeydown, onkeyup, onmousedown, onmousemove, onmouseout, onmouseover, onmouseup, style, title
<DIR>…</DIR>

Bu etiket artık kullanılmamaktadır.
<DIV>…</DIV>

  • Amacı: Bu etiket, bir doküman parçasını kendi bloğunda içerir. İçeriği organize etmek için bir iç metod olarak kullanılır ve kısmın sunumunu değiştiren niteliklerle kullanılabilir.
  • Başlangıç Etiketi: Gerekli
  • Bitiş Etiketi: Gerekli
  • Özel Nitelikler: Yok
  • Eski Nitelikler: align
  • Diğer Nitelikler: class, dir, id, lang, onclick, ondblclick, onkeydown, onkeypress, onkeyup, onmousedown, onmousemove, onmouseout, onmouseover, onmouseup, style, title
<DL>…</DL>

  • Amacı: Bu etiket bir terim listesini ve tanımlarını içerir. Terimler ve tanımlar sırasıyla <DT> ve <DD> etiketleri arasında verilir.
  • Başlangıç Etiketi: Gerekli
  • Bitiş Etiketi: Gerekli
  • Özel Nitelikler: class, dir, id, lang, onclick, ondblclick, onkeydown, onkeypress, onkeyup, onmousedown, onmousemove, onmouseout, onmouseover, onmouseup, style, title
<DT>…</DT>

  • Amacı: <DT>, bir tanım tipi listesinde bir metin bloğunu bir tek terim olarak tanımlar. Terim ve tanımların toplamı, bir <DL> etiketinin içinde yer alır.
  • Başlangıç Etiketi: Gerekli
  • Bitiş Etiketi: Seçime bağlı
  • Özel Nitelikler: class, dir, id, lang, onclick, ondblclick, onkeydown, onkeypress, onkeyup, onmousedown, onmousemove, onmouseout, onmouseover, onmouseup, style, title
<EM>…</EM>

  • Amacı: Bu etiket, özel vurgu gerektiren metni içerir. Web tarayıcılarının çoğu, bu metni italik gösterir. Daha güçlü vurgu için <STRONG> etiketini kullanın.
  • Başlangıç Etiketi: Gerekli
  • Bitiş Etiketi: Gerekli
  • Özel Nitelikler: Yok
  • Eski Nitelikler: Yok
  • Diğer Nitelikler: class, dir, id, lang, onclick, ondblclick, onkeydown, onkeypress, onkeyup, onmousedown, onmousemove, onmouseout, onmouseover, onmouseup, style, title
<FIELDSET>…</FIELDSET>

  • Amacı: Bu etiket, bir form üzerinde bir grup ilgili kontrolü içerir.
  • Başlangıç Etiketi: Gerekli
  • Bitiş Etiketi: Gerekli
  • Özel Nitelikler: Yok
  • Eski Nitelikler: align
  • Diğer Nitelikler: accesskey, class, dir, id, lang, onclick, ondblclick, onkeydown, onkeypress, onkeyup, onmousedown, onmousemove, onmouseout, onmouseover, onmouseup, style, title
<FONT>…</FONT>

Bu etiket artık kullanılmamaktadır.
<FORM>…</FORM>

  • Amacı: Bu etiket, dokümanı izleyen kişinin bilgi girdiği bir grup ilgili kontrolü içerir.
  • Başlangıç Etiketi: Gerekli
  • Bitiş Etiketi: Gerekli

  • Özel Nitelikler:
    • <LI type=square>action="URI": Formun sonuçlarını alacak ve işleyecek URI.
    • method="metin": Form sonuçlarının iletilmesinde kullanılacak metod.
    • enctype="metin": Form sonuçlarının iletilmesinde kullanılan içerik tipi.
    • accept-charset="metin": Form sonuçlarında kabul edilmesi gereken, birbirinden virgülle ayrılmış bir veya daha fazla karakter grubu.
    • accept="metin": Formu kullanarak başarıyla aktarılabilen, birbirinden virgülle ayrılmış bir veya daha fazla içerik tipi.
  • Eski Nitelikler: Yok
  • Diğer Nitelikler: class, dir, id, lang, onclick, ondblclick, onkeydown, onkeypress, onkeyup, onmousedown, onmousemove, onmouseout, onmouseover, onmouseup, onreset, onsubmit, style, target, title
<FRAME>…</FRAME>

  • Amacı: Bu etiket, bir çerçeveyi içerir ve görünüşünü ayarlar.
  • Başlangıç Etiketi: Gerekli
  • Bitiş Etiketi: İzin verilmez

  • Özel Nitelikler:
    • <LI type=square>name="metin": Çerçevenin ismi.
    • longdesc="URI": Çerçevenin uzun tanımını içeren bir dokümanın URI'si.
    • src="URI": Çerçevenin içeriğini içeren bir dokümanın URI'si.
    • noresize: Çerçevenin boyunun değiştirilemeyeceğini belirten bir nitelik.
    • scrolling="metin": Çerçevede kaydırmanın nasıl gerçekleşeceği.
    • frameborder="sayı": Çerçeve etrafında bir çerçevenin olup olmayacağı.
    • marginwidth="sayı": Çerçevenin içeriği ile sol ve sağ kenarları arasındaki boşluk.
    • marginheight="sayı": Çerçevenin içeriği ile üst ve alt kenarları arasındaki boşluk.
  • Eski Nitelikler: Yok
  • Diğer Nitelikler: class, id, style, target, title
<FRAMESET>…</FRAMESET>

  • Amacı: Bu etiket, bir dokümandaki çerçevelerin düzeni için gereken bilgiyi içerir. <BODY> etiketi yerine kullanılır ve dokümanın başlık kısmından hemen sonra gelmelidir.
  • Başlangıç Etiketi: Gerekli
  • Bitiş Etiketi: Gerekli

  • Özel Nitelikler:
    • <LI type=square>rows="liste": Frameset'teki her dikey çerçevenin yüksekliği, değerleri virgülle ayrılır.
    • cols="liste": Frameset'teki her yatay çerçevenin genişliği, değerler birbirinden virgülle ayrılır.
  • Eski Nitelikler: Yok
  • Diğer Nitelikler: class, id, onload, onunload, style, title
<HEAD>…</HEAD>

  • Amacı: Bu etiket, bir dokümanı tanımlayan başlık bilgisini içerir, örneğin başlığı ve içeriğinin tanımı gibi. Bu etiketin içindeki bilgi, sayfa bir tarayıcıda izlenirken gösterilmez.
  • Başlangıç Etiketi: Seçime bağlı
  • Bitiş Etiketi: Seçime bağlı

  • Özel Nitelikler:
    • profile="URL": Başlıkta tanımlanabilecek ****-bilgi hakkında bilgi içeren bir dokümanın adresi.
  • Eski Nitelikler: Yok
  • Diğer Nitelikler: lang, dir
<H1>…</H1>, <H2>…</H2>, <H3>…</H3>, <H4>…</H4>, <H5>…</H5> ve <H6>…</H6>

  • Amacı: Bu etiketlerin her biri doküman üzerinde gösterilen bir başlığı içerir. Bu başlıklar <H1>'den (en baskın) <H6>'ya (en az baskın) kadar gider.
  • Başlangıç Etiketi: Gerekli
  • Bitiş Etiketi: Gerekli
  • Özel Nitelikler: Yok
  • Eski Nitelikler: align
  • Diğer Nitelikler: class, dir, id, lang, onclick, ondblclick, onkeydown, onkeypress, onkeyup, onmousedown, onmousemove, onmouseout, onmouseover, onmouseup, style, title
<HR>

  • Amacı: Bu etiket, yatay bir çizgiyi dokümanın bir parçası olarak gösterir.
  • Başlangıç Etiketi: Gerekli
  • Bitiş Etiketi: İzin verilmez
  • Özel Nitelikler: Yok
  • Eski Nitelikler: align, noshade, size, width
  • Diğer Nitelikler: class, dir, id, lang, onclick, ondblclick, onkeydown, onkeypress, onkeyup, onmousedown, onmousemove, onmouseout, onmouseover, onmouseup, style, title
<HTML>…</HTML>

  • Amacı: Bu etiket bir HTML dokümanını tamamen içerir.
  • Başlangıç Etiketi: Seçime bağlı
  • Bitiş Etiketi: Seçime bağlı
  • Özel Nitelikler: Yok
  • Eski Nitelikler: version
  • Diğer Nitelikler: lang, dir
<I>…</I>

  • Amacı: Bu etiket, italik görünmesi gereken metni içerir. Eskimemesine karşın, HTML 4.0 tanımı Style Sheet'leri daha iyi bir alternatif olarak önermektedir.
  • Başlangıç Etiketi: Gerekli
  • Bitiş Etiketi: Gerekli
  • Özel Nitelikler: Yok
  • Eski Nitelikler: Yok
  • Diğer Nitelikler: class, dir, id, lang, onclick, ondblclick, onkeydown, onkeypress, onkeyup, onmousedown, onmousemove, onmouseout, onmouseover, onmouseup, style, title
<IFRAME>…</IFRAME>

  • Amacı: Bu etiket, bir dokümana resimler ve diğer nesnelerle aynı şekilde eklenen bir çerçeveyi içerir.
  • Başlangıç Etiketi: Gerekli
  • Bitiş Etiketi: Gerekli

  • Özel Nitelikler:
    • <LI type=square>frameborder="sayı": Çerçeve etrafında bir çerçevenin olup olmayacağı.
    • longdesc="URI": Çerçevenin uzun açıklamasını içeren bir dokümanın URI'si.
    • marginheight="sayı": Çerçevenin içeriği ile üst ve alt kenarları arasındaki boşluk.
    • marginwidth="sayı": Çerçevenin içeriği ile sol ve sağ kenarları arasındaki boşluk.
    • name="metin": Çerçevenin adı.
    • scrolling="metin": Çerçevede kaydırmanın nasıl yapılacağı.
    • src="URI": Çerçevenin içeriğini kapsayan bir dokümanın URI'si.
    • width="sayı": Çerçevenin genişliği.
    • height="sayı": Çerçevenin yüksekliği.
  • Eski Nitelikler: Yok
  • Diğer Nitelikler: align, class, id, name, style, target, title
<IMG>

  • Amacı: Bu etiket, dokümanın bir parçası olarak gösterilen bir resim dosyasını içerir. <OBJECT> etiketi de resim dosyalarını göstermekte kullanılabilir.
  • Başlangıç Etiketi: Gerekli
  • Bitiş Etiketi: İzin verilmez

  • Özel Nitelikler:
    • <LI type=square>height="sayı": Resmin yüksekliği.
    • hspace="sayı": Bir dokümanda, resim ile sol ve sağındaki bilgiler arasında bırakılacak beyaz alanın miktarı.
    • ismap: Resmin sunucu tarafındaki (server-side) bir imagemap olduğunu belirten bir nitelik.
    • src="URI": Resim dosyasının URI'si.
    • longdesc="URI": Resmin ve içerdiği imagemap'lerin tanımını içeren bir URI.
    • vspace="sayı": Bir dokümanda, resim ile üst ve altındaki bilgiler arasında bırakılacak beyaz alanın miktarı.
    • width="sayı": Resmin genişliği.
  • Eski Nitelikler: align, border
 

karakan

Yeni üye
26 Ocak 2007
9
0
Walla link ölü dediğiniz gibi ama üşenmeyip bi de buraya yazmış olmanız çok güzel. Emeğiniz için teşekkürler.
 
Üst

Turkhackteam.org internet sitesi 5651 sayılı kanun’un 2. maddesinin 1. fıkrasının m) bendi ile aynı kanunun 5. maddesi kapsamında "Yer Sağlayıcı" konumundadır. İçerikler ön onay olmaksızın tamamen kullanıcılar tarafından oluşturulmaktadır. Turkhackteam.org; Yer sağlayıcı olarak, kullanıcılar tarafından oluşturulan içeriği ya da hukuka aykırı paylaşımı kontrol etmekle ya da araştırmakla yükümlü değildir. Türkhackteam saldırı timleri Türk sitelerine hiçbir zararlı faaliyette bulunmaz. Türkhackteam üyelerinin yaptığı bireysel hack faaliyetlerinden Türkhackteam sorumlu değildir. Sitelerinize Türkhackteam ismi kullanılarak hack faaliyetinde bulunulursa, site-sunucu erişim loglarından bu faaliyeti gerçekleştiren ip adresini tespit edip diğer kanıtlarla birlikte savcılığa suç duyurusunda bulununuz.