Автор Тема: HTML код  (Прочетена 4125 пъти)

completer

  • Напреднали
  • *****
  • Публикации: 347
  • Distribution: Debian 6.0
  • Window Manager: Gnome
    • Профил
    • WWW
HTML код
« -: Feb 03, 2009, 16:07 »
Здравейте! Отдавна не съм се занимавал с html и някои неща съм ги позабравил.
Та това което ме мъче е не мога да се сетя как да центрирам някакво изображение без да го уголемявам на 100% по резулюцията на браузера. Четох тук там но нещо не успях. Ето го кода който толкова много ме мъчи  ;D.


Код:
<a href="******"><img src="enter1.jpg" table width="100%" height="100%" valign="middle" border="0" /></a>


Когато дам височината и ширината да са на по малък процент изображението се измества автоматично в ляво,  :( Пробвах с различни вариации на aligh="center" също не ми се получава.
« Последна редакция: Feb 03, 2009, 16:11 от completer »
Активен
I'm using Linux and i'm proud of it!!!
I hate Windows and i'm also proud of it!!! :)

VladSun

  • Напреднали
  • *****
  • Публикации: 2166
    • Профил
Re: HTML код
« Отговор #1 -: Feb 03, 2009, 16:30 »
Цитат на: completer в Feb 03, 2009, 16:07
Код:
<a href="******"><img src="enter1.jpg" table width="100%" height="100%" valign="middle" border="0" /></a>

Отдавна ще да е било - наистина :)

Айде сега с прости думи кажи какво точно искаш да направиш - какво разположение имаш, как искаш да центрираш изображението (хоризонтално и/или вериткално), какво е "100% по резулюцията на браузера" и т.н.

По принцип в CSS-a има:
Код
GeSHi (CSS):
  1. margin: auto;
Активен
KISS Principle ( Keep-It-Short-and-Simple )
http://openfmi.net/projects/flattc/
Има 10 вида хора на този свят - разбиращи двоичния код и тези, които не го разбират :P

completer

  • Напреднали
  • *****
  • Публикации: 347
  • Distribution: Debian 6.0
  • Window Manager: Gnome
    • Профил
    • WWW
Re: HTML код
« Отговор #2 -: Feb 03, 2009, 17:57 »
Извинявам се че съм малко неразбран! ;D Значи имам едно изображение което искам да го центрирам(центрирано вертикално и хоризонтално), да служи нещо като ентер скрийн, само че като го центрирам с кода който съм дал изображението се оразмерява по резолюцията на потребителя.Пробвах само с align="center" но не се получава.Когато разменя процента на големината и височината на различно от 100% центрирането се прецаква.

Ако искаш да го видиш кода ето:
« Последна редакция: Feb 03, 2009, 18:04 от completer »
Активен
I'm using Linux and i'm proud of it!!!
I hate Windows and i'm also proud of it!!! :)

VladSun

  • Напреднали
  • *****
  • Публикации: 2166
    • Профил
Re: HTML код
« Отговор #3 -: Feb 03, 2009, 18:25 »
Код
GeSHi (HTML):
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  4. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  6. 	BODY, HTML
  7. 	{
  8. 		height: 100%;
  9. 		padding: 0;
  10. 		margin: 0;
  11. 	}
  13. <title>KMM</title>
  14. </head>
  15.  
  16. <body bgcolor="#000000">
  17. <table style="width: 100%; height: 100%">
  18. 	<tr>
  19. 		<td style="width: 100%; height: 100%; text-align: center; vertical-align: middle">
  20. 			<a href="http://kmm.free.bg/main.html"><img src="enter1.jpg" style="border: 0;"/></a>
  21. 		</td>
  22. 	</tr>
  24. </body>
  25. </html>
Активен
KISS Principle ( Keep-It-Short-and-Simple )
http://openfmi.net/projects/flattc/
Има 10 вида хора на този свят - разбиращи двоичния код и тези, които не го разбират :P

tarator

  • Напреднали
  • *****
  • Публикации: 849
    • Профил
Re: HTML код
« Отговор #4 -: Feb 03, 2009, 18:37 »
Няма нужда от таблица.
Активен
A gentleman is one who is never rude unintentionally. - Noel Coward

vstoykov

  • Напреднали
  • *****
  • Публикации: 1286
  • Distribution: Ubuntu
  • Window Manager: Fluxbox
    • Профил
    • WWW
Re: HTML код
« Отговор #5 -: Feb 03, 2009, 18:51 »
Как точно става номера без таблица? И аз съм се чудил над този въпрос и нямам отговор (освен с JavaScript, който изчислява местоположението, знаейки височината/ширината на прозореца и размера на изображението).
Активен

tarator

  • Напреднали
  • *****
  • Публикации: 849
    • Профил
Re: HTML код
« Отговор #6 -: Feb 03, 2009, 19:10 »
Може например с div.

Код:
<div style="test-align: center; vertical-align: middle">Каквото си поискаш центрирано</div>

Активен
A gentleman is one who is never rude unintentionally. - Noel Coward

VladSun

  • Напреднали
  • *****
  • Публикации: 2166
    • Профил
Re: HTML код
« Отговор #7 -: Feb 03, 2009, 19:25 »
Цитат на: tarator в Feb 03, 2009, 19:10
Може например с div.

Код:
<div style="test-align: center; vertical-align: middle">Каквото си поискаш центрирано</div>

vertical-align е параметър само на събирателни елементи с display: table-cell

