CSS 语法 学习css入门者看

2020-05-10 11:34:57易采站长站整理

  p { color: #FF0000!important }
  .blue { color: #0000FF}
  #id1 { color: #FFFF00}
  我们同时对页面中的一个段落加上这三种样式,它最后会依照被!important申明的HTML标记选择符样式为红色文字。如果去掉!important,则依照优先权最高的ID选择符为黄色文字。
  7. 注释:/* … */
  你可以在CSS中插入注释来说明你代码的意思,注释有利于你或别人以后编辑和更改代码时理解代码的含义。在浏览器中,注释是不显示的。CSS注释以"/*" 开头,以"*/" 结尾,如下:
  /* 定义段落样式表 */
  p
  {
  text-align: center; /* 文本居中排列 */
  color: black; /* 文字为黑色 */
  font-family: arial /* 字体为arial */
  }
  css可以用任何写文本的工具进行开发,如文本工具,dreamweaver开发
  css也是一种语言,这种语言要和html或者xhtml语言相结合才起作用,
  css简单来说就是用来美化网页用的,用css语言来控制网页的外观
  举个例子
  xhtml部分:
  <ul>
  <li>主页</li>
  <li>留言</li>
  <li>论坛</li>
  </ul>
  此时在页面上的表达形式是一个竖向列表,这样不够美观,
  可以css来改善这个列表为一个横向导航条和超链接
  css部分:
  ul{list-style:none;margin:0px;padding:0px}
  ul li{margin:0px;padding:0px;float:left;}
  ul li a{display:block;width:100px;height:30px;background:#efefef;color:#333;text-decoration:none;text-align:center}
  ul li a:hover{background:#333;color:#fff;}
  添加上css后,这个列表变成横向的导航条了,超级链接是淡色背景,灰色字体,没有下划线,高度是30像素,宽度是100像素
  当我们鼠标经过这个超级链接时候,变成灰色背景,白色字体
  在主页制作时采用CSS技术,可以有效地对页面的布局、字体、颜色、背景和其它效果实现更加精确的控制。
  只要对相应的代码做一些简单的修改,就可以改变同一页面的不同部分,或者页数不同的网页的外观和格式。
  它的作用可以达到:
  (1)在几乎所有的浏览器上都可以使用。
  (2)以前一些非得通过图片转换实现的功能,现在只要用CSS就可以轻松实现,从而更快地下载页面。
  (3)使页面的字体变得更漂亮,更容易编排,使页面真正赏心悦目。
  (4)你可以轻松地控制页面的布局 。
  (5)你可以将许多网页的风格格式同时更新,不用再一页一页地更新了。你可以将站点上所有的网页风格都使用一个CSS文件进行控制,只要修改这个CSS文件中相应的行,那么整个站点的所有页面都会随之发生变动。