Question

我正在使用CSS编写一个xhtml文档，我必须在整个页面周围应用框模型以及我必须在页面中包含的图像。虽然该页面还将包含其他文本等。我很难弄清楚如何将框样式应用于此页面。请帮忙！

Answer 1

盒子模型解释了边缘，填充，边框和元素大小如何组合在一起呈现图像，仅供参考。以下是编写CSS以在页面的body元素上设置边框，填充和边距的方法：

body {
    margin: 5px;
    padding: 10px;
    border: 1px solid #000000;
}

这将为您提供5像素边距，黑色1像素实心边框，以及内部10像素垫。

上面的CSS定位了body标签。你只有一个身体标签，所以你不必具体。但是，您可能有很多图像，并且只想在其中一个图像周围放置一个平台。您需要使用ID或类标记“特殊”图像，以便您可以选择它。以下是两个例子：

<img src="image.jpg" id="myImage" />
<img src="image2.jpg" class="borderImage" />

现在，您可以设置CSS以使用找到所需图像的选择器查找这些特殊图像：

#myImage {
    padding: 8px;
    margin: 2px;
    border: 2px dashed #AB34CD;
}

img.borderImage {
    padding: 4px;
    margin: 3px;
    border: 3px dotted green;
}

这只是设计CSS规则的开始。像我建议的那样，去尝试CSS教程。这是MDN CSS教程：https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Getting_started 这是Tizag的另一个。新手可能会更容易接触到：http://www.tizag.com/cssT/

如何使用CSS将框样式应用于xhtml文档？

1 个答案: