Pereiti prie turinio

HTML Lentele

donatas0077

Sukūrė donatas0077
Programuotojų kampas

 Dalintis Sekėjai 0

Rekomenduojami pranešimai

donatas0077

donatas0077 1

Atrašyta
  • Autorius
Atrašyta (redaguota)

niekaip nesiseka i savo vieta idet "Lenteles pavadinimas" ir uzdet sonus lenteles kaip parodyta pavyzdi

<html>
<body>
<table border="1" style="width:100%">
	<CAPTION>Lenteles pavadinimas</CAPTION>

	<tr>
		<th bgcolor=#BDBDBD>Pirmas stulpelis</th>
		<th bgcolor=#BDBDBD>Antras stulpelis</th>
		<th bgcolor=#BDBDBD>Trecias stulpelis</th>
		<th bgcolor=#BDBDBD>Ketvirtas stulpelis</th>
	</tr>

	<tr height="120px" width="50%">
		<td align="left" valign="top">Lasteles tekstas 120. Tekstas lygiuotas lasteles virsaus. Lasteles plotis 50% visos lenteles ploico.<h2><b>Sarasas</b></h2>
			<ol type="1">
				<li> Pirmas saraso elementas
				<li> Antras saraso elementas
					<ol >
						<li type="circle">Saraso sarase pirmas alementas
						<li type="circle">Saraso sarase antras alementas 
					</ol>
				<li> Trecias saraso elementas
			</ol>
		</td>
		<td valigh="middle" align="center">Tekstas centruotas lasteleje ir vertikaliai ir horizontaliai</td>
		<td valign="bottom"colspan=2>Apjungti du stulpeliai ir tekstas lygiuotas prie lasteles apacios</td>
	</tr>

	<tr height="80px">
		<td align="right">Lasteles aukstis 80, tekstas centruotas lasteles vertikaliai, horizontaliai lygiuotas prie desinio lasteles krasto.</td>
		<td align="right"><I>Pasvires tekstas lygiuotas palei desiniji lasteles krasta</I></td>
		<td valigh="middle" ><STRIKE><font color="blue">Perbrauktas tekstas paciame lasteles centre</font></STRIKE></td>
		<td valign="top" alight="center">Tekstas lygiuotas prie lasteles virsaus</td>
	</tr>

<td COLSPAN="4" bgcolor=#BDBDBD align="center">Pirmos lenteles paskutine eilute apjungenti visus stulpelius</td>
</table>
</body>
</html>

 

 

Isspresta

Redagavo donatas0077
Nuoroda į pranešimą
Dalintis kituose puslapiuose
xau

xau 8

Atrašyta
Atrašyta

Lentelė

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Table HTML</title>
</head>

<body>
<div class="wrap">
<!-- Lentelė -->
<table class="table">
 	<caption>Lentelės pavadinimas</caption>
 	<!-- Lentelės viršus: stulpelių pavadinimai -->
   <thead>
     <tr>      	      
       <th>Pirmas stulpelis</th>
       <th>Antras stulpelis</th>
       <th>Trečias stulpelis</th>
       <th>Ketvirtas stulpelis</th>        
     </tr>
   </thead>
   <!-- Lentelės apačia -->
   <tfoot>
   	<tr>
   		<td colspan="4">Footer</td>
   	</tr>
   </tfoot>
   <!-- Lentelės duomenys -->
   <tbody>    
   	<!-- Pirma eiluė -->
     <tr>        
       <td>
       	<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Cumque illo eaque, amet quaerat magnam recusandae!</p>
				<section>
					<h2>Sąrašas</h2>
					<ol>
						<li>a</li>
						<li>b</li>
						<li>c</li>
					</ol>
				</section>					
       </td>
       <td>2</td>
       <td colspan="2">3 ir 4</td>               
     </tr>
     <!-- Antra eilutė -->
     <tr>        
       <td>1</td>
       <td>2</td>
       <td>3</td>
       <td>4</td>       
     </tr>
     <!-- Treia eilutė -->
     <tr>        
       <td colspan="4">1 2 3 4</td>               
     </tr>      
   </tbody>
   <!-- Lentelės duomenys END -->
 </table>
 <!-- Lentelė END -->
 </div>
</body>
</html>

 

Stilius

<style>
.wrap {
	width:1024px;
	margin:0 auto;
}
.table {
	width:100%;
	border-collapse:collapse;
}
.table>thead, .table>tfoot {
	background-color: #d8d8d8;
	text-align: center;
}
.table>tbody>tr>td, .table>thead>tr>th, .table>tfoot>tr>td, .table>thead>tr>td, .table>thead>tr>th {
	padding: 8px;
   line-height: 1.42857143;
   vertical-align: top;
   border: 1px solid #ddd;
 }
 .table>tbody>tr:nth-child(1)>td:nth-child(2) {
 	vertical-align: middle;
 	text-align: center;
 }
 .table>tbody>tr:nth-child(1)>td:nth-child(3) {
 	vertical-align:bottom;
 }
 .table>tbody>tr:nth-child(2)>td:nth-child(-n+2) {
 	text-align:left; text-align: right;
 }  
 .table>tbody>tr:nth-child(2)>td:nth-child(3) {
 	vertical-align: middle;
 	text-align: center;
 	color:blue;
 	text-decoration: line-through;
 }  
 .table>tbody>tr:nth-child(3) {
 	text-align: center;
 }
</style>

 

valign nebenaudojamas html5

Nuoroda į pranešimą
Dalintis kituose puslapiuose

Prisijunkite prie diskusijos

Jūs galite rašyti dabar, o registruotis vėliau. Jeigu turite paskyrą, prisijunkite dabar, kad rašytumėte iš savo paskyros.

Svečias
Parašykite atsakymą...

×   Įdėta kaip raiškusis tekstas.   Atkurti formatavimą

  Only 75 emoji are allowed.

×   Nuorodos turinys įdėtas automatiškai.   Rodyti kaip įprastą nuorodą

×   Jūsų anksčiau įrašytas turinys buvo atkurtas.   Išvalyti redaktorių

×   You cannot paste images directly. Upload or insert images from URL.

Įkraunama...
×
 Dalintis
Sekėjai 0
Eiti į temų sąrašą

  • Dabar naršo   0 narių

    Nei vienas registruotas narys šiuo metu nežiūri šio puslapio.

  • Prisijunk prie bendruomenės dabar!

    Uždarbis.lt nariai domisi verslo, IT ir asmeninio tobulėjimo temomis, kartu sprendžia problemas, dalinasi žiniomis ir idėjomis, sutinka būsimus verslo partnerius ir dalyvauja gyvuose susitikimuose.

    Užsiregistruok dabar ir galėsi:

    ✔️ Dalyvauti diskusijose;

    ✔️ Kurti naujas temas;

    ✔️ Rašyti atsakymus;

    ✔️ Vertinti kitų žmonių pranešimus;

    ✔️ Susisiekti su bet kuriuo nariu asmeniškai;

    ✔️ Naudotis tamsia dizaino versija;

    ir dar daugiau.

    Registracija trunka ~30 sek. ir yra visiškai nemokama.

  • Naujausios temos

  • Karštos temos

×
×
  • Pasirinkite naujai kuriamo turinio tipą...