浮动<li>到文本的左侧



我在视图中有此代码

body .vr-list {
padding: 0 20px !important;
margin-top: 70px !important;
text-align: left !important;
}
<ol class="vr-list" style="padding-left:540px;padding-top:10px;">
<li style=" font-size: 1.6em;list-style: decimal-leading-zero;margin: 0 0 0 2em;"><span style="font-size: 0.95em;">Обзор существующих технологий  и применяемых api </span></li>
<li style=" font-size: 1.6em;list-style: decimal-leading-zero;margin: 0 0 0 2em;"><span style="font-size: 0.95em;">Общие понятия WebGL</span></li>
<li style=" font-size: 1.6em;list-style: decimal-leading-zero;margin: 0 0 0 2em;"><span style="font-size: 0.95em;">Интерактивный 3D rendering </span></li>
<li style=" font-size: 1.6em;list-style: decimal-leading-zero;margin: 0 0 0 2em;"><span style="font-size: 0.95em;">Основные идеи виртуальной реальности</span></li>
<li style=" font-size: 1.6em;list-style: decimal-leading-zero;margin: 0 0 0 2em;"><span style="font-size: 0.95em;">Интерактивность и FPS</span></li>
<li style=" font-size: 1.6em;list-style: decimal-leading-zero;margin: 0 0 0 2em;"><span style="font-size: 0.95em;">FPS и частота обновления экрана </span></li>
<li style=" font-size: 1.6em;list-style: decimal-leading-zero;margin: 0 0 0 2em;"><span style="font-size: 0.95em;">Процессорный цикл</span></li>
<li style=" font-size: 1.6em;list-style: decimal-leading-zero;margin: 0 0 0 2em;"><span style="font-size: 0.95em;">Человеческий глаз против камеры </span></li>
<li style=" font-size: 1.6em;list-style: decimal-leading-zero;margin: 0 0 0 2em;"><span style="font-size: 0.95em;">Построение базовой 3D сцены</span></li>
<li style=" font-size: 1.6em;list-style: decimal-leading-zero;margin: 0 0 0 2em;"><span style="font-size: 0.95em;">Свет и rendering</span></li>
<li style=" font-size: 1.6em;list-style: decimal-leading-zero;margin: 0 0 0 2em;"><span style="font-size: 0.95em;">История появления первой 3D модели</span></li>
<li style=" font-size: 1.6em;list-style: decimal-leading-zero;margin: 0 0 0 2em;"><span style="font-size: 0.95em;">Баланс цвета и пропорции соотношения цветов. Работа с цветовыми кругами Джонаса Иттена </span></li>
<li style=" font-size: 1.6em;list-style: decimal-leading-zero;margin: 0 0 0 2em;"><span style="font-size: 0.95em;">WebGL и three.js </span></li>
<li style=" font-size: 1.6em;list-style: decimal-leading-zero;margin: 0 0 0 2em;"><span style="font-size: 0.95em;">Основы UI/UX дизайна для 3D сайтов</span></li>
<li style=" font-size: 1.6em;list-style: decimal-leading-zero;margin: 0 0 0 2em;"><span style="font-size: 0.95em;">Oсновные ошибки при построении 3D сцен</span></li>
<li style=" font-size: 1.6em;list-style: decimal-leading-zero;margin: 0 0 0 2em;"><span style="font-size: 0.95em;">Выпускной курсовой проект</span></li>
</ol>

它显示列表,但标签内的文本居<li>

这是屏幕。

屏幕

我怎样才能让它在左边不居中?

你需要将text-align样式应用于你的 li 元素(不仅仅是主要的 ul(:

body .vr-list li {
text-align: left !important;
}

当我运行您的代码时,文本对齐是左边的。我想你在其他地方上过.vr-list课。因此,此样式是覆盖的。 您的代码

有没有理由使用内联样式而不是 css ?

尝试使用更具体的路径,例如

body #content ol.vr-list li { text-align:left}

显然有些东西正在覆盖您的代码.我建议你不要使用!important。要么像我之前说的那样写一个更具体的路径,要么找到导致覆盖的代码并更改它

我认为您对左侧的列表或整个身体有一些text-aling:center!important.这可能会导致问题

最新更新