body{
font-family: sans-serif, Georgia, 'Times New Roman', Times, serif
}
header{
text-align: center;
background-color: blanchedalmond;
padding: 10px
}
#photo{
width:25%;
border-radius: 100px;
}
#bio{
background-color: bisque;
}
#work{
background-color: bisque;
}
#projects{
display:flex;
}
.project{
aspect-ratio: 1/1;
outline: dotted;
width: 25%;
display: inline-block;
text-align: center;
margin: 10px;
}
.project img{
width:100%;
}
footer{
background-color: bisque;
text-align: center;
}<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Claire McGuinness Profile</title>
<link rel="stylesheet" style="text\css" href="profilestylesheet.css">
</head>
<body>
<header>
<img src="https://cdn2.vectorstock.com/i/1000x1000/54/41/young-and-elegant-woman-avatar-profile-vector-9685441.jpg"
id="photo">
<h1>Claire McGuinness</h1>
<p>Web Developer | Web Designer | Tech Enthusiast</p>
</header>
<main>
<div id="bio">
<h2>About Me</h2>
<p>I am a self taught web developer with a passion for learning and upskilling.
I studied HTML, CSS and Java script using an app called sololearn and I started building websites right away.
Prior to delving into the world of web development, I worked as a registered veterinary nurse in various practices around Dublin.
I studied for 4 years in UCD where I earned my BSc in veterinary nursing.
While in UCD I joing the UCD sub aqua clube which I am still a member of today. During my years at the sub aqua club I took on many committee positions including Trainee rep, training officer and Captain/chairperson.
I am excited to be starting this new chaper of my life and looking forward to learning everying the tech industry has to offer.
</p>
</div><!--bio-->
<div id="work">
<h2>My Work</h2>
<div id="projects">
<div class="project" id="project1">
<a href="sample-blog.html">
<img src="sample-blog.png"></a>
</div><!--Project1-->
<div class="project" id="project2">Project 2</div>
<div class="project" id="project3">Project 3</div>
</div><!--projects-->
</div><!--work-->
</main>
<div>
<br>
</div>
<footer>
Contact me by <a href="[email protected]">email</a>
</footer>
</body>
</html>我目前正在学习如何使用 HTML 构建网站。我是自学的，不需要请教任何老师。 我遇到无法调整大小的图像问题。 当我在 Visual Studio Code 上预览代码时，图像适合容器内部，并且遵循我为其设置的所有规则。我遇到的问题是当我将文件上传到 dreamhost 时。 .png 文件位于根目录中，代码 img src 是该文件的名称。 我对这一切都很陌生，我可能做错了很多，所以任何意见都会非常有帮助。 谢谢你
我尝试更改dreamhost上的CSS文件并以各种方式设置图像的宽度。似乎没有任何东西会影响图像的大小。
当我在 VSC 上运行此代码时，图像“sample-blog.png”遵循 css 中为 div 容器设置的规则。但是当我将相同的代码上传到 dreamhost 时，“sample-blog.png”图像根本不会调整大小
确保“src”属性中提到的文件路径正确，您也可以尝试直接在 HTML 文件本身中设置高度和宽度。
喜欢，
<img src="filename.png" alt="Description of image" width="200" height="150">