01_css介绍

css编写的位置

CSS叫做层叠样式表,用来设置页面中元素的样式。背景颜色、字体颜色、字体大小。。。
CSS负责结构、表现、行为中的表现
css诞生就是为图文信息展示服务的

编写的位置:
1.内联样式:
    将样式编写到标签的style属性中
    <p style="color:red;"></p>
    这种样式只会对当前标签起作用,不能对样式进行复用,不方便后期维护,不推荐使用
    
2.内部样式表:
	将样式表编写到head中的style标签中
	<style type="text/css"></style>
	使用内部样式表,进一步将表现和结构分离,可以同时为多个元素设置样式,方便后期的维护

3.外部样式表:
	将样式表编写到外部的CSS文件中,然后通过link标签将外部文件引入
	<link rel="stylesheet" type="text/css" href="文件的路径"/>
	将样式编写到外部样式表中,可以在不同的页面中使用同一个样式表,
	完全将表现和结构分离,方便后期的维护,推荐使用的方式

基本语法

	body{
		color: pink;
	}
	
选择器:
	通过选择器可以选中页面中的一组元素,然后为其设置样式。

声明块:
	声明块中实际上就是一个一个CSS声明
	每一个CSS声明都是一个样式,实际上就是一个名值对的结构。
	名和值之间使用:链接
	    :左边是样式的名字
	    :右边是样式的值
	每一个声明以;结尾
	例子:
		color : red;
		font-size : 20px;

元素之间的关系

父元素
	直接包含子元素的的元素叫做父元素

子元素
	直接被父元素包含的元素叫做子元素

祖先元素
	直接或间接包含后代元素的元素叫做祖先元素,父元素也是祖先元素

后代元素
	直接或间接被祖先元素包含的元素叫后代元素,子元素也是后代元素

兄弟元素
	拥有相同父元素的元素叫做兄弟元素

块元素和内联元素

块元素:
	块元素会独占页面中的一行,无论他的内容的多少,
	一般使用块元素对页面进行布局

常见的块元素:
    div  p     h1~h6
	 
内联元素:
	内联元素只占用自身的大小,不会独占一行
	内联元素也叫行内元素(inline)
	一般内联元素都是用来为文本来设置效果

常见的内联:
	 span   a     img
	 
包裹规则:
	一般都是使用块元素去包裹内联元素,而不会使用内联去包裹块元素
	a元素可以包含任意元素,除了a本身
	p元素不能包含任何块元素

猜你喜欢

转载自blog.csdn.net/zljcxdm/article/details/82940760