CSS(Cascading Style Sheet,叠层样式表),作用是美化HTML网页。

/*注释区域*/    此为注释语法

一、样式表

(一)样式表的分类

1.内联样式表

和HTML联合显示,控制精确,但是可重用性差,冗余较多。

例:<p style="font-size:14px;">内联样式表</p>

2.内嵌样式表

作为一个独立区域内嵌在网页里,必须写在head标签里面。

<style type="text/css">

p   //格式对p标签起作用

{

样式;

}

</style>

3.外部样式表

新建一个CSS文件,用来放置样式表。如果要在HTML文件中调用样式表,需要在HTML文件中点右键→CSS样式表→附加样式表。一般用link连接方式。

有些标签有默认的边距,一般写样式表代码的时候都会先去除(也可以设置其他的样式),如下:

(二)选择器

1.标签选择器。用标签名做选择器。

2.class选择器。都是以“.”开头。

3.ID选择器。以“#”开头。

<div id="样式名">

4.复合选择器

(1)用“,”隔开,表示并列。

(2)用空

格隔开,表示后代。

(3)筛选“.”。

二、样式属性

(一)背景与前景

1.背景:

2.前景字体:

(二)边界和边框

border(表格边框、样式等)、margin(表外间距)。padding(内容与单元格间距)。

(三)列表与方块

width、height、(top、bottom、left、right)只有在绝对坐标情况下才有用。

 

 

链接的style:

  a:link 超链接被点前状态

  a:visited 超链接点击后状态

  a:hover 悬停在超链接时

  a:active 点击超链接时

  在定义这些状态时,有一个顺序l v h a

CCS样式表小结的更多相关文章

  1. 3、CCS样式表

    一.CCS样式表的分类(优先级从低到高): 1.浏览器默认样式表 2.外部样式表:在外部创建的.ccs文件中.使用外部样式表可以使样式应用于多个网页.通过这个方法只需改动一个文件就能改变整个网站的外观 ...

  2. CCS样式表

    一.css样式表 1.样式表分类 1.内联式 <p style="font-size:18px;">This is an apple</p> 2.内嵌样式表 ...

  3. CSS 小结笔记之三种样式表

    CSS 引入共有三种方式:内部样式表,内联样式(行内样式)表,外部样式表,当然也可以使用多重样式 内联样式 <div style="color:red;font-size:20px&q ...

  4. CCS基础样式表

    一.css样式表 1.样式表分类 1.内联式 <p >This is an apple</p> 2.内嵌样式表 作为一个独立的区域 内嵌在网页里面,必须写在head标签里面 & ...

  5. 我给女朋友讲编程CSS系列(1) –添加CSS样式的3种方式及样式表的优先权

    如果说,原生态就是美,那么,我们就没有必要穿衣打扮. 网页是什么? 说白了,网页就是一堆[html标签]有序的搭配,让[CSS属性值]整整容,请[Javascript语言]处理一下事件. 一个人的整容 ...

  6. CSS样式表分类

    1.内联样式表 <p  style="font-size:11px;">内联样式表</p> 2.内嵌样式表 写在head标签里 <style  typ ...

  7. 深度理解CSS样式表,内有彩蛋....

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  8. CSS样式表

    CSS样式及属性 样式标的基本概念 样式表的分类 1.内联样式表 和html联合显示,控制精确,但可重用性差,冗余多. 例:<p style="font-size:14px;" ...

  9. CSS样式表基础

    CSS的样式表其实就是美观页面的,加一些样式. 一.样式表的三种分类: ①内联样式:写在某一个标签里面的样式. 优点:控制精确. 缺点:代码重用性差.(太多了不好写)页面代码乱.(太乱,后期不方便看) ...

随机推荐

  1. Google考虑抛弃Cookies机制

    根据华尔街日报的报道,Google 正在考虑抛弃古老的浏览器 cookies 来追踪用户信息的机制.作为替代,Google 将开发一种「个人匿名标识机制」.Google 早前已经计划在 IE 和 iP ...

  2. MongoDB实战指南(三):MongoDB的锁机制

    与关系数据库一样,MongoDB也是通过锁机制来保证数据的完整性和一致性,MongoDB利用读写锁来支持并发操作,读锁可以共享写锁具有排他性.当一个读锁存在时,其他读操作也可以用这个读锁:但当一个写锁 ...

  3. [JAVA]HDU 4919 Exclusive or

    题意很简单, 就是给个n, 算下面这个式子的值. $\sum\limits_{i=1}^{n-1} i \otimes (n-i)$ 重点是n的范围:2≤n<10500 比赛的时候 OEIS一下 ...

  4. Git push错误non-fast-forward后的冲突解决

    当要push代码到git时,出现提示: error:failed to push some refs to ... Dealing with “non-fast-forward” errorsFrom ...

  5. jQuery name属性与checked属性结合获取表单元素值

    var paytype = $("input[name='paytype']:checked").val(); alert(paytype); input元素下名称为paytype ...

  6. hadoop 序列化源码浅析

    1.Writable接口         Hadoop 并没有使用 JAVA 的序列化,而是引入了自己实的序列化系统, package org.apache.hadoop.io 这个包中定义了大量的可 ...

  7. 函数page_cur_search_with_match

    /****************************************************************//** Searches the right position fo ...

  8. 登陆与注册以及Session

    Session  保存状态是在 登陆窗口  检查用户密码的动作上执行 .Models namespace 注册与登陆以及Session.Models { public class UserBF { p ...

  9. bzoj1007

    其实吧,就是一个半平面交,而且不用考虑转回来的情况,所以只要极角排序然后用栈即可给的是点斜式,比极角很方便至于完整版的半平面交还没写过,看到再说吧 ..] of longint; v:..] of b ...

  10. C# DataGridView添加新行的2个方法

    可以静态绑定数据源,这样就自动为DataGridView控件添加 相应的行.假如需要动态为DataGridView控件添加新行,方法有很多种,下面简单介绍如何为DataGridView控件动态添加新行 ...