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. HTML静态网页 css样式表

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

  2. 网页 CSS样式表

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

  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. 在cad中画一条长500mm,垂直90度的线段

    视频教程奉上 方法1.点击线段按钮,鼠标指定一点,输入500,再输入<90. 方法2,点击线段按钮,鼠标指定一点,输入500,按tab,再输入90.

  2. 转 批处理 %~dp0的意义

    http://nealcai.iteye.com/blog/1685192 http://blog.csdn.net/caz28/article/details/7448677 http://stac ...

  3. 贴片方式COB COF COG

    英文简称: COB英文全称: Chip On Board中文全称: 通过邦定将IC裸片固定于印刷线路板上 英文简称: COF 英文全称: Chip On FPC 中文全称: 将IC固定于柔性线路板上 ...

  4. 《windows程序设计》学习_4:文本输出,加滚动条

    //总行数 #define NUMLINES ((int) (sizeof sysmetrics / sizeof sysmetrics [0])) struct { int Index ; TCHA ...

  5. dg error

    startup force;ORACLE instance started. Total System Global Area 1068937216 bytesFixed Size           ...

  6. Xcode5新特性

    小引: 自从北京时间2013年06月11日苹果发布Xcode 5 Developer Preview 1,到现在,苹果也放出了Xcode 5 Developer Preview 3,速度还是蛮快的,希 ...

  7. System.Data.SQLite兼容32位和64位问题

    SQLite版本分的很详细,本机是64位在32位会出现问题,经过搜索找到解决方案. 这是我以前写的32位在我现在的机子上的运行报错. 类似这样的. 将当前说明文档的目录下的x64.x86目录和Syst ...

  8. java 对象数组定义

    下面代码实现了定义一个数组对象 public class Student { private String username; private int num; public Student(Stri ...

  9. asp.net word内容读取到页面

    1.添加Microsoft.Vbe.Interop.dll引用. 2.以下方法可以简单的读取到word文档文字内容,不包括图片.格式等. private string ReadWordFile(str ...

  10. WPF之Binding的三种简单写法

    环境 类代码 public class Person:INotifyPropertyChanged { private string name; public string Name { get { ...