[ Поиск ] - [ Пользователи ] - [ Календарь ]
Полная Версия: Как правильно сделать шрифт ?
Oggy
Здравствуйте. В псд файле который преслал заказчик шрифт Karnac One (которого нет по умолчанию в ОС). Я скачал Karnac One шрифт и установил. Вёрстка на случай если Karnac One нету текст выводится в Arial. Но когда выводится в Arial но сбиваются позицыи дивов. Подскажыте пожалуйста как сделать одинаковое положение дивов при 1-ом или 2-ом шрифте ?

body {
background-image: url(../img/bg.png);
background-color: #a1bad1;

font: 20px [b]Karnac One[/b], Arial, Tahoma, Verdana, sans-serif;
height: 100%;
background-repeat: repeat-x;

}




Спустя 1 час, 14 минут, 16 секунд (2.09.2012 - 18:02) redreem написал(а):
шрифты никак напрямую не влияют на позиционирование. скорее всего дело в разном размере внутреннего контента при разных шрифтах, отчего дивы и изменяются. для решения проблемы надо видеть код самих дивов и стилей, а лучше - выложенную страницу.

Спустя 14 минут, 14 секунд (2.09.2012 - 18:17) Guest написал(а):
Цитата (redreem @ 2.09.2012 - 19:02)
шрифты никак напрямую не влияют на позиционирование. скорее всего дело в разном размере внутреннего контента при разных шрифтах, отчего дивы и изменяются. для решения проблемы надо видеть код самих дивов и стилей, а лучше - выложенную страницу.

вот ссылка
шрифты можно на сайте же и скачать
при етих дополнительных шрифтах всё хорошо - без них вёрстка едет
sad.gif

Спустя 43 минуты, 23 секунды (2.09.2012 - 19:00) bobo написал(а):
Автор, если в макете текст написан определенным шрифтом, то и на сайте он тоже должен быть написан этим же шрифтом. У ВСЕХ, а не только у тебя.
Оттого, что ты себе установил этот шрифт, проблема не решится, ибо вероятность того, что у посетителя сайта будет установлен какой-то нестандартный шрифт, стремится к нулю.

Спустя 8 минут, 13 секунд (2.09.2012 - 19:08) johniek_comp написал(а):
используй шрифты от гугла

Спустя 53 минуты, 25 секунд (2.09.2012 - 20:02) Oggy написал(а):
Цитата (bobo @ 2.09.2012 - 17:00)
Автор, если в макете текст написан определенным шрифтом, то и на сайте он тоже должен быть написан этим же шрифтом. У ВСЕХ, а не только у тебя.
Оттого, что ты себе установил этот шрифт, проблема не решится, ибо вероятность того, что у посетителя сайта будет установлен какой-то нестандартный шрифт, стремится к нулю.

я вкурсе...поетому и спрашываю как сделать нормальное отображение слоёв на случай если нету такого шрифта.

Спустя 36 секунд (2.09.2012 - 20:02) Oggy написал(а):
Цитата (johniek_comp @ 2.09.2012 - 17:08)
используй шрифты от гугла

а как ето ?

Спустя 2 минуты, 21 секунда (2.09.2012 - 20:04) Oggy написал(а):
но по тз шрифт нестандартный....как быть ?

Спустя 3 часа, 21 минута, 38 секунд (2.09.2012 - 23:26) kamanch написал(а):
Шрифты от гугла:
http://www.google.com/webfonts

Как пользовать:
в css объявлешь свой font-face и потом его же уже в font-family используешь
@font-face {
font-family: 'PTSansNarrowBold';
src: url('http://themes.googleusercontent.com/static/fonts/ptsansnarrow/v3/Q_pTky3Sc3ubRibGToTAYigw e3ZcNEyK1ut-Sjba9Qg.woff') format('woff'),
}

.mystyle {
font-family: 'PTSansNarrowBold';
}

Спустя 7 часов, 8 минут, 15 секунд (3.09.2012 - 06:34) Oggy написал(а):
Цитата (kamanch @ 2.09.2012 - 21:26)
Шрифты от гугла:
http://www.google.com/webfonts

Как пользовать:
в css объявлешь свой font-face и потом его же уже в font-family используешь
@font-face {
font-family: 'PTSansNarrowBold';
src: url('http://themes.googleusercontent.com/static/fonts/ptsansnarrow/v3/Q_pTky3Sc3ubRibGToTAYigw e3ZcNEyK1ut-Sjba9Qg.woff') format('woff'),
}

.mystyle {
font-family: 'PTSansNarrowBold';
}

там нету шрифта Karnac One

