<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
a{
text-decoration: none;
}
/*--------背景相关------*/
#d1{
height: 300px;
/*1.背景图
如果背景图大于盒子的大小,能显示多少算多少
如果背景图小于盒子的大小,背景图就会平铺(重复显示)
* */
background-image: url(img/logo.png);
/*2.设置是否平铺*/
background-repeat: no-repeat;
/*3.设置背景图的位置
background-position:x,y;
x:left/center/right/坐标值
y:top/center/bottom/坐标值
* */
background-position: center ;
/*4.同时设值
background:图片地址、是否重复 x y 背景颜色(可不写)
* */
background: url(img/logo.png) no-repeat center top chartreuse;
}
/*--------列表相关------*/
/*选择器为列表/li都可以*/
li{
background-color: greenyellow;
}
ul{
background-color: cornflowerblue;
/*1.设置符号样式
disc(实心圆)/circle(空心圆)square(实心方块)/none(去掉列表符号)
* */
list-style-type:none ;
/*2.设置图片的符号*/
list-style-image: url(img/icon.ico);
/*3.设置符号的位置
outside(li标签的 外边),inside(li标签的里面)
* */
list-style-position: outside;
}
/*--------文字相关------*/
p{
/*1.文字大小*/
font-size: 20px;
/*2.文字颜色*/
color: blueviolet;
/*3.设置字体名*/
font-family: "微软雅黑";
/*4.设置字体粗细*/
font-weight: bold;
/*5.字体倾斜*/
font-style: italic;
/*6.内容的对齐方式*/
text-align: left;
/*7.设置行高
文字一行的高度(当文字只有一行的时候设置行高和标签的高度一样,可以让文字垂直居中)
*/
line-height: 30px;
/*8.文字修饰*/
/*
none:去掉文字修饰
underline:添加下划线
line-through:添加删除线
overline:添加上划线
* */
text-decoration: line-through;
/*9.首行缩进
注意单位是em
* */
text-indent: 2em;
/*10.字间距*/
letter-spacing: 3px;
}
</style>
</head>
<body>
<div id="d1">
<!--<img src="img/bg.png" style="width: 100%;height: 300px;"/>-->
</div>
<ul>
<li>Python</li>
<li>H5</li>
<li>Java</li>
</ul>
<p>
先帝创业未半而中道崩殂,今天下三分,益州疲弊,此诚危急存亡之秋也。<br /> 然侍卫之臣不懈于内,忠志之士忘身于外者,盖追先帝之殊遇,欲报之于陛下也。<br />诚宜开张圣听,以光先帝遗德,恢弘志士之气,不宜妄自菲薄,引喻失义,以塞忠谏之路也
</p>
</body>
</html>
day24-其他简单的CSS属性
©著作权归作者所有,转载或内容合作请联系作者
- 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
- 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
- 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...