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)只有在绝对坐标情况下才有用。

HTML静态网页 css样式表的更多相关文章

  1. 网页 CSS样式表

    昨天,我主要是对CSS样式表进行了一下复习. CSS样式表主要有三类:内联样式表.内嵌样式表.外部样式表,我们平时一般使用第二种样式表. 选择器主要包括:标签选择器.class选择器.ID选择器.复合 ...

  2. HTML静态网页(css样式表)

    CSS(Cascading Style Sheet,叠层样式表),作用是美化HTML网页. /*注释区域*/    此为注释语法 一.样式表 (一)样式表的分类 1.内联样式表 和HTML联合显示,控 ...

  3. 2016/2/19 css样式表 Cascading Style Sheet 叠层样式表 美化HTML网页

    一.样式表 (一)样式表的分类 1.内联样式表 和HTML联合显示,控制精确,但是可重用性差,冗余较多. 例:<p style="font-size:14px;">内联 ...

  4. 在网页中插入CSS样式表的几种方法

    1. 链入外部样式表 链入外部样式表是把样式表保存为一个样式表文件,然后在页面中用<link>标记链接到这个样式表文件,这个<link>标记必须放到页面的<head> ...

  5. CSS样式表、JS脚本加载顺序与SpringMVC在URL路径中传参数与SpringMVC 拦截器

    CSS样式表和JS脚本加载顺序 Css样式表文件要在<head>中先加载,这样网页显示时可以第一次就渲染出正确的布局和样式,网页就不会闪烁,或跳变 JS脚本尽可能放在<body> ...

  6. CSS样式表

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

  7. HTML基础(三)——css样式表

    CSS(Cascading Style Sheet,叠层样式表),作用是美化HTML网页. /*注释区域*/此为注释语法 一.样式表 (一)样式表的分类 1.内联样式表 和HTML联合显示,控制精确, ...

  8. 一起学HTML基础-CSS样式表-基本概念、分类、选择器

    一.基本概念: CSS  (Cascading Style Sheets)层叠样式表,是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言. ...

  9. CSS样式表继承详解

    最近在恶补css样式表的基础知识.上次研究了css样式表之冲突问题详解 .这次是对 css 继承 特性的学习. 什么是css 继承?要想了解css样式表的继承,我们先从文档树(HTML DOM)开始. ...

随机推荐

  1. 两种方法获取shadow ssdt

    ULONG GetShadowSsdtCurrentAddresses( PSSDT_ADDRESS   AddressInfo, PULONG          Length ) { PSYSTEM ...

  2. js倒计时(可定义截止日期)

    <div id="times_wrap" class="time_num"> 距离结束时间: <div class="time_w& ...

  3. AOP静态代理解析2-代码织入

    当我们完成了所有的AspectJ的准备工作后便可以进行织入分析了,首先还是从LoadTimeWeaverAwareProcessor开始. LoadTimeWeaverAwareProcessor实现 ...

  4. hdu1106 排序水题

    Problem Description 输入一行数字,如果我们把这行数字中的‘5’都看成空格,那么就得到一行用空格分割的若干非负整数(可能有些整数以‘0’开头,这些头部的‘0’应该被忽略掉,除非这个整 ...

  5. CodeForces 710F 强制在线AC自动机

    题目链接:http://codeforces.com/contest/710/problem/F 题意:维护一个集合,集合要求满足三种操作. 1 str:向集合插入字符串str(保证不会插入之前已经插 ...

  6. 《DSP using MATLAB》 示例Example4.1

    今天开始看第4章,从开始看这本书到现在,过去一个多月,收获不少,继续坚持.

  7. shell-bash学习04读取输入、分隔符、流程控制

    读入输出 输入通常是通过stdin或参数传递给命令; 输出出现在stderr或stdout; 管道,过滤器,管道操作符: cmd1 | cmd2 | cmd3; //最后还有输出 ls | cat - ...

  8. CSS3-网站导航,transform,transition

    网站导航: 1.a:link    visited    hover   active的顺序是很重要的,如果改变顺序,则hover以及active的状态不起作用 2.<a href=" ...

  9. js兼容方法:通过样式名获取元素,byClass

    function byClass(oParent,className){ if(document.getElementsByClassName){ //if it is Firefox return ...

  10. Dockerfile完成Hadoop2.6的伪分布式搭建

    在 <Docker中搭建Hadoop-2.6单机伪分布式集群>中在容器中操作来搭建伪分布式的Hadoop集群,这一节中将主要通过Dokcerfile 来完成这项工作. 1 获取一个简单的D ...