Вопросы Теги

Добавьте центрируемый текст к середине <час / подобная> строка

Вы также можете установить параметры только в начальном вызове par вместо каждого столбца отдельно, а также установить las=2, чтобы получить перпендикулярную ориентацию меток тиков. 

tiff("barplot.tiff", width=130, height=50, units='mm', res=300)
par(mfrow=c(1,3))
par(mar=c(5, 4, 4, 0.2), cex.lab=0.5, cex.sub=0.7, cex.axis=0.5, las=2)

mxCarabooda <- t(as.matrix(Caraboodaloss[,2:3]))
Caraboodaloss$Label <- paste(Caraboodaloss$Scenario, Caraboodaloss$ChangeHC)
colnames(mxCarabooda) <- Caraboodaloss$Label
colours=c("gray63","gray87")

barplot(mxCarabooda, main='Carabooda', ylab='Profit loss ($m)',
        xlab='Change in water table at each level of GW cut', beside=TRUE, 
        col=colours, ylim=c(0,30))

legend('topright', bty="n", legend=c('Loss in GM','Loss in adjusted GM'), 
       col=c("gray63","gray87"), cex=0.6, pch=15)

mxNeerabup <- t(as.matrix(Neerabuploss[,2:3]))
Neerabuploss$Label <- paste(Neerabuploss$Scenario, Caraboodaloss$ChangeHC)
colnames(mxNeerabup) <- Neerabuploss$Label

colours=c("gray63","gray87")

barplot(mxNeerabup,main='Neerabup', ylab='', 
        xlab='Change in water table at each level of GW cut', beside=TRUE, 
        col=colours, ylim=c(0,30) )
legend('topright', bty="n", legend=c('Loss in GM','Loss in adjusted GM'), 
       col=c("gray63","gray87"), cex=0.6, pch=15)

mxNowergup <- t(as.matrix(Nowerguploss[,2:3]))

Nowerguploss$Label <- paste(Nowerguploss$Scenario,Nowerguploss$ChangeHC)
colnames(mxNowergup) <- Nowerguploss$Label
colours=c("gray63","gray87")

barplot(mxNowergup,main='Nowergup', ylab='', 
        xlab='Change in water table at each level of GW cut',beside=TRUE, 
        col=colours, ylim=c(0,30) )
legend('topright', bty="n", legend=c('Loss in GM','Loss in adjusted GM'), 
       col=c("gray63","gray87"), cex=0.6, pch=15)

dev.off()

enter image description here

194
задан willoller 31 December 2015 в 18:03
поделиться

10 ответов

.orSpan{
  position: absolute;
  margin-top: -1.3rem;
  margin-left:50%;
  padding:0 5px;
  background-color: white;
}
<div>
   <hr> <span class="orSpan">OR</span>
</div>

Вы можете требуемый корректироваться поле свойство

0
ответ дан 23 November 2019 в 05:22
поделиться

Как насчет: 

 
  Заголовок раздела

Посмотрите этот JSFiddle .

Вы можете использовать vw или % , чтобы сделать его отзывчивым .

211
ответ дан 23 November 2019 в 05:22
поделиться 
<div style="text-align: center; border-top: 1px solid black">
  <div style="display: inline-block; position: relative; top: -10px; background-color: white; padding: 0px 10px">text</div>
</div>
5
ответ дан 23 November 2019 в 05:22
поделиться

ОБНОВЛЕНИЕ: Это не будет работать при использовании HTML5

Вместо этого ознакомьтесь с этим вопросом, чтобы узнать больше о методах: Задача CSS, могу ли я сделать это, не добавляя HTML?

Я использовал line-height: 0 , чтобы создать эффект в заголовке моего сайта guerilla-alumnus.com 

<div class="description">
   <span>Text</span>
</div>

.description {
   border-top:1px dotted #AAAAAA;
}

.description span {
   background:white none repeat scroll 0 0;
   line-height:0;
   padding:0.1em 1.5em;
   position:relative;
}

Другой хороший метод находится на http://robots.oughttbot.com/

Он использует фоновое изображение и плавает для достижения классного эффекта

10
ответ дан 23 November 2019 в 05:22
поделиться 
<fieldset style="border:0px; border-top:1px solid black">
    <legend>Test</legend>
</fieldset>

Злой взлом ...

3
ответ дан 23 November 2019 в 05:22
поделиться

Вы можете попробовать сделать fieldset, и выровнять элемент "legend" (ваш текст "следующий раздел") по середине поля, установив только border-top. Я не уверен в том, как легенда позиционируется в соответствии с элементом fieldset. Я полагаю, что для этого достаточно просто margin: 0px auto.

пример :

<fieldset>
      <legend>Title</legend>
</fieldset>
2
ответ дан 23 November 2019 в 05:22
поделиться

Вы можете добиться этого без

. Семантически, дизайн должен быть выполнен средствами CSS, в данном случае это вполне возможно. 

div.header
{
  position: relative;
  text-align: center;
  padding: 0 10px;
  background: #ffffff;
}

div.line
{
  position: absolute;
  top: 50%;
  border-top: 1px dashed;
  z-index: -1;
}

<div class="header">
  Next section
  <div class="line">&nbsp;</div>
</div>
1
ответ дан 23 November 2019 в 05:22
поделиться

Если вы умеете пользоваться CSS и готовы использовать устаревший атрибут align, то стилизованный fieldset/legend будет работать:

<style type="text/css">
fieldset { 
    border-width: 1px 0 0 0;
}
</style>

<fieldset>
<legend align="center">First Section</legend>
Section 1 Stuff
</fieldset>

<fieldset>
<legend align="center">Second Section</legend>
Section 2 Stuff
</fieldset>

Предназначение fieldset - логически группировать поля формы. Как отметил willoler, стиль text-align: center для не будет работать для элементов legend. align="center" является устаревшим HTML, но он должен правильно центрировать текст во всех браузерах.

6
ответ дан 23 November 2019 в 05:22
поделиться

Вы можете создать блок-оболочку с подходящим фоновым изображением (а также установить цвет фона для вашего центрированного текстового блока).

0
ответ дан 23 November 2019 в 05:22
поделиться

Попробуйте следующее: 

 .divider {width: 500px; выравнивание текста: центр; } .divider hr {маржа слева: авто; маржа-право: авто; ширина: 40%; } .left {float: left; } .right {float: right; } 
 
 
 ТЕКСТ

Предварительный просмотр на jsFiddle .

51
ответ дан 23 November 2019 в 05:22
поделиться