- 字体设置
p{
font-size: large;【可以写px，也可以写large等，
12pt=16px，1em=16px】
font-family: 微软雅黑;【设置字体名称】
font-weight: lighter;【字体变细（100-400也可以，500是正常值）】
/* font-weight: bolder; */【字体变粗（600-900也可以）】
/* color: #808080; */
color: rgb(211, 33, 244);
【颜色设置有三种a.颜色的英文单词b.十六进制c.rgb（255,255,255）
补充：rgba（255,255,255,0~1）最后一位为透明度】
text-decoration: line-through;【降价时会用到，横线在文字中间】
text-indent: 2em;【首行缩进2字符，只对首行起作用】
letter-spacing：2px【适用于中文文字间距】
word-spacing：2px【适用于英文单词间距】
font-style：italic(斜体字)/oblique(倾斜的文字)/normal（常规显示）
简写：font:italic 800 30px/80px "宋体"；顺序不能改变 ,必须同时指定font-size和font-family属性时才起作用
Text-align：left（靠左）/right（靠右）/center（居中）/justify（两端对齐，只对多行文字有效）
text-decoration:none没有/underline下划线/overline上划线/line-through删除线
}
a{
text-decoration: none;
}【用来消除超链接下方的横线】
例子：文字练习
代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
*{
padding: 0;
margin: 0;
}
.nav{
width: 200px;
height: 50px;
text-align: center;
background-color: #808080;
margin-top: 50px;
color: #ffffff;
line-height: 50px;
font-weight: 600;
margin-left: 140px;
font-size: 25px;
}
p{
text-indent: 2em;
margin-left: 140px;
width: 500px;
font-size: 20px;
line-height: 30px;
}
span{
color: #ff0000;
}
<style>
</head>
<body>
<div class="nav">千锋简介</div>
<br>
<p>
<b>北京千锋互联科技有限公司（简称千锋)</b>成立于
2011年1月。公司总部位于北京，目前已在<span>深圳、上海、
郑州、广州、大连、武汉、成都、西安、杭州、青岛、重
庆、长沙、哈尔滨、南京、太原</span>建立分公司。
</p>
<br>
<p>千锋旗下现有 <b>教育培训、人才服务、项目研发、创
业孵化</b>等业务。 教育培训业务主要为大学生、企业提供
技术培训服务；人才服务业务主要为企业提供优秀的互联
网研发人才； 项目研发业务主要为企业提供APP解决方
案及APP项目研发； 创业孵化业务为有创业梦想的学员
设立，为其提供创业辅导及天使投资等服务。
</p>
<br>
<p>
千锋秉承着<span>“用良心做教育”</span>的理念踏踏实实的做事，
<span>创办10年,现已成为业内口碑好、规模大、教学强的移动互联网研发培训机构。</span>
目前累计与国内<b>超过8200多家</b>IT相关企业建立人才输送合作,与<b>562所大学</b>
建立实训就业合作，每年为中国IT企业输送上万名移动开发工程师。
计划未来5年内实现年营收过10亿，为中国教育行业贡献一份力量。
</p>
</p>
</body>
<html>- 列表设置
A．list-style-type:disc(实心圆)/circle(空心圆)/square(实心方块)/none(去掉符号)
B．list-style-image:url(‘图片地址’);【改变序号为图片】
C．list-style-position：outside；列表的外面 默认值/inside；列表的里面
D．list-style:none; 去除列表符号
- 背景设置
background-color: bisque;【背景颜色】
background-image: url(../day04/04第二天知识点/案例/列表/images/pic.jpg);【背景图片覆盖，默认为平铺】
background-repeat: no-repeat（不平铺）/repeat（平铺 默认值）/repeat-x（横向平铺）/repeat-y（纵向平铺）;
background-position: left middle;【图片位置：水平 垂直，】
background-attachment: fixed;
简写：background：…顺序无所谓，程序都可以执行
例子：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
div{
background-image: url(../day04/04第二天知识点/案例/仿小米固定导航/images/大天使-拉克丝.jpg);
background-repeat: no-repeat;
background-size: 100% 100%;
background-attachment: fixed;
}
p{
color: bisque;
line-height: 50px;
font-size: 30px;
}
</style>
</head>
<body>
<div>
<p>
拉克珊娜·冕卫出身自德玛西亚，一个将魔法视为禁忌的封闭国度。 只要一提起魔法，人们总是带着恐惧和怀疑。
所以拥有折光之力的她，在童年的成长过程中始终担心被人发现进而遭到放逐，一直强迫自己隐瞒力量，以此
保住家族的贵族地位。虽然如此，拉克丝的乐观和顽强让她学会拥抱自己独特的天赋，现在的她正在秘密地运用
自己的能力为祖国效力。
</p><br>
<p>
光芒四射被动技能 拉克丝的伤害类技能会将能量注入敌人的体内，这股能量会持续6秒。 拉克丝的下一次攻击将会
点燃这股能量，以对目标造成额外魔法伤害（取决于拉克丝的等级）。
</p><br>
<p>
光之束缚快捷键：Q 朝目标地点发射一团光球，最多可束缚2个敌方单位2秒并对每个目标造50/100/150/200/250(+0.7)
魔法伤害。
</p><br>
<p>
曲光屏障快捷键：W 朝目标方向掷出拉克丝的魔杖，来保护她自己以及被魔杖触及的所有友方英雄免受50/65/80/95/110(+0.2)伤害，持续3秒。
当魔杖到达它的飞行终点时，就会进行返程，来保护她和被魔杖触及的所有友方英雄免受额外的50/65/80/95/110(+0.2)伤害，持续3秒。
如果去程时命中了一名友方英雄，那么返程提供的护盾值翻倍。
</p><br>
<p>
透光奇点快捷键：E 创建一个区域，使其中的敌方单位减速25/30/35/40/45%。 在5秒后，该区域会爆炸，对区域内的敌
人造成60/105/150/195/240(+0.6)魔法伤害。
再次激活此技能可以提前引爆该区域。
</p><br>
<p>
终极闪光快捷键：R 拉克丝发射一束耀目的光能射线，对一条直线上的所有敌人造成300/400/500(+0.75)魔法伤害。
如果有敌方英雄在被【终极闪光】命中后的1.75秒内死亡，那么就会返还它30/40/50%的冷却时间。
终极闪光还会引燃并刷新目标身上的光芒四射效果。
</p>
</div>
</body>
</html>
扫一扫
1610
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
