Лента Каталог Файлы Форумы Услуги
ОсновноеRadiotalkПользовательское
Программирование
6   •   Посмотреть все темы

Основы CSS

 
1 ... 4 5 6

2970
удалён @Foggy
tonik, чтобы жирно не выглядело, можно цвет из #333 перевести в цвет с альфа-каналом rgba(51,51,51,0.3) - последнее число это степень прозрачности.

1410
Антон @tonik
Foggy пишет:

tonik, чтобы жирно не выглядело, можно цвет из #333 перевести в цвет с альфа-каналом rgba(51,51,51,0.3) - последнее число это степень прозрачности.

Спасибо) я просто уменьшил сдвиг по горизонтали)

4619
Web3r @Web3r
Есть такая хрень: <font class="me">TEXT</font>
В css следуюее: .me{display:block;padding:1px 0;background:black}
В Chrome и ff блок растягивается на 100% страницы, в Opera только по контенту. Как пофиксить?

1555
Алексей @TheDark
Weber пишет:

Есть такая хрень: <font class="me">TEXT</font>
В css следуюее: .me{display:block;padding:1px 0;background:black}
В Chrome и ff блок растягивается на 100% страницы, в Opera только по контенту. Как пофиксить?

width: 100%; не?
вобще хз.. лично я так решал подобные проблемы.

3173
Николай @grom
на сколько я знаю только при загрузке страницы с css вытягивает данные, ну или идет рефреш или прочее. А что такое вытянуть из файла месколько десятков строк из файла - мелочь.

2970
удалён @Foggy
не очень понимаю, что значит "по делу", но ладно.
css совсем лёгок в сравнении с картинками. и если думать об оптимизации страницы, то оптимизировать (или удалять) лучше второе.
[spoiler=если понимать слово "грузит" как зависания]css для рендеринга (отрисовки) страницы может быть вреден в случае, если много правил наследования типа ~ , p:nth-of-type(22) , div:not(.foo) и тому подобных. в таком случае скорость загрузки css-файла такая же, как если бы это были обычные css правила, но установка их на страницу сильно нагружает процессор (именно его, если в настройках браузера это не переключено на видеокарту), поэтому происходит не быстро.[/spoiler]

Отредактировано Foggy - 12.09.2012
7094
Dim @Render
CSS - статичен, браузер выкачивает этот файл всего 1 раз. Файл стилей находится в кеше и далее подгружается в основном именно из кеша, следовательно о весе файла, можно не беспокоится.
Но и делать файл стилей весом в ~1-5Mb, тоже глупо. Содержимое файла - совсем другое. Влияние всякого рода теней, подсветок и прочих последних "модностей", значительное, в частности на производительность открытой странички, с подобными стилями.

А вообще...
Грузит ли документ css страницу,если в нем много инфы,но инфа вся по делу?

Хоть бы сам попробовал на свой вопрос ответить что-ли, мозг сломать можно пока поймёшь его смысл.

Отредактировано Render - 12.09.2012
1410
Антон @tonik
Здравствуйте.
Я так думаю, что вопрос в эту тему...
Есть заголовок короткой новости:


Содержание шаблона:
<li style="padding-bottom:10px;"><span style="color:#AAA; font-size:9px;">{date}</span> {link} <img src="{THEME}/img/icon/coment.png" alt="Комментариев" title="Комментариев" width="9px" height="10px" /> <span style="color:#AAA; font-size:9px;">{comments-num}</span></li>

Как подровнять вторую строку заголовка по красной линии...
(извините, если не внятно сформулировал)

602
Ventage @new1
Спасибо за ответы, в будущем буду задавать более правильные вопросы)

2970
удалён @Foggy
tonik пишет:

Здравствуйте.
Я так думаю, что вопрос в эту тему...
Есть заголовок короткой новости:
**********

Содержание шаблона:
<li style="padding-bottom:10px;"><span style="color:#AAA; font-size:9px;">{date}</span> {link} <img src="{THEME}/img/icon/coment.png" alt="Комментариев" title="Комментариев" width="9px" height="10px" /> <span style="color:#AAA; font-size:9px;">{comments-num}</span></li>

Как подровнять вторую строку заголовка по красной линии...
(извините, если не внятно сформулировал)

