iBird Rose

да. нормально. но не забудь про clearfix. иначе если высота блоков разная - все поплывет.

<div class="container">
    <div class="row">
        <div class="col-xs-6 col-sm-3">
            <img...>
        </div>
        <div class="col-xs-6 col-sm-3">
            <img...>
        </div>
        <div class="clearfix visible-xs"></div> // через каждые 2
        <div class="col-xs-6 col-sm-3">
            <img...>
        </div>
        <div class="col-xs-6 col-sm-3">
            <img...>
        </div>
        <div class="clearfix visible-xs"></div>
        <div class="clearfix visible-sm visible-md visible-lg"></div> // через каждые 4
        <div class="col-xs-6 col-sm-3">
            <img...>
        </div>
        <div class="col-xs-6 col-sm-3">
            <img...>
        </div>
        <div class="clearfix visible-xs"></div>
        <div class="col-xs-6 col-sm-3">
            <img...>
        </div>
        <div class="col-xs-6 col-sm-3">
            <img...>
        </div>
   </div>
</div

а что не так? по умолчанию :selected первый элемент. его и выдает. у тебя нет события на изменение значений при клике там или при выборе селекта

через css никак

скорее всего ты путаешь модальное окно с каким нибудь popover getbootstrap.com/docs/3.3/javascript/#popovers

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

самое простое решение
white-space: nowrap; для .block-s
а нормальное решение - менять не width элемента а position или translateX.

это зависит только от вида использования. К примеру, если ты майнить будешь 24/7, то как ее не охлаждай(хоть азотом) - видяха все равно сдохнет через год.

Если это не обходимо, то почему бы и нет? какая тебе разница писать src для тега img или писать style для дива.

для этого есть flex. либо сам пиши, либо бери 4 версию бутстрапа https://getbootstrap.com/docs/4.0/layout/grid/

Не создавать же свой отдельный CSS файл для каждой страницы, а если писать все в один CSS файл, то можно и запутаться в стилях

тут есть 2 варианта:
1) Создавать отдельные css - и потом с помощью, к примеру сборщиков(gulp), объединять все эти файлы в один.
2) нормально документировать свой css, тогда не запутаешься. Даже крупные сайты имеют css файлы не больше пару тыщ строк. если нормально писать комментарии - запутаться сложно.

Как загружает браузер стили

грузят все и сразу

Как. работает разговорный чат бот?

как программист написал - так иработает.

Бот общаеться с человеком, даже может выполнить какие либо команды.

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

Может есть какие либо сервисы ?

Сервисов чат-ботов для полно. Введи такой запрос в гугле и смотри любой из чат ботов. Конечно же большинство из них будут просто отвечать на команды.