Как вывести математическую формулу в WEB-документ с помощью HTML и CSS? / HTML, JavaScript, VBScript, CSS

ReSQL.ru

Мобильная версия Контакт Правила FAQ Помощь

Гость

Войти | Регистрация | Профиль | Очистить

Новые сообщения | Избранное

Форумы | Пользователи | Статистика | Мод. лог | Поиск

Цитировать

Написать

Автор*:

Ввести пароль для входа

Тема*:

Сообщение

Данное сообщение тематическое

Сообщение содержит картинки или видео 18+

Автор:

ВНИМАНИЕ! На данном подфоруме действуют строгие правила. Удостоверьтесь, что ваше сообщение соответствует им!

Форум или тема закрыты для гостей. Необходима авторизация!

Загрузить последнюю сохраненную версию

Вложение:

Вставить как галерею

Максимальный размер вложений: 4,0 МБ, аудио/видео: 8,0 МБ. Картинки большего размера ужимаются, если возможно.

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

Отправляя сообщение, я выражаю свое согласие с правилами форума и принимаю пользовательское соглашение.

Доб. в избранное | Игнор. тему | Прикреп. тему | Пометить прочит. / непрочит. | Фильтр

Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Как вывести математическую формулу в WEB-документ с помощью HTML и CSS?

19 сообщений из 19, страница 1 из 1

Как вывести математическую формулу в WEB-документ с помощью HTML и CSS?

#36431785

leoCats

Гость

Столкнулся вот с такой задачей. Есть математическая формула которую пользователь вводит в текстовое поле.
Формула может содержать только 4 математические операции +, -, /, *. Далее необходимо вывести формулу в WEB-документ используя классическую математическую запись.
Вопрос заключается в том, как выводить дроби (какие тэги использовать: div, span или table и как правильно настроить CSS).
Второй вопрос в том, какой должен быть алгоритм построения математической формулы?

Использование MathML не подходит т.к. решение должно работать только для IE а этот WEB обозреватель не понимает MathML без дополнительных надстроек,
которые могут быть не установлены у юзера.

Уже написал лексический анализатор, который разбирает формулу на лексемы. Но пока не могу сообразить, как настроить HTML и CSS, а также придумать алгоритм вывода формулы на страницу.

Использую JavaScript или VBScript.

Помогите, пожалуйста!

...

Рейтинг:

0 / 0

26.01.2010, 16:08:45

| Ответить | Цитировать | Написать

Как вывести математическую формулу в WEB-документ с помощью HTML и CSS?

#36431942

michael R

Участник

Откуда: из-за границы

Сообщения: 2 168

Рейтинг: 0 / 0

может встраивать обьект word-а
как вариант

...

Рейтинг:

0 / 0

26.01.2010, 17:10:01

| Ответить | Цитировать | Написать

Как вывести математическую формулу в WEB-документ с помощью HTML и CSS?

#36431955

Ренат

Участник

Откуда: Елабуга & Казань & Москва & Набережные челны

Сообщения: 4 025

Рейтинг: 0 / 0

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

...

Рейтинг:

0 / 0

26.01.2010, 17:15:35

| Ответить | Цитировать | Написать

Как вывести математическую формулу в WEB-документ с помощью HTML и CSS?

#36431975

leoCats

Гость

Ренат,

да, проблема с дробями. А как например вывести такую формулу: 1/(1+4/(2+8))?

...

Рейтинг:

0 / 0

26.01.2010, 17:21:41

| Ответить | Цитировать | Написать

Как вывести математическую формулу в WEB-документ с помощью HTML и CSS?

#36431980

leoCats

Гость

michael Rможет встраивать обьект word-а
как вариант

michael R , я думал об этой идее, но к сожалению не нашёл пример использование OLE например Microsoft Equation. У Вас случайно примерчика не найдется?

Вторая причина по которой я отказался от этой идеи - нужно обрабатывать события при клике на разных элементах формулы. К сожалению OLE не позволит решить эту задачу. HTML, только HTML и CSS

...

Рейтинг:

0 / 0

26.01.2010, 17:24:02

| Ответить | Цитировать | Написать

Как вывести математическую формулу в WEB-документ с помощью HTML и CSS?

#36432327

Ренат

Участник

Откуда: Елабуга & Казань & Москва & Набережные челны

Сообщения: 4 025

Рейтинг: 0 / 0

leoCats Ренат,

да, проблема с дробями. А как например вывести такую формулу: 1/(1+4/(2+8))?

Код: plaintext

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.