<li style="padding-bottom:10px;"><span style="color:#AAA; font-size:9px;float:left;">{date}</span><div style="margin-left:70px;"> {link} <img src="{THEME}/img/icon/coment.png" alt="Комментариев" title="Комментариев" width="9px" height="10px" /> <span style="color:#AAA; font-size:9px;">{comments-num}</span></div></li>
отступ сделай какой удобно. дата обычно не сильно варьируется в ширине, поэтому можно сделать фиксированную.

Отредактировано Foggy - 13.09.2012
1410
Антон @tonik
Foggy пишет:

<li style="padding-bottom:10px;"><span style="color:#AAA; font-size:9px;float:left;">{date}</span><div style="margin-left:70px;"> {link} <img src="{THEME}/img/icon/coment.png" alt="Комментариев" title="Комментариев" width="9px" height="10px" /> <span style="color:#AAA; font-size:9px;">{comments-num}</span></div></li>
отступ сделай какой удобно. дата обычно не сильно варьируется в ширине, поэтому можно сделать фиксированную.

Спасибо, помогло!
Только, по всей видимости, из-за дива заголовок прыгнул ниже даты на строку. Пришлось добавить: margin-top:-20px;

1410
Антон @tonik
Попытался взять дату в ячейку с фоном и рамкой:

<li style="padding-bottom:10px;"><b><span style="color:#999; font-size:10px; border-collapse: collapse; background: #dc0; border: 4px solid #000; padding: 5px; border: 2px solid green;">{date}</span><div style="margin-left:100px; margin-top:-20px;"> {link} <img src="{THEME}/img/icon/coment.png" alt="Комментариев" title="Комментариев" width="9px" height="10px" /> <span style="color:#AAA; font-size:9px;">{comments-num}</span></div></li>

Ноль эффекта, подскажите, что не так сделал?

2970
удалён @Foggy
********** тебе точно не нужен, ибо это не таблица.

а вообще не понимаю, что не так. бордюр есть, фон есть.
либо давай ссылку на пример, либо воссоздай его в **********.

UPD:
я бы все эл-ты сделал дивами. и ещё ты <b> не закрыл.

Отредактировано Foggy - 13.09.2012
4619
Web3r @Web3r
В: Как растянуть дочерний div на 100% страницы, при условии, что родительский div имеет фиксированную ширину, скажем, в 800px?

<div id="wrapper" style="width:800px">
<div id="test">Необходимо вытянуть этот div на 100% страницы</div>
</div>

P.S Менять структуру кода нельзя (т.е. порядок div'ов).

Отредактировано Web3r - 16.09.2012
2970
удалён @Foggy
хз, делал это когда-то, но не помню, как. попробуй ********** модифицировать.

4619
Web3r @Web3r
Foggy, нет, fixed не вариант. Оно вместе со скролом прокручивается.

6600
Александр @admiral
Как то так?)
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="content-type" content="text/html" />
<meta name="author" content="admitrichenko" />
<meta http-equiv="content-type" content="text/html; charset=windows-1251">
<title>z-index</title>
<style>
body { margin: 0; }
#wrapper { z-index: 1; width: 800px; height: 60px; background-color: #00ff00; }
#test { z-index: 2; position: absolute; width: 100%; height: 40px; top: 10px; background-color: #ff0000; }
</style>
</head>
<body>
<div id="wrapper">
<div id="test">Необходимо вытянуть этот div на 100% страницы</div>
</div>
</body>
</html>
Или еще так:
#test { z-index: 2; position: absolute; width: 100%; height: 100%; top: 10px; background-color: #ff0000; }

1555
Алексей @TheDark
Как думаете почему в IE11 не работают свойства CSS3 (в частности box-shadow и rgba)?
Я просто решил проверить один из своих сайтов в IE11 и слегка офигел...
Win8.1, если что.

4619
Web3r @Web3r
TheDark пишет:

Как думаете почему в IE11 не работают свойства CSS3 (в частности box-shadow и rgba)?
Я просто решил проверить один из своих сайтов в IE11 и слегка офигел...
Win8.1, если что.

Должно работать. Может, он у тебя эмулирует IE8?
<meta http-equiv="x-ua-compatible" content="IE=edge">

1555
Алексей @TheDark
Web3r, о, вот эта штука помогла)) что это?