首页  >  文章  >  web前端  >  css入门

css入门

高洛峰
高洛峰原创
2016-11-24 10:21:291545浏览

一、概念:
级联样式表(Cascading Style Sheet)简称“CSS”,通常又称为“风格样式表(Style Sheet)”,它是用来进行网页风格设计的
二、常见用法
1. 可给页面中所有同一标签元素进行加样式如:

div区域1

div区域1

姓名:成绩:
可在此页面的 head标签中,加入标签

二、css文件可以,单独写到一个普通文本文件保证起来,用到时可在标签中加载出来如:



三、超链接的几种样式
超链接有四种状态可指定,分别是a:link(未访问前)、a:hover(鼠标放入未点击前)、a:active(鼠标放入点击中未松开鼠标)、a:visited(访问后)四种。 其中一般是建议
a:link与a:active是一组,用一个样式。a:hover,a:active是一组用另一个样式。如:
a:link{
background-color:#06F;
color:#FFF;
text-decoration:none;            /*    text-decoration 为none 下划线没了   */
font-size:18px;
}
a:hover{
background-color:#FFF;
color:#F00;
font-size:24px;
}  ...等等。
四、标签 css中的优先级
可以为标签div ,指定一个ID,Class,或直接用style来搞,如下面:
这是一个div区域2

那么优先顺序是什么呢::标签选择器<类选择器五、简单div样式介绍
#div_1{
/*border-bottom:#F60 2px dashed;*/        /*  border-botton,可以对div的下边框单据进行设置样式,一般是颜色、字体大小(如2px 2个像素)、边框线形(如 dashed 虚线吧)  */
background-color:#F90;  
/*padding:20px 100px 200px 300px;上 右 下 左
margin:0px;*/       /*  padding 内容与边框距离, margin此边框与外面的div或body的距离  */
float:left; /* float是浮动着,原位置移动后,下面的标签会顶过来。如这个float:left,将把标签内部浮动在左边,那原来的下面的文本可直接流向右边了,下面的div会挤进来. position 是定位,可绝对来定位掉,定位后原来的位置会被其它的标签占用掉,因为一旦被position了那就被从文本流中拉出去了,不属于普通文本流不占用普通文档流的位置。 */
}
图文混排,就用要到css 样式中的 float:left,这样原本图片下面的文本,就自动流向了图片右边了。 

声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn