web开发------CSS

CSS(Cascaading Style Sheets)层叠样式表

目录

1.学习引入CSS的样式

内部样式

外部样式

内联样式

 代码风格

 空格规范:

选择器(selector)，按照一定的规则把元素选择出来

1.元素原则器   p{....}文档中的所有p标签听我号令

2.ID选择器   

3.类（class）

 4.全部选择器 

5.并列关系 

6.下级 

字体属性：

 2.1设置字体

a.字体样式

b.字体大小

c.文字样式

d.字体颜色

文本对齐

 文本修饰

 文本缩进（了解）

行高

---

主要控制样式的使用关系。

控制页面的布局(layout)，元素的样式(style)

1.学习引入CSS的样式

内部样式

body这个元素以及body的子元素都要应用这个规则，把背景改为黄色

外部样式

内联样式

---

 代码风格

 更建议第二种

 CSS不区分大小写，但是开发时统一用小写

 空格规范:

冒号后面带空格

选择器和{之间也有个空格

---

选择器(selector)，按照一定的规则把元素选择出来

1.元素原则器   p{....}文档中的所有p标签听我号令

a{.....}文档中的所有a标签听我号令

2.ID选择器   

#some=value {....}   找到文档中，元素属性的id是some-value的元素听我号令

3.类（class）

选择器  .some-class{......} 

 说明这个元素有俩个类，一个title 一个other-class

 

 4.全部选择器 

*{...} 文档中所有元素，听我号令

5.并列关系 

p，h1{...}   把所有的p和h1听我号令

6.下级 

 #some-id  p{...}  先找到#some-id,在它的所有子孙中，找到p标签

        #some-id  p{...}  先找到#some-id,在它的所有孩子中，找到p标签，不涉及孙子辈

字体属性：

 2.1设置字体

a.字体样式

 

写俩个字体的意思是，如果用户由宋体就显示宋体，没有宋体就显示幼圆 

b.字体大小

显然body是p的父类， 从父类继承下来的基础上改变的的倍数

粗细

font-weight: bold;

fond-weight: 700;

c.文字样式

 italic 斜体

d.字体颜色

第一种方法：color : yellow;

第二种方法：color : #000000;

写颜色时，如果全是F，可以写为color: #fff;

第四种方法：color: rgb(100,150,255);

透明度  0  完全透明  1 一点都不透明

color: rgba(100, 150, 255, .7)

文本对齐

 文本修饰

 文本缩进（了解）

代码缩进 code indent 

行高

指的是上下文本行之间的基线问题

题外话

 

元素部分，上面是看html，下面是看css 

总结：