CSS基础知识

CSS基础知识学习笔记

===================================================================================

CSS基础：

    功能：美化网页显示效果

    思想：解开耦合，将网页框架与展示样式分开

 

CSS与HTML的结合方式：

    1、在HTML标签中结合：<p style="color:red"></p>

    2、在head标签中编写样式表：<style type="text/css">p:{color:red;}</style>

    3、编写外部CSS文件，在head标签内引入：<link rel="stylesheet" type="text/css" href="./css文件名">

 

CSS语法：

    1、选择器

    2、{}：其中方式要修改的样式表标签

    3、color：red;  样式属性键：样式属性值；如有多个样式属性值，可以样式属性值1 样式属性值2...

    4、/**/：注释标记

    5、如果嵌入到HTML中可以去掉选择器，因为嵌入的标签已经决定了选择器：样式属性键：样式属性值

 

CSS选择器：

    1、标签选择器：标签名称{样式属性表}

    2、id选择器：修改HTML指定id：<a id=""></a> 在style中：#id名{样式属性表}，注意要保证id的唯一性

    3、class选择器：修改HTML指定class：<div class="one"></div> <div class="one"></div>

    4、伪类选择器：

               link：未经访问的

               visited：访问过的

               hover：悬浮

               active：激活，点击

                   a：link{color:red}

                   a：visited{color:yellow}

    5、组合选择器：

              HTML：

                   <a id="one"></a>

                   <p id="two"></a>

                   <font></font>

              CSS:

                   #one,.two,font{}

              注意使用.,分隔开

 

CSS常用字体属性：

     1、font-family:字体名称;
     2、font-size：15px;字体大小|使用CSS的可以定制字体想多大多大，不受限制
     3、font-style:italic;斜体、倾斜的字体、粗体等
     4、font-weight：加粗属性，有四个固定的属性，100-900
     5、font-variant：small-caps;小型的大写字母支持：小写的字母变成大写的字母
     6、font：复合属性，复合了多个属性,填的时候严格按照文档填写，属性中如果有不需要的可以直接跳过

 

CSS常用背景属性：

     1、background-color:green;//设置选择器的背景色
     2、background-image：url("图片路径");
     3、background-repeat：repeat-x;//背景重复方式
     4、background-attachment：fixed;//移动网页的文字，背景内容不变
     5、background：复合属性；

 

CSS行与块标签：

    1、div块标签：<div></div> 可起到换行效果

    2、span行标签：<span></span>

 

未完待续。。。

欢迎指出错误不周之处