Добрый вечер! Вывожу значение температуры с Ардуино через ESP8266 с прошивкой esp-link. Значение температуры выводится на на html страницу. Хотел с помощью разметки сделать знак градусов цельсия, в котором буква о в верхнем индексе и С.
Код страницы ниже:

Разобрался как сделать вывод градусов цельсия в разметке html:

Но не могу понять, как эту конструкцию добавить в строку вывода значения температуры.
В примере, с которым разбираюсь, знак Цельсия добавлен в код Ардуино в строку, которая передается на страницу html

Если кто-то подскажет как это возможно реализовать, буду рад. Спасибо за помощь.
Вот вид страницы в данный момент

Чтобы вывести значок градуса, надо не "о" поднимать, а использовать спецсимвол.
° или °
Ну и втыкать их в строчку:
t += " C";
по идее как то так:
t += "°C";
Вероятно заработает.

Спасибо, оно самое, работает.

А так для общего развития, не подскажете,если необходимо в тоже строке, где я вывожу значение температуры со знаком градусов вывести еще поясняющий текст. Как его правильно добавить в html код
Вот в этот блок
<div class="content">
<p id="temp" align="center" style="font-size: 500%" />
</div>
Я только учу html, потому не понятно.

PCBWay - всего $5 за 10 печатных плат, первый заказ для новых клиентов БЕСПЛАТЕН

Сборка печатных плат от $30 + БЕСПЛАТНАЯ доставка по всему миру + трафарет

Онлайн просмотровщик Gerber-файлов от PCBWay + Услуги 3D печати

Смотря что требуется добавить.
И опять же, учебников и уроков по HTML в сети море. Ничего сложного там нет.

Организация питания на основе надежных литиевых аккумуляторов EVE и микросхем азиатского производства

Качественное и безопасное устройство, работающее от аккумулятора, должно учитывать его физические и химические свойства, профили заряда и разряда, их изменение во времени и под влиянием различных условий, таких как температура и ток нагрузки. Мы расскажем о литий-ионных аккумуляторных батареях EVE и нескольких решениях от различных китайских компаний, рекомендуемых для разработок приложений с использованием этих АКБ. Представленные в статье китайские аналоги помогут заменить продукцию западных брендов с оптимизацией цены без потери качества.

Подробнее>>

Да согласен с Вами, литературы много. Скачал много книг , да и в онлайне на сайтах много информации. Но интересует, допустим как перед значением температуры вывести поясняющую надпись.
пытался вклинить в блок со строкой

Но видимо, что-то делал не так.
Если не сложно, подскажите как сделать так:

А дальше уже буду разбираться, что к чему.
ЗЫ: Также насколько правильно было добавить обозначение градуса и символ С в строку со значением температуры в Ардуино, а не просто передавать строку с температурой?

Новый аккумулятор EVE серии PLM для GSM-трекеров, работающих в жёстких условиях (до -40°С)

Компания EVE выпустила новый аккумулятор серии PLM, сочетающий в себе высокую безопасность, длительный срок службы, широкий температурный диапазон и высокую токоотдачу даже при отрицательной температуре. Эти аккумуляторы поддерживают заряд при температуре от -40/-20°С (сниженным значением тока), безопасны (не воспламеняются и не взрываются) при механическом повреждении (протыкание и сдавливание), устойчивы к вибрации. Они могут применяться как для автотранспорта (трекеры, маячки, сигнализация), так и для промышленных устройств мониторинга, IoT-устройств.

Подробнее>>

Тег <p> требует и закрывающий тег </p> у вас не увидел. Поэтому включил символ в строку вывода ардуино.
Приведите код шаблона, то что вы привели явно обрубок.

Без шаблона, только на вывод, вместо изначальных 3 строк:

String t = "В комнате:&nbsp;" + floatToString(tempC) + "&deg;C";
webServer.setArgString(F("temp"), t.begin());

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

Добрый вечер!
Дело в том, что конструкция

выводит значение температуры, которую измеряет Ардуино. Когда я изменил эту строку в вид

Пропало значение отображаемой температуры с web-страницы
Я искал по интернету, но не нашел в каком случае используется закрывающая скобка в верхней строке, а в каком случае в нижней строке.
Вот код страницы, выводящей температуру