Спустя 10 минут, 12 секунд (3.09.2012 - 06:45) kamanch написал(а):
Цитата
там нету шрифта Karnac One

Распространенная ошибка бестолкового дизайнера - использовать прикрасивенький шрифт из своей коллекции "Мегасборник 5000 шрифтов".
А о том, что он не будет отображен у пользователя, его фотошопский гуру не обучил.

Поэтому, у тебя 2 задачи:
1. найти максимально похожий шрифт
2. максимально коректно донести до заказчика, что веб-пространство и типография - это разные вещи.

Можно, конечно, переконвертировать и твой шрифт, на выходе из него получешь пакет шрифтов для разных браузеров. И вся эта прелесть может весить 300 кб, которые будут подгружаться на страницу.
Пример тут: http://slaffko.name/blog/item/krossbrauzer...x-shriftov.html

Спустя 40 минут, 41 секунда (3.09.2012 - 07:25) bobo написал(а):
Цитата (Oggy @ 3.09.2012 - 09:34)
там нету шрифта Karnac One

Чувак, я с тебя фигею: сделай в любом поисковике запрос, выкачай этот шрифт себе и подключай к сайту локально wacko.gif

з.ы. А потом слышишь от заказчиков: "А чойто дорого у тебя 70$ за макет, моему другу вон за 30$ весь сайт сделали!?" dry.gif

Спустя 8 минут, 55 секунд (3.09.2012 - 07:34) Oggy написал(а):
Цитата (bobo @ 3.09.2012 - 05:25)
Цитата (Oggy @ 3.09.2012 - 09:34)
там нету шрифта Karnac One

Чувак, я с тебя фигею: сделай в любом поисковике запрос, выкачай этот шрифт себе и подключай к сайту локально wacko.gif

з.ы. А потом слышишь от заказчиков: "А чойто дорого у тебя 70$ за макет, моему другу вон за 30$ весь сайт сделали!?" dry.gif

напишыте пожалуйста пример как подключить шрифт на хосте ?

Спустя 15 минут, 4 секунды (3.09.2012 - 07:49) bobo написал(а):
Цитата (Oggy @ 3.09.2012 - 10:34)
напишыте пожалуйста пример как подключить шрифт на хосте ?

kamanch уже написал, отличие будет только в том, что нужно локальный путь к файлу со шрифтом прописать.

Спустя 22 минуты, 1 секунда (3.09.2012 - 08:11) Oggy написал(а):
Цитата (bobo @ 3.09.2012 - 05:49)
Цитата (Oggy @ 3.09.2012 - 10:34)
напишыте пожалуйста пример как подключить шрифт на хосте ?

kamanch уже написал, отличие будет только в том, что нужно локальный путь к файлу со шрифтом прописать.

хорошо...а что делать когда я использую 2 нестандартных шрифта ? В боди я подключил. А как подключить в lm2_nav ?
[/css]
.lm2_nav {
position:relative;
list-style:none;
font: 12px Arial Narrow;
text-decoration: underline;
}

body {
font: 20px Karnac One;
}

@font-face {
font-family: "Karnac One"; /*указываем название шрифта*/
src: url("http://www.ХХХ/fonts/Karnac One.ttf"); /*путь к описывающему его файлу*/

}
[css]

Спустя 23 минуты, 29 секунд (3.09.2012 - 08:35) bobo написал(а):
Сколько нестандартных шрифтов, столько и блоков @font-face { }
Цитата (Oggy @ 3.09.2012 - 11:11)
В боди я подключил. А как подключить в lm2_nav ?

Не понял вопроса. Так же точно, как и в body.

Спустя 1 час, 21 минута, 34 секунды (3.09.2012 - 09:56) kamanch написал(а):
Oggy
Не слушай глупости. Пойди по ссылке, которую я дал, там все расписанно.
Локално любой шрифт подключить нельзя

Спустя 41 минута, 4 секунды (3.09.2012 - 10:37) bobo написал(а):
Цитата (kamanch @ 3.09.2012 - 12:56)
Локално любой шрифт подключить нельзя

Ппц, где вы такие только беретесь.
Получается графические файлы тоже локально нельзя подключить, да ?)))

@font-face {
font-family: Pompadur; /* Имя шрифта */
src: url('fonts/pompadur.ttf'); /* Путь к файлу со шрифтом */
}

Учись, студент.

Спустя 12 минут, 20 секунд (3.09.2012 - 10:50) kamanch написал(а):
bobo
IE6?

Спустя 35 минут, 27 секунд (3.09.2012 - 11:25) bobo написал(а):
Что ie6 ?

