标签:gif 水平对齐 逗号 :active set square col width 通配符
1.css样式表分别有:
内联样式表
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> <style> //这个是内联样式表<style></style>这里面可以书写css样式 </style> </head> <body> <div style="这个也是内联样式表"></div> </body> </html>
外部样式表
<link rel=“stylesheet” type=“text/css” href=“路径” />
外部样式表是从新创建一个专门的css文件在通过路径去链接
2.css选择符
选择符{属性:属性值;属性:属性值;}
例:
div{width:200px;height:100px;background:red; }
每个CSS样式由两部分组成,即选择符和声明,声明又分为属性和属性值
属性必须放在花括号中,属性与属性值用冒号连接。
每条声明用分号结束。
当一个属性有多个属性值的时候,属性值与属性值用空格分隔。
在书写样式过程中,空格、换行等操作不影响属性显示。
3.css选择符
元素选择符也可以叫类型选择符:
例:
<div> <header> <nav> <footer> <figure> ...
div , .hehe , p , #top {background:red;} 同时对多个选择符设置同一个样式 选择符与选择符之间用逗号分隔
4.选择符的优先级
选择符的优先级即选择符的权重 针对同一个元素或同一群元素 进行选择时起的冲突进行的优先选择的处理。 内联样式的权重为 1000 id选择符的权重为 0100 class选择符的权重为 0010 伪类选择符的权重为 0010 元素选择符的权重为 0001 继承样式的权重为 0000 后代选择符的权重:为后代选择符的权中之和
5.文本的属性
文本大小及单位
文本大小 (设置字体的大小 通常网页字体为12px或14px) font-size:12px; 单位 (通常单位为像素) px像素 pt点 em倍距 3pt=4px em是根据自身的字体大小来决定多少像素 元素的默认大小是16px 1em=16px
文本的属性
font-style:normal/ italic [设置文本为斜体] font-weight:normal(100-500)/ bold(600-900) [设置文本为粗体] font-family: “文本字体1”,”文本字体2”; [文本类型] text-align:left/center/right/justify [文本水平对齐方式] vertical-align:top/middle/bottom[垂直对齐方式] line-height:数字px;[设置文本在一行内的高度] 设置文本简写方式 font:加粗 倾斜 文本大小/行高 “字体”;
文本的颜色
颜色属性 十六进制值 #f00 #fa0000 red 颜色模式:光色模式 R G B FF 00 00
当然除了这个还可以用一些对应的单词
文本修饰
text-decoration 文本修饰 none:没有修饰 underline:添加下划线 overline:添加上划线 line-through:添加删除线 text-indent 首行缩进
6.背景的设置
背景颜色 background-color:#f00; 背景图片 background-image:url(图片路径); 背景图片平铺属性 background-repeat: repeat 默认平铺 repeat-x 横向平铺 repeat-y 纵向平铺 no-repeat 不平铺 背景图位置 background-position:值1(水平) 值2(垂直) left/center/right/数值 top/center/bottom/数值 数值可以设置负值 背景简写: background:颜色 图片路径 是否平铺 位置; 小扩展常用图片格式 jpg (图片有损质量 但肉眼难分辨 来减小图片大小 图片非搂空使用); png (图片有损质量 但肉眼分辨不出 来减小图片大小 搂空图片使用的格式) gif (图片有损严重 肉眼容易分别 常用与做动图)
7.浮动属性
float: none 默认不浮动 left 左浮动 right 右浮动
8.列表li相关独有属相
list-style-type[设置列表符号] disc(实心圆)/circle(空心圆)/square(实心方块)/none(去掉列表符号); list-style-image:url(路径); [自定义图片列表符号] list-style-position:outside(默认外边)/inside(里边);[定义符号所在位置] list-style:none;去掉列表符号
标签:gif 水平对齐 逗号 :active set square col width 通配符
原文地址:https://www.cnblogs.com/fuxiaoyon/p/11782493.html