Каждому браузеру свой стиль CSS
Добавил(а) amorexxx   
09.06.10 15:00

Каждому браузеру свой стиль CSS

На сегодняшний день существуют множество разных браузеров они все стремятся и поддержке спецификации CSS официально установленной но всё ровно каждый верстальщик шаблона сайта сталкивается с проблемой отображение сайта в разных браузерах. При этом можно долго спорить, какой из браузеров «более правильный», суть остается одна — пока существуют несколько браузеров и люди их применяют, сайт надо делать так, чтобы он корректно и без ошибок в них отображался так как задумали разработчики и дизайнеры. Ведь не один владелец своего сайта не хочет потерять например аудиторию пользователей которые используют браузер в котором не корректно отображается его сайт. Как же быть в такой ситуации на сегодняшний день существует множество способов победить эту проблему один из распространённых способов это писать в основной CSS так называемые хаки стилей которые будут читаться только теми браузерами для которых они написаны, например вы написали CSS под свой сайт но в Internet Explorer 6 версии отображает не так как в других, например:вам кажеться что в IE 6 ширина блока

отображеться не на 100px а меньше то вы можете принудительно её увеличить отдельным хаком для IE 6


1
2
3
4



.Box { 
width:100px; /*для всех браузеров*/
-width:110px;/*только для IE 6*/
}

 

Подобные хаки существуют практически для всех браузеров и всех версий, если ко му интересно то вы можете сами найти в интернете хаки вам не обходимые. Данный способ лично для меня является не совсем удобным так как при большой вёрстке сайта можно запутаться где что и как. Поэтому однажды меня натолкнула мысль коль все браузеры по разному интерпретируют CSS стили то для чистоты кода можно вед написать скрипт которые при загрузки сайта будет определять браузер и версию и грузить отдельный специально заготовленный стиль CSS под этот браузер. Остаётся выбрать на каком языке его написать я на тот момент выбрал PHP и вот что у меня получилось

phh код
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
<link rel="stylesheet" type="text/css" media="all"  href="/css/<?php
$nav = ( isset( $_SERVER['HTTP_USER_AGENT'] ) ) ? strtolower( $_SERVER['HTTP_USER_AGENT'] ) : '';
 
 
// для браузера Mozila и FireFox
 
if (stristr($nav, "firefox"))
{
echo "firefoxonly.css";
}
 
// для браузера Opera
 
elseif (stristr($nav, "opera"))
{
echo "template.css";
}
 
// для браузера Safari
 
elseif (stristr($nav, "safari"))
{
echo "safari.css";
}
// для браузера Google Chrome
 
elseif (stristr($nav, "chrome"))
{
echo "chrome.css";
}
 
// для браузера IE 6
 
elseif (stristr($nav, "IE 6"))
{
echo "ieonly.css";
}
 
// для браузера IE 7
 
elseif (stristr($nav, "IE 7"))
{
echo "ie7only.css";
}
 
// для браузера IE 8
 
elseif (stristr($nav, "IE 8"))
{
echo "ie8only.css";
}
 
// Для всех прочих браузеров
 
else
{
echo "template.css";
}
 
?>" />

 


Данный код вам надо вставить в тег HEAD он же отвечает за подключение стилей и создать в корне сайта папку css в ней разместить файлы : firefox.css, template.css, safari.css, chrome.css, ieonly.css, ie7only.css, ie8only.css. В каждом файле будет полная таблица стилей для сайта соответствующему браузеру. Единственное за основу мною взят браузер Opera и ему соответствует css : template.css так же для всех остальных браузеров которых нету в коде скрипта он тоже будет использоваться. Мне некоторые говорят о так это придётся писать с нуля CSSски для всех браузеров это долго. Нет не придётся я отвечаю всем я делаю очень просто когда занимаюсь вёрсткой дизайна сайта: при вёрстке дизайна начинайте прописывать стили в файле template.css и смотрите как будет выглядеть сайт в Opere после того как вы закончите верстку вы просто выделите всё содержимое файла template.css и скопируйте его во все остальные файлы предназначены для других браузеров сохраните этот код и откройте ваш сайт в других браузерах и посмотрите чем отличается дизайн и отображение от вашего и уже те моменты которые вы считаете отображаются не так вы можете подправить в нужном вам файле. Вот собственно и всё!