Спустя 6 минут, 58 секунд (3.09.2012 - 11:32) kamanch написал(а):
В IE6 затолкай свой код, а потом иди учись

Спустя 17 минут, 29 секунд (3.09.2012 - 11:50) bobo написал(а):
Причем тут мой код и ie6, клоун, я человеку всего лишь наглядно показал, как локально файл шрифта подключать в таблицу стилей.
А то, что для полной кроссбраузерности этого мало, знаю и без тебя, прикинь.

Спустя 11 минут, 27 секунд (3.09.2012 - 12:01) kamanch написал(а):
Что ты ему показал? Нерабочий код? И кому он поможет?

Спустя 22 минуты, 50 секунд (3.09.2012 - 12:24) bobo написал(а):
Слушай, гражданин теоретик, если у тебя не работает та ерунда, которую я выложил для примера, то либо поменяй свой древний браузер например на хром, либо, если уж и в хроме не работает, то засунь руки между перил в подъезде и выправляй их до тех пор, пока они совсем ровными не станут.

Спустя 12 минут, 43 секунды (3.09.2012 - 12:37) kamanch написал(а):
bobo
Девушка, расслабтесь.
Найдете вы себе горячего парня, не надо истериковать. smile.gif

Спустя 10 минут, 10 секунд (3.09.2012 - 12:47) bobo написал(а):
Опаньки, волосаты-попаньки, дядя, у тебя недотрах что ли жесткий, чего тебе девушки то мерещатся там, где ими даже и не пахнет о_О

Спустя 8 минут, 1 секунда (3.09.2012 - 12:55) kamanch написал(а):
bobo
Полюбому девушка.
Либо по рождению, либо позже стал ей, либо еще не стал, но очень хочешь стать.
Истерикуеш много. Как баба.

Спустя 4 минуты, 27 секунд (3.09.2012 - 12:59) bobo написал(а):
Все правильно, чо: когда у таких знатоков, как ты, заканчиваются аргументы по теме, они начинают переходить на личности.
Кстати грубость и истерика не одно и то же, клоун, поэтому еще раз настоятельно советую убиццо об стену. Можно даже пару раз.

Спустя 2 минуты, 58 секунд (3.09.2012 - 13:02) Игорь_Vasinsky написал(а):
не офтопить.

Спустя 1 час, 24 минуты, 3 секунды (3.09.2012 - 14:26) sebastjan написал(а):
Не вижу проблемы.
Если дизайнер макета такой лапух, тогда просто сделай картинками навигацию а в альтах пропиши текст.
Да и вообще ,выложи сам макет дизайнера.
Так как по всему видно что лепится сайт на коленке от балды.
Хотя с другой стороны и хорошо, будет в скором времени снова работа для редизайна. smile.gif

Спустя 1 час, 5 минут, 6 секунд (3.09.2012 - 15:31) Oggy написал(а):
опять люди из-за моих тем ссорятся...
я сделал так:

@font-face {
font-family: "Karnac One";
src: url("http://www.makeup.opacha.info/fonts/Karnac One.ttf");

}
@font-face {
font-family: "Arial Narrow";
src: url("http://www.makeup.opacha.info/fonts/ARIALN.TTF");
}

а потом в нужном диве :

font: 14px Arial Narrow;

покамись всё работает...на IE ещё не тестировал :)

Спустя 11 минут, 42 секунды (3.09.2012 - 15:43) kamanch написал(а):
Тестировать нужно в IЕ начиная с 6, Опере, Хроме, Мозиле как минимум.
Вот если везде заработает, значит ты спец в этом вопросе.
И тестировать нужно каждый блок сразу. Оставишь на потом.... потом начнешь подгонять всё полностью, и это всё полностью разлезется в предыдущем браузере.

Но, если ты патриот своих грабель, то никoго не слушай. Клади их перед собой и смело на них наступай. smile.gif

Вот, смотри, нравится?
user posted image

Спустя 30 минут, 26 секунд (3.09.2012 - 16:13) killer8080 написал(а):
Цитата (bobo @ 3.09.2012 - 12:50)
Причем тут мой код и ie6, клоун, я человеку всего лишь наглядно показал, как локально файл шрифта подключать в таблицу стилей.


 ! 

М
bobo
Не нужно переходить на хамство, и личные оскарбления. Учись адекватно воспринимать критику. В следующий раз будет бан.
killer8080

Спустя 4 минуты, 40 секунд (3.09.2012 - 16:18) Oggy написал(а):
Цитата (kamanch @ 3.09.2012 - 13:43)
Тестировать нужно в IЕ начиная с 6, Опере, Хроме, Мозиле как минимум.
Вот если везде заработает, значит ты спец в этом вопросе.
И тестировать нужно каждый блок сразу. Оставишь на потом.... потом начнешь подгонять всё полностью, и это всё полностью разлезется в предыдущем браузере.

