怎么用CSS把文字与设置的背景变成一个“块”?

html-css023

怎么用CSS把文字与设置的背景变成一个“块”?,第1张

用CSS把文字与设置的背景变成一个“块”,首先我们需要做的就是将这个行级的元素变成块级元素,我们一般是通过display:block;来实现,然后在给这个块width和height,然后我们设置的背景就都能显示了,这里通过代码来理解:

<html>

<head>

<style>

.p{

display:block

width:200px

height:100px

border:1px solid #f00

background:url('图片地址')

}

</head>

<body>

<div class='wenzi'>

<p>我的数据</p>

</div>

</body>

</html>

CSS中常见的块级元素:<div>、<p>、<h1>...<h6>、<ol>、<ul>、<dl>、<table>、<address>、<blockquote>、<form>。

块级元素的特点:

每个块级元素都是独自占一行,其后的元素也只能另起一行,并不能两个元素共用一行。元素的高度、宽度、行高和顶底边距都是可以设置的。元素的宽度如果不设置的话,默认为父元素的宽度。

行级元素的特点:

可以和其他元素处于一行,不用必须另起一行。元素的高度、宽度及顶部和底部边距不可设置。元素的宽度就是它包含的文字、图片的宽度,不可改变。

拓展资料:行级元素与块级元素的转换

可以在css样式中用display:inline将块级元素设为行级元素,同样,也可以用display:block将行级元素设为块级元素。(资料参考:网页链接)