2013-07-29 3 views
0

из HTML редактор, пользователь может написать текст приветствия, например, исходный код будет:Как я могу сжать div, когда он имеет встроенный стиль?

<p style="text-align:center"> 
    <span style="font-size:20px"> 
    <span style="font-family:tahoma,geneva,sans-serif">Hej,</span> 
    </span> 
</p><br><br> 
<p style="text-align:center"><span style="font-size:20px"> 
    <span style="font-family:tahoma,geneva,sans-serif"> 
    <span style="color:#FF0000"><em>Du&nbsp;</em></span> 
    <strong>kan skrive</strong>&nbsp; 
    <span style="color:#0000CD"><u>din hilsen</u></span> her!</span> 
    </span> 
</p> 

ведьма переводит с

enter image description here

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

enter image description here

моя проблема в том, что предварительный просмотр не является пропозициональным для того, что будет напечатано, и я не могу использовать шов, чтобы использовать какой-либо CSS для стилизации обернутого <div> вокруг этого текста, чтобы показать его немного больше в ожидании ...

Я хотел сжиматься на 25% ... все равно я могу это сделать?

+1

Вы пытались использовать '! Important'? – Jack

+0

Оберните содержимое в другой DIV, когда вы возьмете данные? Например, '$ data ="

" . htmlentities($_POST["greeting"]) . "
";' таким образом это будет на 75% (или на 25% меньше) родительского DIV. – faino

ответ

2

css3

#class:target{  -webkit-transform: scale(0.25); 
-moz-transform: scale(0.25); 
-o-transform: scale(0.25); 
-ms-transform:scale(0.25); 
transform:scale(0.25); } 

http://jsfiddle.net/s26cm/

+0

к сожалению, это доступно только для современных браузеров, и мне нужно сохранить IE7 + в роли ... абсурдно, сколько посещений IE7 у нас есть на веб-сайте:/- Я дам ему попробовать, хотя, но я бы хотел, чтобы это могло быть так же проще для устаревших браузеров. – balexandre

+0

Я бы не прочь ... только <1% от мира использует IE7 –

+0

Вам это было хорошо? –

0

Совет: вместо px можно использовать %, если размер шрифта должен быть масштабируется в соответствии с его относительно элементов, иначе em, если это необходимо масштабировать соответственно до размера шрифта всей страницы, уменьшая размер div, уменьшая шрифт соответственно

12pt = 16px = 1em = 100% это может пригодиться при изменении размера шрифта Блоки

правопреемником id или class к этому DIV и использовать их в качестве селекторов в сценарии, чтобы изменить размер после кнопки экономии нажата, она будет перекрывать встроенный стиль, вы можете оставить скрипку сэр?

0

«Как я могу сжимать div, когда он имеет встроенный стиль?»

ли вы имеете в виду:

display: inline; 

Если вы - Все, что установлено отображение инлайн не будет принимать ширину свойства. Перейти к встроенному блоку;

+0

сжимается в предпросмотре страницы предварительного просмотра – balexandre

Смежные вопросы