本章摘要 :
- CSS有N多屬性，根據(jù)繼承性，主要可以分為2大類
可繼承屬性
父標簽的屬性值會傳遞給子標簽
一般是文字控制屬性
不可繼承屬性
父標簽的屬性值不能傳遞給子標簽
一般是區(qū)塊控制屬性
一, 可繼承的標簽
/**************可繼承的標簽*******************/
所有標簽可繼承
pvisibility、cursor
內(nèi)聯(lián)標簽可繼承
pletter-spacing、word-spacing、white-space、line-height、color、font、font-family、font-size、font-style、font-variant、font-weight、text-decoration、text-transform、direction
塊級標簽可繼承
ptext-indent、text-align
l列表標簽可繼承
plist-style、list-style-type、list-style-position、list-style-image
/**************不可繼承的標簽******************/
pdisplay、margin、border、padding、background
pheight、min-height、max-height、width、min-width、max-width
poverflow、position、left、right、top、bottom、z-index
pfloat、clear
ptable-layout、vertical-align
ppage-break-after、page-bread-before
punicode-bidi
二, CSS中常見的屬性
<html>
<head lang="en">
<meta charset="UTF-8">
<title>CSS中常見的屬性</title>
<style>
/*可繼承的屬性*/
body{
/*設置字體大小*/
font-size: 40px;
/*設置文字顏色*/
color: red;
/*設置字體加粗*/
font-weight: bolder;
}
/*塊級標簽*/
div {
/*復合性屬性,可用于設置背景顏色和圖片*/
background: url("images/7.jpg");
width: 200px;
height: 200px;
/*cover是用于設置圖片的尺寸,讓圖片跟隨標簽的尺寸而顯示*/
background-size: cover;
/*設置文字居中顯示*/
text-align: center;
/*display和visibility都有隱藏內(nèi)容的功能,但是兩者之間的區(qū)別是,display隱藏內(nèi)容后,所有的內(nèi)容以及屬性都會消失,但是visibility隱藏內(nèi)容,但是它的高度和寬度一直都是存在的*/
/*display: none;*/
/*visibility: hidden;*/
/*設置光標顯示的樣式*/
cursor: pointer;
}
span{
background-color: blue;
width: 300px;
height: 200px;
/*設置行高,用于設置垂直居中*/
line-height: 300px;
}
a{
/*去除下劃線*/
text-decoration: none;
}
ul{
/*將圓點設置為正方形*/
/*list-style: square;*/
/*將圓點刪除掉*/
list-style: none;
}
#Alex{
/*超出標簽的內(nèi)存自動處理掉*/
/*overflow: hidden;*/
/*超出標簽的內(nèi)容全部添加到標簽中*/
/*overflow: scroll;*/
/*overflow: inherit;*/
overflow: auto;
}
</style>
</head>
<body>
<p>AAAAAAAAAAAAAAA</p>
<span>BBBBBBBBBBBB</span>
<div>CCCC</div>
<a href="#">谷歌一下,您就知道了</a>
<div id="Alex">DDDDDDDDDDDDDDDDDDDDDDDDDDD</div>
<ul>
<li>William</li>
<li>William</li>
<li>William</li>
<li>William</li>
</ul>
</body>
</html>
