html 将内容移至页面左侧[已关闭]

ssgvzors  于 2023-02-14  发布在  其他
关注(0)|答案(1)|浏览(136)

**已关闭。**此问题需要debugging details。当前不接受答案。

编辑问题以包含desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem。这将有助于其他人回答问题。
2天前关闭。
Improve this question
有人能建议如何将下面的部分(技能)移动到页面的左侧吗?
enter image description here
并同时保留右侧的以下部分(工作历史、教育、课程)
enter image description here
这是我的代码。请像奇瓦瓦州一样说话。这是我生命中的第一个代码。
enter image description here

<section >
            <h3>
                Skills
            </h3>
            <ul>
                <h4>Languages</h4>
                    <li>HTML</li>
                    <li>CSS</li>
                    <li>JavaScript</li>
                    <li>Java</li>
                <h4>Libraries</h4>
                    <li>React</li>
                <h4>Framework</h4>
                    <li>
                        Angular.js
                    </li>
                <h4>CI/CS</h4>
                    <li>
                        GIT
                    </li>
            </ul>
    </section>
    <section>
        <h2>Work History</h2>
        <ul>
            
            <li>2015 Amazon</li>
            <li>Amazon Manager</li>
            <li> DHL</li>
        </ul>
    </section>
    <section>
        <h2>Education</h2>
        <ul>
            <li><a href="https://aloplock.pl/pl">ALO</a></li>
        </ul>
    </section>
    <section>
        <h2>Courses</h2>
        <ul class="Courses">
            <li><img src="car.png"/>  Driving licence</li>
        </ul>
    </section>
    </main>
</div>
</body>

请如果有人可以建议如何使修改css,使其工作。

gzszwxb4

gzszwxb41#

试试这样的方法:

<div style="display: flex; align-items: flex-start;justify-content:space-around;flex-flow: row wrap;">
    <section>...</section>
    <section>...</section>
</div>

也许是这样:

<div style="display: flex; align-items: flex-start;justify-content:space-around;flex-flow: row wrap;">
    <section>
        <h3>
            Skills
        </h3>
        <ul>
            <h4>Languages</h4>
            <li>HTML</li>
            <li>CSS</li>
            <li>JavaScript</li>
            <li>Java</li>
            <h4>Libraries</h4>
            <li>React</li>
            <h4>Framework</h4>
            <li> Angular.js</li>
            <h4>CI/CS</h4>
            <li>GIT</li>
        </ul>
    </section>
    <div>
        <section>
            <h2>Work History</h2>
            <ul>
                <li>2015 Amazon</li>
                <li>Amazon Manager</li>
                <li> DHL</li>
            </ul>
        </section>
        <section>
            <h2>Education</h2>
            <ul>
                <li><a href="https://aloplock.pl/pl">ALO</a></li>
            </ul>
        </section>
        <section>
            <h2>Courses</h2>
            <ul class="Courses">
                <li><img src="car.png"/>Driving licence</li>
            </ul>
        </section>
    </div>
</div>

相关问题