我如何 link 到 css 中的 div 并使 <p> 具有设定的宽度?
How do I link to a div in css and make the <p> have a set width?
我正在尝试 link html 到 css,但遇到问题并卡住了。感谢任何帮助
我试过使用 div class 但我是新手所以不太确定该怎么做
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 到 link 和 css
不知道你的HTML和CSS的水平,但是你需要调用CSS文件到你的html。
您使用 .head 来调用您的 class = "head" 并使用您的 #head 来调用您的 id="head".
因为你有两个头,我建议用不同的名字(以避免任何冲突)。
div="head_div"
和另一个 id="head"
-> 类似的东西 !
如果你的 css 文件在一个文件夹中(比方说,叫做 CSS),你需要在你的 href 中定义路径(比如 href="./CSS/cssfile.css
)
希望对您有所帮助!
编辑:我的错,阅读你的文字并错过了标题 -.-
只需将 ID 添加到要更改的 <p>
标签,然后在 CSS 中施展魔法(设置您想要的宽度)
<p id ="something"></p>
CSS :
#something{
css here;
}
我正在尝试 link html 到 css,但遇到问题并卡住了。感谢任何帮助
我试过使用 div class 但我是新手所以不太确定该怎么做
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 到 link 和 css
不知道你的HTML和CSS的水平,但是你需要调用CSS文件到你的html。 您使用 .head 来调用您的 class = "head" 并使用您的 #head 来调用您的 id="head".
因为你有两个头,我建议用不同的名字(以避免任何冲突)。
div="head_div"
和另一个 id="head"
-> 类似的东西 !
如果你的 css 文件在一个文件夹中(比方说,叫做 CSS),你需要在你的 href 中定义路径(比如 href="./CSS/cssfile.css
)
希望对您有所帮助!
编辑:我的错,阅读你的文字并错过了标题 -.-
只需将 ID 添加到要更改的 <p>
标签,然后在 CSS 中施展魔法(设置您想要的宽度)
<p id ="something"></p>
CSS :
#something{
css here;
}