<style>
div{
	text-align:center;
}
.drob{
	position:relative;
	width: 100 %;
	height: 100 %;
}
.line{
	height: 100 %;
	width:30px;
	float:left;

}
.up{
	position:absolute;
	top:0px;
	left:0px;
	width: 100 %;
	border-bottom:2px solid black;
}
.down{
	position:absolute;
	top: 50 %;
	left:0px;
	width: 100 %;
}
</style>
<div style="padding:10px;width:200px;height:50px;">
  <div class="drob">
    <div class="up">
     1 
    </div>
    <div class="down">
      <div class="line"> 1 </div>
      <div class="line">+</div>
      <div class="line">
        <div class="drob">
          <div class="up"> 4 </div>
          <div class="down">
            <div class="line"> 2 </div>
            <div class="line">+</div>
            <div class="line"> 8 </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

Чет не получилось у мну)

...

Рейтинг:

0 / 0

26.01.2010, 20:34:44

| Ответить | Цитировать | Написать

Как вывести математическую формулу в WEB-документ с помощью HTML и CSS?

#36432430

leoCats

Гость

<html>
<style type="text/css">
.fraction {display: inline; position: absolute; text-align: center; vertical-align: middle;}
.numerator {border-bottom: 1px solid black;}
.denominator {display: block;}
</style>
<body>
1 +
<span class="fraction">
<span class="numerator">X + 5</span>
<span class="denominator">2</span>
</span>
</body>
</html>

Не смотря на vertical-align: middle; дробь выравнивается по числителю, а должна по центру... Я что-то не так делаю?

...

Рейтинг:

0 / 0

26.01.2010, 21:58:56

| Ответить | Цитировать | Написать

Как вывести математическую формулу в WEB-документ с помощью HTML и CSS?

#36432446

Ренат

Участник

Откуда: Елабуга & Казань & Москва & Набережные челны

Сообщения: 4 025

Рейтинг: 0 / 0

vertical-align пашет тока у display:table-cell а не display:block какв твоем случае

...

Рейтинг:

0 / 0

26.01.2010, 22:17:52

| Ответить | Цитировать | Написать

Как вывести математическую формулу в WEB-документ с помощью HTML и CSS?

#36432687

leoCats

Гость

Подскажи, а как тогда изменить HTML и CSS что бы дробь по вертикали выравнивалась по центру всего выражения?

Пробовал display:table-cell, не получается.

...

Рейтинг:

0 / 0

27.01.2010, 08:09:34

| Ответить | Цитировать | Написать

Как вывести математическую формулу в WEB-документ с помощью HTML и CSS?

#36432837

krvsa

Участник

Откуда: г Волжский

Сообщения: 13 823

Рейтинг: 1 / 0

leoCatsА как например вывести такую формулу: 1/(1+4/(2+8))?
Я бы все сделал в табликах...

Код: plaintext

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.

<html>
<head>
<title> Попробуем </title> 
<style type='text/css'>
td {
	text-align: center;
}
.c {
	border-bottom: 1px solid;
}
</style>
</head>
<body>
	<table>
		<tr>
			<td class='c'> 1 
			</td>
		</tr>
		<tr>
			<td>
				<table>
					<tr>
						<td> 1  +
						</td>
						<td>
							<table>
								<tr>
									<td class='c'> 4 
									</td>
								</tr>
								<tr>
									<td>{ 2 + 8 }
									</td>
								</tr>
							</table>
						</td>
					</tr>
				</table>
			</td>
		</tr>
	</table>
</body>
</html>

Думаю алгоритм понятен...

...

Рейтинг:

0 / 0

27.01.2010, 09:56:05

| Ответить | Цитировать | Написать

Как вывести математическую формулу в WEB-документ с помощью HTML и CSS?

#36433162

Antonariy

Участник

Откуда: ☭

Сообщения: 80 221

Рейтинг: 0 / 0

А LaTeX-сервис не подойдет?

^{Jah loves you.}

...

Рейтинг:

0 / 0

27.01.2010, 11:43:29

| Ответить | Цитировать | Написать

Как вывести математическую формулу в WEB-документ с помощью HTML и CSS?

#36434727

leoCats

Гость

LaTeX-сервис не подойдет.

Формулу нужно писать на стороне клиента, без использования картинок. Только JavaScript (VBScript), HTML и CSS...

...

Рейтинг:

0 / 0

27.01.2010, 21:08:15

| Ответить | Цитировать | Написать

Как вывести математическую формулу в WEB-документ с помощью HTML и CSS?

#36434745

leoCats

Гость

krvsaДумаю алгоритм понятен...

Спасибо за пример!

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

...

Рейтинг:

0 / 0

27.01.2010, 21:26:51

| Ответить | Цитировать | Написать

Как вывести математическую формулу в WEB-документ с помощью HTML и CSS?

#36435176

krvsa

Участник

Откуда: г Волжский

Сообщения: 13 823

Рейтинг: 1 / 0

Думается мне что пора отделить мух от котлет... Т.е. есть две "не зависимые" друг от друга задачки...

