У меня есть приложение Angular, и я отображаю различные строки друг над другом в пределах <div>, однако я хочу, чтобы они были выровнены по ширине div.
- Более короткие строки должны иметь больший размер шрифта, чтобы заполнить пространство, а не просто добавлять пробелы между буквами.
- Длинные строки должны иметь меньший размер шрифта, а не должен переноситься на следующую строку.
Это наглядное представление о том, что я преследую:
Я видел эту ссылку , показывающую различные способы сделать что-то подобное, но я просто не могу заставить это работать ...
Забыли добавить код. Вот, пожалуйста.
component.ts
export class FitTextComponent implements OnInit {
line1 = 'this is text for line 1';
line2 = 'less text';
line3 = 'medium amount of text';
line4 = 'this will be a really long line';
text = [this.line1, this.line2, this.line3, this.line4];
constructor() { }
ngOnInit() {
}
}
component.html
<div class="container">
<p *ngFor="let line of text">{{line}}</p>
</div>
component.css
.container {
width: 300px;
background: grey;
}
Вот стэкблиц для игры с