HTML基本样式css装饰

目录

网页三大部分:

基本样式

样式基本都有区分

 css的样式优先级：近大远小

基本先择器

css的尺寸

css中的颜色

css文字属性

css文本属性

---

网页三大部分:

 html: 骨架
 css: 装饰
 javascript: 动作

css 层叠 样式style 表
使用方式：
使用style标签来定义样式(规定放head里面)
使用style属性来定义样式

基本样式

color 字体颜色

width 宽度
height 高度

当直接在img属性里面放width，heigth和style样式一起设置时，属性没有样式大

当有很多一样的样式时它不管有多少，多会改变

样式基本都有区分

font 字体
background 背景
text 文本
border 边框 

 css的样式优先级：近大远小

 直接在img里面写style样式所以这个近所以这个大，而在头部head这里的styls样式远所有这个小，因此会执行width=200，height=300的

 最小的是直接在我们新建一个css文件，这里面就放所有的样式，不需要写标签，应为它本身就是样式表，直接写样式就好了

 

 直接使用.css样式表文件
如果定义了外部样式表 那么需要使用link标签进行引入

 近大远小指的是重叠的部分，当大的都没有宽或者高时，就会调用有的。 

基本先择器

标签选择器：    全部改变

id选择器 #      :  id只可以一个 

class选择器 .   ：class可以多选

css的尺寸

in 英寸

px 像素

% 百分比

em想对于父元素尺寸的比值（你的父元素越大你的em就越大）

css中的颜色

word         单词颜色

#00ff00  16进制颜色

rgb(0~255,0~255,0~255)  颜色自己调数值

示例：

r red红色
g green绿色
b blue蓝色
纯红: rgb(255,0,0)
纯蓝: rgb(0,0,255)
黑色: rgb(0,0,0)
白色: rgb(255,255,255)

rgba （0~255,0~255,0~255 ,0-1）颜色 ---a是透明的

示例

rgba(0,0,255,0，5)--半透明

rgba(0,0,255,0)--全透明

rgba(0,0,255,1)--一点都不透明

css文字属性

字体类型
font-family（改字体）: '华文琥珀';
字体大小
font-size（改大小）: 20px;
字体粗细
font-weight（字体加粗）: bold;（加粗）
字体风格
font-style: italic（斜体）

css文本属性

 text-align（文本对齐方式）：center（居中）