Спойлер

// подключим необходимые библиотеки
#include <ELClientWebServer.h>
#include <OneWire.h>
#include <DallasTemperature.h>

float tempC = 0; // измеренная температура

// сигнальный провод подключен к 10 пину на Arduino
#define ONE_WIRE_BUS 10

// выберем разрешение от 9 до 12
#define TEMPERATURE_PRECISION 12

// настроим библиотеку 1-Wire для связи с датчиком
OneWire oneWire(ONE_WIRE_BUS);

// создадим объект для работы с библиотекой DallasTemperature
DallasTemperature sensors(&oneWire);

// создаем массив для хранения адреса датчика
DeviceAddress Thermometer;

// цикл измерения температуры
void tempLoop()
{
// отправляем запрос на измерение температуры
sensors.requestTemperatures();
// присваиваем переменной tempC текущее значение температуры в градусах Цельсия
tempC = sensors.getTempC(Thermometer);
}

// sprintf %f не поддерживается в Arduino...
String floatToString(float f)
{
int16_t intg = (int16_t)(f * 100.f);
int16_t int_part = intg / 100;
int16_t fract_part = intg % 100;

char buf[20];
sprintf(buf, "%d.%02d", int_part, fract_part);

return String(buf);
}

String arrayToString(byte array[])
{
unsigned int len = 8;
char buf[20];
for (unsigned int i = 0; i < len; i++)
{
byte nib1 = (array[i] >> 4) & 0x0F;
byte nib2 = (array[i] >> 0) & 0x0F;
buf[i*2+0] = nib1 < 0xA ? '0' + nib1 : 'A' + nib1 - 0xA;
buf[i*2+1] = nib2 < 0xA ? '0' + nib2 : 'A' + nib2 - 0xA;
}
buf[len*2] = '\0';
return String(buf);
}

void tempRefreshCb(char * url)
{
// вычисляем значение температуры
String t = floatToString(tempC);
t += " &deg;C";
webServer.setArgString(F("temp"), t.begin());
String a = arrayToString(Thermometer);
webServer.setArgString(F("address"), a.begin());
}

// настройка страницы
void tempInit()
{
// инициализируем работу с датчиком
sensors.begin();

// сделаем запрос на получение адреса датчика
sensors.getAddress(Thermometer, 0);

// установим выбранное разрешение датчика
sensors.setResolution(Thermometer, TEMPERATURE_PRECISION);

URLHandler *tempHandler = webServer.createURLHandler(F("/Temp.html.json"));

tempHandler->loadCb.attach(tempRefreshCb);
tempHandler->refreshCb.attach(tempRefreshCb);
}

ЗЫ: вот код страницы, интересует как средствами HTML добавить текст в той же строке где и выводимые переменные, перед значением и после

Верни html конструкцию в вид когда всё работало, она тебе не нужна.
В строке temp - это метка куда нужно вписать данные, а t - что нужно записать.
Что-бы перед температурой вывести надпись, то нужно её передать в переменную t до передачи в неё значения температуры.
Как тебе написал AndTer, замени свой код на следующий:

Для прощего понимания можно записать по другому?

Я понял, в html это сделать трудновато. А не подскажете, что это за конструкция
<p id="temp" align="center" style="font-size: 500%" />
искал по html справочникам, но нигде похожего синтаксиса не нашел.

p это тег абзаца http://htmlbook.ru/html/p

в Вашем случае применяется с закрывающим тегом по упрошенной записи <p /> вместо <p> </p>

style="font-size: 500%" это Встроенные стили. задает размер шрифта

align="center" это атрибут тега, задает выравнивание

id="temp" также атрибут. ID. может применяться для присвоения стилей или для идентификации объекта Java Script`ом для определенных с ним действий. например для динамического заполнения содержимым

как то так

добавить текст можно в HTML шаблоне через CSS



решение, конечно через жопу

Что трудновато сделать в html? Html это всего лишь язык разметки страницы. Кстати, а зачем тебе арудино для работы с датчиком температуры, если ESP может напрямую работать с DS18b20?

в конструкцию будет подставляться температура

khomych, спасибо. Оно самое. Все работает как нужно было.