css概念
css:cascading style sheets层叠式样式表，规定了html标签在网页上的显示样式
html4的时候，w3c组织将html的结果和样式做了分离。
前端三层:
html 结构层，打开网页的整体架构。
css 样式层，装饰页面。
JavaScript 行为层，一些页面交互效果。
css作用
css两个重要的概念:层叠式，样式。
某一个标签有什么样式，直接将对应的属性及属性值罗列出来。
①css样式设置的时候，有两个关键:选择器，样式表。
②给盒子添加属性进行结构布局。
初步了解css的几个小样式
①文本样式
字体、颜色、大小
大小:font-size本身是一个复合属性font，里面的单一属性需要用font-单一属性名。
属性值:以像素为单位。
颜色:color，属性有几种经选择方案:十六进制，RGB,rgba，颜色名(英文)。
白色的几种表示方法
#ffffff，rgb(255,255,255),white
color: gold
字体:font-family复合属性的一个单属性，分中文字体和英文字体。 书写的时候将英文字体写在前面，中文字体写在后面。
英文常用字体:Arial,consolas
中文字体:默认为宋体，常用字体有宋体，微软雅黑。所有电脑都有宋体，写字体时标注好备选字体。
字体用引号包裹，字体之间用逗号隔开，表示或。
当文本全是中文时，它会跳过英文字体去寻找你设置的中文字体，如果电脑里没有隶书就会继续向下找变为微软雅黑。
为了追求加载速度，将一些中文字体的名字写成英文表示法。
微软雅黑:Microsoft Yahei
宋体:SimSun
②盒子实体化基本属性
实体化:给盒子宽、高、背景色、边框。
宽度:width属性值是像素为单位。
高度:hright属性值是像素为单位。
背景色:background-color,属性值就是颜色色值。
边框:border，复合属性，有多个属性值，属性值之间用空格隔开，边框的宽度、颜色、线的类型。
实线边框solid
代码↓
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"> <title>Document</title> <style> div{ width: 300px; height: 300px; background: gold; color: red; font-weight: bold; font-size: 40px; } p{ font-size: 30px; font-family: "Arial","隶书","微软雅黑","宋体"; width: 200px; height: 200px; background: lightblue; border: 5px solid red; } </style> </head> <body> <div>这里是文字</div> <p>字号大小和字体</p> </body> </html>
效果图↓