Ред.: Всъщност, дори и да беше вярно за DIV (разбирай display: block), твоят HTML код е напълно грешен - височината на DIV-a е според съдържанието му.
« Последна редакция: Feb 03, 2009, 19:39 от VladSun »
Активен
KISS Principle ( Keep-It-Short-and-Simple )
http://openfmi.net/projects/flattc/
Има 10 вида хора на този свят - разбиращи двоичния код и тези, които не го разбират :P

gat3way

  • Напреднали
  • *****
  • Публикации: 6050
  • Relentless troll
    • Профил
    • WWW
Re: HTML код
« Отговор #8 -: Feb 03, 2009, 20:12 »
div-а може ли и вертикално да ги прави тези работи?

Аз понеже не съм уеб девелопер и живея в едни времена отпреди 10 години, ползвам таблици за щяло и не щяло....такива неща са ми много нови :)
Активен
"Knowledge is power" - France is Bacon

tyuio

  • Гост
Re: HTML код
« Отговор #9 -: Feb 03, 2009, 20:17 »
таблиците имат спред модерните представи доста ограничения и трупат код. div i css му е мамата :)
Активен

tarator

  • Напреднали
  • *****
  • Публикации: 849
    • Профил
Re: HTML код
« Отговор #10 -: Feb 03, 2009, 20:23 »
VladSun, прав си, кода ми не работи, ще помисля като имам малко време.
Активен
A gentleman is one who is never rude unintentionally. - Noel Coward

ivo3d

  • Напреднали
  • *****
  • Публикации: 161
  • Distribution: Mint Linux
  • Window Manager: Gnome
    • Профил
Re: HTML код
« Отговор #11 -: Feb 03, 2009, 20:31 »
Код
GeSHi (HTML):
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3.     <head>
  4.     </head>
  5.     <body>
  6. 		<a href="#"><img src="karinka.jpg" style="position: absolute; top: 50%; left: 50%; margin-top: -150px; margin-left: -150px;" /></a>
  7.     </body>
  8. </html>
  9.  
  10.  

Ей това е начина с CSS и xHTML да направиш splash screen. Забележи, че има един margin-top и margin-left от по 150px. Тук са примерни, а по принцип трябва margin-top да бъде половината от височината на картинката, a margin-left - половината от широчината.

Активен

VladSun

  • Напреднали
  • *****
  • Публикации: 2166
    • Профил
Re: HTML код
« Отговор #12 -: Feb 03, 2009, 20:53 »
Цитат на: tyuio в Feb 03, 2009, 20:17
таблиците имат спред модерните представи доста ограничения и трупат код. div i css му е мамата :)
Всъщност таблиците дори според модерните представи имат много по-пълни възможности по-добра браузерна съвместимост - и двете са следствие от твърде продължителния оперио на използването им като стандарт в HTML layout-a. Поради това CSS има още доста да гони в някои отношения, но определено в него е бъдещето.
Активен
KISS Principle ( Keep-It-Short-and-Simple )
http://openfmi.net/projects/flattc/
Има 10 вида хора на този свят - разбиращи двоичния код и тези, които не го разбират :P

ivo3d

  • Напреднали
  • *****
  • Публикации: 161
  • Distribution: Mint Linux
  • Window Manager: Gnome
    • Профил
Re: HTML код
« Отговор #13 -: Feb 03, 2009, 21:06 »
Таблиците ще се използват винаги, тъй като често (особено в уеб приложенията) се използва таблично представяне на информация. Всеки таг си има предназначение, иначе всичко може и само с <p> да се направи, но не е логично, както не е логично и да се използват div тагове за таблична информация, както и не е логично да се пише layout с таблици.
Активен

VladSun

  • Напреднали
  • *****
  • Публикации: 2166
    • Профил
Re: HTML код
« Отговор #14 -: Feb 03, 2009, 21:06 »
Цитат на: ivo3d в Feb 03, 2009, 20:31
Код
GeSHi (HTML):
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3.     <head>
  4.     </head>
  5.     <body>
  6. 		<a href="#"><img src="karinka.jpg" style="position: absolute; top: 50%; left: 50%; margin-top: -150px; margin-left: -150px;" /></a>
  7.     </body>
  8. </html>
  9.  
  10.  

Ей това е начина с CSS и xHTML да направиш splash screen. Забележи, че има един margin-top и margin-left от по 150px. Тук са примерни, а по принцип трябва margin-top да бъде половината от височината на картинката, a margin-left - половината от широчината.

Хитро :)
Активен
KISS Principle ( Keep-It-Short-and-Simple )
http://openfmi.net/projects/flattc/
Има 10 вида хора на този свят - разбиращи двоичния код и тези, които не го разбират :P

Подобни теми
Заглавие Започната от Отговора Прегледи Последна публикация
Вмъкване на Перл в HTML
Web development 		Rooted 6 5382 Последна публикация Jan 03, 2006, 00:34
от
Как да направим HTML страница да не работи под IE
Хумор 		karaman 5 5390 Последна публикация Feb 20, 2006, 11:13
от astronom
проблем с html кирилицата
Web development 		angie_bg 3 6025 Последна публикация Nov 26, 2006, 09:15
от angie_bg
субтитри с html тагове...?
Настройка на програми 		_NetCutter_ 3 3584 Последна публикация Dec 16, 2006, 12:17
от karaman
Html help
Web development 		stevebradata 2 1398 Последна публикация Jun 17, 2007, 09:23
от stevebradata