Как мне связать div с css и заставить <p>иметь заданную ширину? - PullRequest
0 голосов
/ 23 мая 2019

Я пытаюсь связать HTML с CSS, но у меня проблемы и они застряли. Любая помощь приветствуется

Я пытался использовать класс div, но я новичок, поэтому не слишком уверен, что делать

HTML

<!DOCTYPE html>
<html>
<head>
    <title>About UnixCast</title>
    <link href="about.css" rel="stylesheet" type="text/css" />
</head>
<body>

    <div id="head">
        <div class="head">Hi there! I'm Lewis and welcome to UnixCast.com!</div>
        <div id="para">
        <div id="para1">
            <p>If you're reading this I just would like to say a huge thank you for taking the time to want to know who's behind UnixCast. I'm a full-time student with a big passion for learning. I enjoy studying physics and hope to get a degree in astrophysics sometime in the future. I've always had a passion for creating content online. From when YouTube was at the start of its big popularity boom, I fell in love with the idea of sharing content freely for everyone to see. My goals for my content are simple:
                <ul style="list-style-type:disc;">
                    <li>Share my passion and interest with the internet.</li>
                    <li>Educate my self on topics that I find interesting.</li>
                    <li>Inspire others to learn about the world around them.</li>
        </ul>
            </p>
        </div>
    </div>
    <div class="para2">
        <p>And that's basically it. If you feel like you'd enjoy my content then feel free to check out what I do by visiting my<a href="https://www.youtube.com/channel/UCPSlslWokRgiA3WEoMeqcFw?"> YouTube</a> and if you enjoy the content please consider subscribing! Have a great day and I hope to see you around!</p>
        </div>
    </div>
</body>
</html>

CSS

body{
    margin: 0px;
    padding: 0px;
    background-color: #19181D;
}
.head{
    font-family: sans-serif;
    font-size: 25px;
    color: white;
    position: relative;
    top: 10%;
    left: 5%;
    transform: translate(-50%, -50%);
}
.para1{
    font-family: sans-serif;
    font-size: 15px;
    color: white;
    position: relative;
    top: 120px;
    left: 5%;
    width: 320px;
    height: 320px;
    margin: 0 auto;
    transform: translate(-50%, -50%);
}

Ожидаемый результат - получить HTML-ссылку для связи с CSS

1 Ответ

0 голосов
/ 23 мая 2019

Не знаю ваш уровень HTML и CSS, но вам нужно вызвать файл CSS в ваш HTML.Вы используете .head для вызова вашего class = "head" и ваш #head для вызова вашего id = "head".

Поскольку у вас 2 головы, я бы посоветовал вводить разные имена (чтобы избежать конфликта).div="head_div" и другие id="head" -> что-то в этом роде!

И если у вас есть CSS-файл в папке (скажем, с именем CSS), вам нужно определить путь в вашем href (например, href="./CSS/cssfile.css)

Надеюсь, это поможет!

РЕДАКТИРОВАТЬ: мой плохой, прочитал ваш текст и пропустил заголовок -.- Просто добавьте идентификатор в тег <p>, который вы хотите изменить, а затемСделайте свое волшебство в CSS (установите желаемую ширину) <p id ="something"></p> CSS: #something{ css here; }

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...