1.
leoCatsНо мне пока не понятно как с помощью JavaScript (ну или VBScript) это делать...
На форуме есть примеры как:
- создать элемент
- как добавить в элемент другой элемент
- как в элемент написать какой-то текст

2.
leoCatsНадо придумать как перебирать лексемы и строить такие вот таблицы в таблице...
А вот это тоже можно выносить в другую, самомтоятельную тему. Можно даже в раздел "Программирование", если не делать привязки к языку... Т.е. как идею рассмотреть.

...

Рейтинг:

0 / 0

28.01.2010, 09:15:10

| Ответить | Цитировать | Написать

Как вывести математическую формулу в WEB-документ с помощью HTML и CSS?

#36437230

Green2

Модератор форума

Сообщения: 14 172

Рейтинг: 27 / 0

MathML это язык для представления формул...
По моему, есть его flash интерпретаторы.

Posted via ActualForum NNTP Server 1.4

...

Рейтинг:

0 / 0

28.01.2010, 19:52:13

| Ответить | Цитировать | Написать

Как вывести математическую формулу в WEB-документ с помощью HTML и CSS?

#36449543

leoCats

Гость

Подскажите пожалуйста как настроить DIV или SPAN с помощью CSS для вывода дроби?

С алгоритмом построения вроде бы разобрался. Хочу попробовать различные элементы для вывода выражения.

Вот пример, но не получается выровнять выражение вертикально по центру:

Код: plaintext

1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.

<html>
     <head>
          <style type="text/css">
               .fraction {display: inline; position: absolute; text-align: center; vertical-align: middle;}
               .numerator {border-bottom: 1px solid black;}
               .denominator {display: block;}
          </style>
     </head>
     <body>
           1  +
          <span class="fraction">
               <span class="numerator">X +  5 </span>
               <span class="denominator"> 2 </span>
          </span>
     </body>
</html>

Как настроить CSS что бы все выражение выравнивалось по центру?

...

Рейтинг:

0 / 0

04.02.2010, 13:56:20

| Ответить | Цитировать | Написать

Как вывести математическую формулу в WEB-документ с помощью HTML и CSS?

#36449632

krvsa

Участник

Откуда: г Волжский

Сообщения: 13 823

Рейтинг: 1 / 0

leoCats , начнём с того что СПАН не блочный элемент и предназначен для "выделения части информации внутри других тегов и установить для нее свой стиль". (с)

...

Рейтинг:

0 / 0

04.02.2010, 14:15:23

| Ответить | Цитировать | Написать

Как вывести математическую формулу в WEB-документ с помощью HTML и CSS?

#36449740

krvsa

Участник

Откуда: г Волжский

Сообщения: 13 823

Рейтинг: 1 / 0

Я бы вот такую структурку предложил...

Код: plaintext

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.

<html>
 <head>
<style type="text/css">
* {
	margin:  0 ;
	padding:  0 ;
}
.cont {
	height: 50px;
}
.unit {
	float: left;
	height:  100 %;
}
p.unit {
	/* авот тут бы и подровняться по вертикали */
}
.numerator {
	height:  50 %;
	text-align: center;
	border-bottom: 1px solid black;
}
.denominator {
	height:  50 %;
	text-align: center;
}
</style>
 </head>
 <body>
	<div class='cont'>
		<p class='unit'> 1  +</p>
		<div class="unit">
			<p class="numerator">X +  5 </p>
			<p class="denominator"> 2 </p>
		</div>
	</div>
 </body>
</html>

Но как равнять по центру вертикально х/з... Только таблички это делают нормально и кросбраузерно.
----------
Cache for Windows (x86-32) 2007.1.3 (Build 607) Wed Oct 17 2007 02:12:09 EDT

...

Рейтинг:

0 / 0

04.02.2010, 14:43:58

| Ответить | Цитировать | Написать

Как вывести математическую формулу в WEB-документ с помощью HTML и CSS?

#36461510

leoCats

Гость

Задачу построения математических выражений в WEB документе решил с помощью:
1) Лексического анализатора
2) Обратной польской записи
3) Для вывода дробей использовал таблицы

Всем спасибо, вопрос закрыт.

...

Рейтинг:

0 / 0

10.02.2010, 18:25:44

| Ответить | Цитировать | Написать

19 сообщений из 19, страница 1 из 1

Читали тему (0):

Читали форум (0):

Пользователи онлайн (0):

start [/forum/topic.php?fid=22&fpage=261&tid=1453549]:	0ms
get settings:	9ms
get forum list:	19ms
check forum access:	3ms
check topic access:	3ms
track hit:	57ms
get topic data:	8ms
get forum data:	2ms
get page messages:	67ms
get tp. blocked users:	2ms
others:	203ms

total:	373ms

	Необходимые cookie
	Cookie для сбора статистики
	Cookie для маркетинга и рекламы