Но, если ты патриот своих грабель, то никoго не слушай. Клади их перед собой и смело на них наступай. smile.gif

Вот, смотри, нравится?
user posted image

может существует скрипт который грузит шрифты спецыально для IE ??

Спустя 4 минуты, 32 секунды (3.09.2012 - 16:23) kamanch написал(а):
Ну ты чего??? Я же тебе ссылку выше дал, ты читал?

Спустя 7 минут, 54 секунды (3.09.2012 - 16:31) kamanch написал(а):
Тренеруйся, все получится wink.gif

user posted image

Спустя 38 минут, 39 секунд (3.09.2012 - 17:09) dron4ik написал(а):
Если шрифта нет на гугле... то можно попробовать куфон... ну а если шрифты придумал диз то картинками)

Спустя 29 минут, 37 секунд (3.09.2012 - 17:39) bobo написал(а):
Цитата (killer8080 @ 3.09.2012 - 19:13)
Учись адекватно воспринимать критику.

Нечоссе, фраза "не обращай внимания на глупости" в ответ на абсолютно рабочий код на ровном месте - эт давно критикой то стало ? Здрасте, я ваша тетя.

Цитата (kamanch @ 3.09.2012 - 18:43)
И тестировать нужно каждый блок сразу. Оставишь на потом.... потом начнешь подгонять всё полностью, и это всё полностью разлезется в предыдущем браузере.

Какой каждый блок, что разлезется, куда подгонять..
От таких советов "знатоков" волосы на одном месте шевелится начинают dry.gif
Подключаются 4 файла, это:
1. *.eot - для IE
2. *.ttf & *.woff для оперы, лиса, последних версий хрома и сафари
3. *.svg для хрома ранних версий
ВСЁ.
Если у тебя с этим какие-то трудности возникают, то совет, что с этим делать, тебе уже давал.

Спустя 39 минут, 56 секунд (3.09.2012 - 18:19) Oggy написал(а):
Цитата (bobo @ 3.09.2012 - 15:39)
Цитата (killer8080 @ 3.09.2012 - 19:13)
Учись адекватно воспринимать критику.

Нечоссе, фраза "не обращай внимания на глупости" в ответ на абсолютно рабочий код на ровном месте - эт давно критикой то стало ? Здрасте, я ваша тетя.

Цитата (kamanch @ 3.09.2012 - 18:43)
И тестировать нужно каждый блок сразу. Оставишь на потом.... потом начнешь подгонять всё полностью, и это всё полностью разлезется в предыдущем браузере.

Какой каждый блок, что разлезется, куда подгонять..
От таких советов "знатоков" волосы на одном месте шевелится начинают dry.gif
Подключаются 4 файла, это:
1. *.eot - для IE
2. *.ttf & *.woff для оперы, лиса, последних версий хрома и сафари
3. *.svg для хрома ранних версий
ВСЁ.
Если у тебя с этим какие-то трудности возникают, то совет, что с этим делать, тебе уже давал.

стоп
разпешыте пожалуйста ето поподробней

1. *.eot - для IE
2. *.ttf & *.woff для оперы, лиса, последних версий хрома и сафари
3. *.svg для хрома ранних версий

ето можно создавать файлы стилей только для вибраных браузеров ?
или ето какието модные класи ? )

Спустя 2 минуты, 20 секунд (3.09.2012 - 18:21) bobo написал(а):
http://www.fontsquirrel.com/fontface/generator - загружаешь ttf файл, выставляешь в настройках, что хочешь получить на выходе - скрипт все сам сделает.

Спустя 4 часа, 7 минут, 27 секунд (3.09.2012 - 22:29) killer8080 написал(а):
Цитата (bobo @ 3.09.2012 - 18:39)
Цитата (killer8080 @ 3.09.2012 - 19:13)
Учись адекватно воспринимать критику.

Нечоссе, фраза "не обращай внимания на глупости" в ответ на абсолютно рабочий код на ровном месте - эт давно критикой то стало ? Здрасте, я ваша тетя.

Одно дело высказываться по поводу видения проблемы, и советов по её решению, и совсем другое оскорблять оппонента как личность. С твоей стороны последовали именно личные оскорбления, а это не допустимо!
Быстрый ответ:

 Графические смайлики |  Показывать подпись
Здесь расположена полная версия этой страницы.
Invision Power Board © 2001-2024 Invision Power Services, Inc.