CSS学习笔记( 一)

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

<head>区内,如下:

<head>
……
<link href="/sims/css/admin.css" rel="stylesheet" type="text/css"/>
……
</head>

2.内部样式表
内部样式表是把样式表放到页面的<head>区里,这些定义的样式就应用到页面中了,样式表是用<style>标记插入的,从下例中可以看出

<style>标记的用法:

<head>
……
<style type="text/css">
hr {color: sienna}
p {margin-left: 20px}
body {background-image: url("images/back40.gif")}
</style>
……
</head>

二. 基本语法

CSS的定义是由三个部分构成:选择符(selector),属性(properties)和属性的取值(value)。基本格式如下:
selector {property: value} 
 选择符 {属性:值}

三.css的定义

1.ID选择符
定义ID选择符要在ID名称前加上一个“#”号。和类选择符相同,定义ID选择符的属性也有两种方法。下面这个例子,ID属性将匹配所有

id="intro"的元素:

#intro
{
font-size:110%;
font-weight:bold;
color:#0000ff;
background-color:transparent
}

(字体尺寸为默认尺寸的110%;粗体;蓝色;背景颜色透明)

2.类选择符
例一

p.right {text-align: right}
p.center {text-align: center}

在HTML标记里加入你定义的class参数:
<p class="right"> 这个段落向右对齐的
</p>

<p class="center">
这个段落是居中排列的
</p>

例二

.center {text-align: center}
(定义.center的类选择符为文字居中排列)

省略HTML标记的类选择符是我们经后最常用的CSS方法,使用这种方法,我们可以很方便的在任意元素上套用预先定义好的类样式。
这样的类可以被应用到任何元素上。下面我们使h1元素(标题1)和p元素(段落)都归为"center"类,这使两个元素的样式都跟随".center"这个类选择符:

<h1 class="center">
这个标题是居中排列的
</h1>
<p class="center">
这个段落也是居中排列的
</p>


3.HTML标记选择符

/* 定义段落样式表 */
p
{
text-align: center; /* 文本居中排列 */
color: black; /* 文字为黑色 */
font-family: arial /* 字体为arial */
}

你可能感兴趣的:(html,css,properties,url,Class,stylesheet)