4shared

html გაკვეთილი მეცამეტე

ცხრილები.

საიტის შექმნისას ძალიან ხშირად იყენებენ ცხრილებს.ჩვენ შევქმნით სურათზე მოცემულ ცხრილს.

ცხრილები html

ცხრილები იქმნება ტეგით:

<table></table>

ცხრილი შედგება სტრიქონი (ხაზები) და სვეტებისაგან(უჯრა) , ამიტომ ჩვენ უნდა მივუთითოთ ისინი.

<tr></tr> – ცხრილის სტრიქონი (ხაზები)
<td></td> – ცხრილის სვეტი (უჯრა)

თქვენს წინაშე ცხრილი ორი სტიქონისაგან და სამი სვეტისაგან.

<table>
<tr></tr>
<tr></tr>
</table>

ჯერ ჩვენ დავწერეთ ორი სტრიქონი და თვითეულ სტრიქონში განვათავსეთ სამ ამი სვეტი:

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

მოდით ეხლა შევავსოთ მოცემული კარკასი:
<table>
<tr>
<td>1×1</td>
<td>1×2</td>
<td>1×3</td>
</tr>
<tr>
<td>2×1</td>
<td>2×2</td>
<td>2×3</td>
</tr>
</table>
ეს ყველაფერი გამოიყურება შემდეგნაირად:

1×1
1×2
1×3
2×1
2×2
2×3

ფონი როგორც სურაზე ნაჩვენები ჯერ არ არის. ფონი კეთდება ატრიბუტ bgcolor=”ფონის_ფერი”. ფონის მიცემა შეიძლება მთლიანი ცხრილისთვის ასევე სტრიქონებისათვისა და უჯრებისათვის ცალკე.

<table>
<tr>
<td bgcolor=”#FFCC33″>1×1</td>
<td bgcolor=”#336699″>1×2</td>
<td bgcolor=”#FFCC33″>1×3</td>
</tr>
<tr>
<td bgcolor=”#336699″>2×1</td>
<td bgcolor=”#FFCC33″>2×2</td>
<td bgcolor=”#336699″>2×3</td>
</tr>
</table>

აი რა გამოგვივიდა

თუ თქვენ გსურთ გონის გაკეთება სტრიქონისათვის მაშინ ატრიბუტ bgcolor  ჩვენ ვწერთ ტეგისათვის <tr>:

<tr bgcolor=”#FFCC33″>.

თუ თქვენ გსურთ ფონის მიცემა მთლიანი ცხრილისათვის მაშინ ატრიბუტ bgcolor ვწერთ ტეგ <table> -ში:

<table bgcolor=”#FFCC33″>

მოდით მივცეთ ჩვენ ცხრილი სიმაღლე და სიფართე, ამ პარამეტრების მითითება შეიძლება პიქსელებში და პროცენტებში. ხოლო სიმაღლე და სიგანე კეთდება ატრიბუტ height და width მეშვეობით.

<table>
<tr>
<td height=”35″ width=”50″ bgcolor=”#FFCC33″> 1×1 </td>
<td width=”50″ bgcolor=”#336699″> 1×2 </td>
<td width=”50″ bgcolor=”#FFCC33″> 1×3 </td>
</tr>
<tr>
<td height=”35″ width=”50″ bgcolor=”#336699″> 2×1 </td>
<td width=”50″ bgcolor=”#FFCC33″> 2×2 </td>
<td width=”50″ bgcolor=”#336699″> 2×3 </td>
</tr>
</table>

 

ჩვენ თითქმის მივიღეთ სურათზე ნაჩვენები ცხრილი, დაგვრჩა მხოლოდ ტექსტის პოზიციონირება ცხრილში:

<table>
<tr>
<td height=”35″ width=”50″ bgcolor=”#FFCC33″> <center> 1×1 </center> </td>
<td width=”50″ bgcolor=”#336699″> <center> 1×2 </center> </td>
<td width=”50″ bgcolor=”#FFCC33″> <center>1×3 </center> </td>
</tr>
<tr>
<td height=”35″ width=”50″ bgcolor=”#336699″> <center> 2×1 </center> </td>
<td width=”50″ bgcolor=”#FFCC33″> <center> 2×2 </center> </td>
<td width=”50″ bgcolor=”#336699″> <center> 2×3 </center> </td>
</tr>
</table>

მორჩა ცხრილი მზადაა.

 

ცხრილებზე შაუბარს განვაგრძობთ შემდეგ გაკვეთილში.

დატოვეთ თქვენი კომენტარი

*