Метки:
Последнее обновление 29.08.12 15:38
 

Комментарии  

 
0 #22 Britney 23.01.2017 19:24
Some of the writing services I had used had unprofessional support.
Even though the papers were fine, I had no desire to order from them again because the managers were just too annoying and
unhelpful. But this one is perfect! They hire a very good staff,
both writers and the support team. Now if I need someone to write
my essay I order from them!|

my homepage :: essay about my hometown kelantan: http://getessay.click/3-essay-help/oedipus-the-king-essays.php
Цитировать
 
 
0 #21 Madelaine 19.01.2017 21:36
|

my web site - research paper
preparation: http://getessay.click/1-essay-writing/essay-writer-website.php
Цитировать
 
 
0 #20 Shirleen 19.01.2017 11:05
I work and there’s not much time left for the writing assignments.
Especially if I don’t like the subject. I just can’t start writing it.

So I had found this writing service and ordered
almost all my papers from them! The prices are decent and the quality is superb!

I don’t think I will try another service anytime
soon.|

my web-site; essay on following school rules: http://getessay.click/9-how-to-write/custom-writers.php
Цитировать
 
 
0 #19 Jacquie 13.01.2017 10:55
I got in contact with this service and asked them to write my dissertation, when I
understood that I was lacking of time. Their writers managed to make
a really good dissertation for me in less than two weeks.
I’m more than satisfied with the result and can’t stop smiling when I’m looking at it lying ready on my table without
any extra efforts from my side.|

Here is my web-site :: scarlet letter
character analysis essay hester: http://getessay.click/1-essay-writing/essay-experts.php
Цитировать
 
 
0 #18 Elias 11.01.2017 14:06
I had to write a research paper in Psychology
and it appeared to be much harder than I expected. So I realized that I needed someone
to write my paper. Otherwise I would have failed.

This service helped me out. The writers are real experts!
Highly recommend!|

Also visit my site: politics essay: http://getessay.click/6-assigment-writing/article-writers-wanted.php
Цитировать
 
 
0 #17 Isidra 06.01.2017 16:11
From time to time I place orders on the writing services so
that their writers would write my papers. This one is my favorite.
I have already ordered 6 essays from them and they have never failed to meet the deadlines.
Moreover, the papers were really great!|

Also visit my web site :: writing pro and con thesis statement: http://getessay.click/3-essay-help/customized-essays.php
Цитировать
 
 
0 #16 Martina 30.12.2016 12:29
From time to time I place orders on the writing services so that their writers would write my papers.
This one is my favorite. I have already ordered 6 essays
from them and they have never failed to meet the deadlines.
Moreover, the papers were really great!|

my web blog; reflective essay intro: http://getessay.click/1-essay-writing/essay-prewriting.php
Цитировать
 
 
0 #15 Janine 24.12.2016 00:29
I was looking for someone who would write my essay, because I work and have no time for it.
Their writers performed me a great paper in 24 hours and it didn’t even need a revision.
Very nice!|

Here is my webpage - reasons
to transfer colleges essays: http://getessay.click/9-how-to-write/owl-online-writing.php
Цитировать
 
 
-2 #14 Russl 30.01.2013 12:52
Цитирую Shumaher:
чувак, код конечно полезный, но пользуйся ЗАПЯТЫМИ в тексте! что за тупость?
очень сложно читать

скорее это ты тупой раз сложно читать :lol:
Цитировать
 
 
+1 #13 Дмитрий 24.01.2013 17:48
Попробовал для джумлы - не пашет.
Цитировать
 

Добавить комментарий


Защитный код
Обновить

 

Интернет магазин

inet_small

icon66 Система управление

icon66Шаблон на выбор

icon66Контент

ещё...

Сайт-визитка

vizitka_small

icon66 Система управление

icon66Логотип

icon66Контент

ещё...

Корпоративный сайт

korporaciya_small

icon66 Система управление

icon66Дизайн

icon66Контент

ещё...

Смотреть все...