帮我写一段css代码,要求如下:将800*800px的图片左对齐,右侧标题字号14px,距离图片60px;正文字号8px,和标题左对齐,在标题下方20px
时间: 2023-03-12 15:06:39 浏览: 60
img {
width: 800px;
float: left;
}
.title {
font-size: 14px;
margin-left: 60px;
}
.content {
font-size: 8px;
margin-left: 60px;
margin-top: 20px;
}
相关问题
帮我写一段css代码,将如下文字排版:“金牌胎牛血清”作为标题,“来源南美,性价比高”作为正文,图片在网上找一张血清的图片,调整为800*800px,将800*800px的图片左对齐,右侧标题字号14px,距离图片60px;正文字号8px,和标题左对齐,在标题下方20px
<div style="text-align:left;">
<img src="血清的图片.jpg" width="800" height="800">
<h2 style="position:relative;left:60px;font-size:14px;">金牌胎牛血清</h2>
<p style="position:relative;left:60px;font-size:8px;top:20px;">来源南美,性价比高</p>
</div>
帮我写一份html作业,单页,包含css样式代码
好的,以下是一个简单的 HTML 页面,包括 CSS 样式代码:
```html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>我的网页</title>
<style>
body {
background-color: #f5f5f5;
font-family: Arial, sans-serif;
font-size: 16px;
color: #333;
}
h1 {
font-size: 24px;
text-align: center;
margin-top: 50px;
}
p {
line-height: 1.5;
margin: 20px;
text-align: justify;
}
.highlight {
color: red;
font-weight: bold;
}
</style>
</head>
<body>
<h1>欢迎来到我的网页</h1>
<p>这是一个关于我的网页的段落。在这个网页中,我将会分享一些关于我的信息和兴趣爱好。</p>
<p>我喜欢 <span class="highlight">编程</span>,尤其是 <span class="highlight">Web 开发</span>。我也喜欢旅行和阅读。</p>
<p>如果你对我的网页有任何意见或建议,可以通过电子邮件联系我。谢谢!</p>
</body>
</html>
```
这个 HTML 页面包括一个标题、三个段落和一个 CSS 样式部分。在 CSS 样式部分中,我们定义了页面的背景颜色、字体、字号和颜色。我们还定义了标题的样式,包括字体大小、文本对齐和上边距。我们还定义了段落的样式,包括行高、边距和文本对齐。最后,我们定义了一个名为“highlight”的 CSS 类,用于突出显示文本。在 HTML 页面中,我们将“编程”和“Web 开发”这两个词用“highlight”类进行了标记,使它们以红色粗体字体显示。
相关推荐
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)