Php table td font color

Добавление цвета строки альтернативной таблицы PHP в существующую таблицу HTML

У меня есть таблица, уже написанная на PHP, которая выводит данные из базы данных следующим образом:

 Pages     php while ($row = mssql_fetch_array($result)) < ?>  ?> 
 
 Page Name 
 
 
 
">    
 
 
 
    

Я пытаюсь чередовать цвета строк, используя фрагмент PHP, и после некоторых исследований это реализовано:

Кажется, он работает некорректно, поэтому я чувствую, что где-то ошибаюсь, я знаю, что есть более длительные способы реализации этого, который я мог бы реализовать. Я просто надеялся на что-то простое. Я трачу усилия, пытаясь реализовать его таким образом?

Я включил его следующим образом:

Это вроде работы, но по какой-то причине самая первая запись – синяя . когда я указал белый и серый.

Вы можете использовать следующее при прохождении результатов, возвращаемых с вашего db:

Кроме того, вы можете заменить теги bgcolor и назначить класс CSS для каждой строки.

Используйте селектор CSS :nth-of-type( ) .

Помещая разные стили для :nth-of-type(even) и :nth-of-type(odd) браузер выполняет альтернативный стиль для вас, поэтому вам не придется беспокоиться об этом.

См. Запись W3Schools на этом.

bgcolor="#eeeeee" else< ?>bgcolor="red" $i++; ?>> 

Спасибо Bas van den Heuvel за отличный ответ, используя CSS. Если вы столкнулись с дополнительным расстоянием между строками, как и я, и хотите удалить его, используйте следующий примерный код. Это заставит чередующиеся цветные линии быть более плотными вместе. (Я использовал светло-серый и белый)

p:nth-of-type(odd) < background:#e2e2e2; margin: 0px; padding: 0px; >p:nth-of-type(even)

Источник

HTML тег

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

Если вам необходимо подчеркнуть, что данные в других ячейках отсутствуют, создайте ячейку без содержимого в необходимом месте.

Добавленные браузером ячейки не имеют рамок, и если они находятся друг за другом, то будут отображаться в виде одной объединенной ячейки.

Синтаксис

Пример

html> html> head> title>Заголовок документа title> style> th, td < padding: 10px; border: 1px solid #666; > style> head> body> table style="width:80%; margin:30px auto; border-collapse:collapse;"> tr style="background-color:#1c87c9; color:#fff;"> th>Месяц th> th>Дата th> tr> tr style="background-color:lightgrey;"> td>Март td> td>10.09.2018 td> tr> tr style="background-color:lightgrey;"> td>Июнь td> td>18.07.2018 td> tr> table> body> html>

Результат

Пример с атрибутом colspan

html> html> head> title>Заголовок документа title> style> th, td < padding: 10px; border: 1px solid #666; > style> head> body> table style="width:80%; margin:30px auto; border-collapse:collapse;"> tr style="background-color:#1c87c9; color:#fff;"> th>Эл. почта компании th> th>Дата th> tr> tr> td style="background-color:#e6ebef;">a href="#">[email protected] a> td> td style="background-color:#e6ebef;">01.09.2017 td> tr> tr style="height:60px; background-color:#e6ebef;"> td colspan="2" valign="bottom" style="background-color:#a3cced;">[email protected]; strong>01.09.2017 strong>span style="font-size:14px;">(received date) span> td> tr> table> body> html>

Результат

Пример с атрибутом rowspan

html> html> head> title>Заголовок документа title> style> th, td < padding: 10px; border: 1px solid #666; > style> head> body> table style="width:80%; margin:30px auto; border-collapse:collapse;"> tr style="background-color:#1c87c9; color:#fff;"> th>Месяц th> th>Год th> tr> tr> td style="background-color:#e6ebef;">Март td> td rowspan="2" style="background-color:#a3cced; text-align:center;">2014 td> tr> tr style="background-color:#e6ebef;"> td style="background-color:#e6ebef;">Июнь td> tr> table> body> html>

Результат

Атрибуты

Атрибут	Значение	Описание
abbr	text	Определяет сокращенный вариант содержимого ячейки, либо выступает в роли альтернативного текста.
align	left right center justify char	Выравнивает содержимое ячейки данных таблицы. Не поддерживается в HTML5.
axis	category_name	Задает группировку ячеек, связанных между собой похожей информацией. Не поддерживается в HTML 5.
background	background	Задает фоновый рисунок в ячейке. Не поддерживается в HTML 5.
bgcolor	rgb(x,x,x) #xxxxxx colorname	Задает цвет фона ячейки таблицы. Не поддерживается в HTML 5.
bordercolor	bordercolor	Задает цвет рамки. Не поддерживается в HTML 5.
char	character	Выравнивает содержимое ячейки данных таблицы по заданному символу. Атрибут char используется только если атрибут align = «char». Не поддерживается в HTML 5.
charoff	number	Атрибут позволяет произвести выравнивание в ячейке данных с указанного в атрибуте символа вправо или влево. Атрибут charoff используется только, если атрибут align = «char». Не поддерживается в HTML 5.
colspan	number	Атрибут определяет количество столбцов, которое ячейка должна охватывать. Значение атрибута должно быть положительным целым числом. Не рекомендуется использовать значения свыше 1000, т.к. они могут быть сокращены до этого числа. Значение по умолчанию 1.
headers	header_id	Указывает id одной или нескольких заголовок ячеек, которые определяются HTML тегом	. Атрибут не отображается в браузере, но может быть использован для чтения с экрана или в работе скриптов.
height	% pixels	Задает высоту ячейки. Не поддерживается в HTML 5.
nowrap	nowrap	Указывает, что содержание в ячейке не должно переноситься. Не поддерживается в HTML 5.
rowspan	number	Атрибут определяет количество строк, которые ячейка данных должна охватывать. Значение атрибута должно быть положительным целым числом. Не рекомендуется использовать значения свыше 65534, т.к. они могут быть обрезаны до этого числа. Значение по умолчанию 1.
scope	col colgroup row rowgroup	Задает способ связывания заголовочной ячейки (HTML тег	) с ячейками данных в таблице. Не поддерживается в HTML 5.
valign	top middle bottom baseline	Задает вертикальное выравнивание содержимого в ячейке данных. Не поддерживается в HTML 5.
width	% pixels	Задает ширину ячейки данных. Не поддерживается в HTML 5.

