css基础
来源:互联网 发布:qq音乐mac无法登陆 编辑:程序博客网 时间:2024/06/12 23:38
1.css是什么?
css是层叠样式语言,对网页语言进行样式修饰2.css常见的语法
样式属性名:值;样式属性名:值;样式属性名:值;3.css在网页中哪些地方会出现
a.<标签名 属性名="值" 属性名="值" 属性名="值" style="css语言"></标签名>b.<style>
选择器名称{
css语言
}
</style>
c.把css语言直接书写在一个后缀是.css结尾的文件中,
网页中如果要使用该css文件,可以用以下2种方式引入
(1)<link href="css文件的地址" rel="stylesheet" type="text/css"/>href是定义被链接文档的位置。rel定义当前文档与被链接文档的关系。media规定被链接文档将显示在什么设备上。type规定被链接文档的MIME类型。
(2)<style>
@import 'css文件地址'
</style>
4.常见的选择器---7种
(1)标签选择器
p{
background-color:red
}
网页中所有p标签标示的内容,背景颜色是红色
(2)组合选择器---逗号
p,a{
background-color:red
}
网页中所有p标签和a标签标示的内容,背景颜色是红色
(3)派生选择器---空格
table a{
background-color:yellow
}
网页中所有table标签下面的a标签标示的内容,背景颜色是黄色
(4)类选择器---点
.one{
color:green
}
网页中所有class=one标示的内容,文本颜色都是绿色
(5)id选择器---井号
#two{
font-size:24px;
}
网页中所有id=two标示的内容,字体大小都是24px
(6)属性选择器---中括号
[type="button"]{
background-color:darkmagenta
}
网页中所有type=button标示的内容,背景颜色都是紫色
(7)所有内容----*
*{
border:orange dotted 5px
}
网页中所有内容,边框颜色是橘色,点状,粗细5像素
5.常见的css样式属性
背景
background:
background-color:背景颜色
background-image:背景图片
background-repeat:背景的重复
background-position:背景的定位
background-attachement:背景是否随着滚动条进行滚动
background-size:背景的大小
文本
color:文本颜色
text-align:文本的水平位置left/center/right;
line-height:行高
text-indent:段落首行缩进
text-decoration:文本的装饰
边框
border:上下左右颜色 上下左右4个边框的样式 上下左右4个边框的粗细
border-top:上边框的颜色 上边框的样式 上边框粗细
border-bottom:
border-left:
border-right:
border-color:上下左右4个边框的颜色
border-style:
border-width:
border-top-color:
border-top-style:
border-radius:
box-shadow:
尺寸:
width:
height:
外边距
margin:上 右 下 左
上 左右 下
上下 左右
上下左右
margin-top:
margin-right:
margin-bottom:
margin-left:
内边距
padding:
padding-top:
padding-right:
padding-bottom:
padding-left:
列表
定位:float
position:static relative absolute fixed
left:
top:
right:
bottom
display:
- CSS基础
- CSS基础
- CSS基础
- CSS基础
- CSS基础
- CSS基础
- CSS基础
- css基础
- CSS基础
- css基础
- css基础
- CSS基础
- css基础
- css基础
- CSS基础
- CSS基础
- CSS基础
- CSS基础
- javascriptDOM操作
- 单片机LM393(寻迹原理)
- Android Studio 部分查找快捷键
- bzoj 2179: FFT快速傅立叶
- win10 caffe 安装
- css基础
- Linux下编程有什么优势
- android官方侧滑菜单DrawerLayout详解
- 自定义cell注意事项
- Freemarker一些常用的标签及用法
- 单例模式
- Bootstrap学习-代码
- HTML5 CSS盒模型
- 【SDOI2009】bzoj1227 虔诚的墓主人