Как добавить стиль к тегу ?

Распространенные свойства для изменения визуальной насыщенности/выделения/размера текста внутри тега :

• CSS свойство font-style задает стиль шрифта: normal | italic | oblique | initial | inherit
• CSS свойство font-family создает приоритетный список названий семейства шрифтов и/или общее имя шрифтов для выбранных элементов.
• CSS свойство font-size задает размер щрифта.
• CSS свойство font-weight устанавливает насыщенность шрифта.
• CSS свойство text-transform задает регистр текста (заглавные или строчные буквы).
• CSS свойство text-decoration устанавливает оформление текста. Оно является сокращенным свойством для text-decoration-line, text-decoration-color, text-decoration-style.

Цвет текста внутри тега :

Стили форматирования текста для тега :

• CSS свойство text-indent указывает размер отступа первой строки в текстовом блоке.
• CSS свойство text-overflow указывает, как будет отображаться пользователю строчный текст, выходящий за границы блока.
• CSS свойство white-space указывает, как будут отображены пробелы внутри элемента.
• CSS свойство word-break указывает перенос строки.

Другие свойства для тега :

• CSS свойство text-shadow добавляет тень к тексту.
• CSS свойство text-align-last выравнивает последнюю строку текста.
• CSS свойство line-height устанавливает межстрочный интервал.
• CSS свойство letter-spacing устанавливает расстояние между буквами/символами в тексте.
• CSS свойство word-spacing устанавливает расстояние между словами в тексте.

Источник

Как создать в php: 2 строки цвета таблицы со шрифтом 3 цвета

но я хочу быть таким: таблица с двумя строками таблицы цветов и 3 цветами шрифта с итерацией цикла. что мне делать с кодом? возможно, я должен сделать этот цвет шрифта в 3 условия (синий, красный, желтый). но я не знаю, как код

3 ответа

Хотя вы, возможно, попытаетесь сделать это в CSS. РЕДАКТИРОВАТЬ После вашего комментария. Ниже приведены вложенные операторы if. Довольно подробный. В принципе, один внешний, если проверять, равен $ i, делится на 2. Затем в пределах этого проверки, является ли он делимым на 3, или что остаток

    ' . $i . ''; > else < if (($i % 3) == 1) < echo ' ' . $i . ''; > else < echo ' ' . $i . ''; > > > else < if (($i % 3) == 0) < echo ' ' . $i . ''; > else < if (($i % 3) == 1) < echo ' ' . $i . ''; > else < echo ' ' . $i . ''; > > > > ?> 

Вы можете использовать не вложенные операторы if, но тогда вы можете просто использовать переключатель:

    ' . $i . ''; break; case ($i % 2) == 0 AND ($i % 3) == 1: echo ' ' . $i . ''; break; case ($i % 2) == 0 AND ($i % 3) == 2: echo ' ' . $i . ''; break; case ($i % 2) == 1 AND ($i % 3) == 0: echo ' ' . $i . ''; break; case ($i % 2) == 1 AND ($i % 3) == 1: echo ' ' . $i . ''; break; case ($i % 2) == 1 AND ($i % 3) == 2: echo ' ' . $i . ''; break; default: // This should never happen break; > > ?> 

Вы также можете сохранить необходимость в явном выражении if/switch и просто настроить несколько массивов и вычислить модуль, который будет использоваться в качестве индекса для массива. Это имеет то преимущество, что оно компактно и легко расширяется:

   "#90EE90", 1=>"#8FBC8F"); $font_array(0=>"#blue", 1=>"#yellow", 2=>"#red"); for($i = 1; $i  ' . $i . ''; > ?> 

Спасибо за коды Кикстарт, Гильерме Феррейра, сержант BOSE. Я очень ценю это. Но в этом случае я хочу понять, как использовать «если условие». И не могли бы вы дать вышеприведенное решение, чтобы предоставить примеры кода с использованием вложенного / множественного «если еще» и объяснить это? спасибо всем вам

Я добавил еще несколько примеров и небольшое количество объяснений. Надеюсь, другие примеры дадут вам представление о том, какой стиль вам нравится / не нравится.

Источник