CSS第二讲 CSS属性

时间 2019-11-06

标签 css 第二属性栏目 CSS 繁體版

原文原文链接

1.文本属性css

文字font：html

font-size：字体大小ide

font-family：字体字体

font-weight：字体粗细ui

font-style：字体样式（如：倾斜等）url

color：字体颜色spa

line-height：居中设计

段落：xml

text-decoration:下划线htm

text-indent：设置文本缩进

text-align：设置对象内容对齐方式

2.边框属性

border-width：边框宽度

border-style：边框样式

border-color：边框颜色

nborder-collapse：表格边框合并为单边框

3.控制背景

background-p_w_picpath：设置背景图片

background-color：设置对象的背景颜色

background-position：设置对象的背景图片位置

background-repeat：设置对象的背景铺排填充

简写：

url（） repeat center center （图片路径，重复方式，水平位置，垂直位置）

4盒子模型

网页设计中每一个元素都是长方形盒子

margin：边界（俩相邻元素直接的距离）

border：表框

padding：当前对象和边界之间距离，内部距离

folat：浮动，当前队形浮动后，周围元素会环绕

clear：清除浮动

5.列表（list-style）

list-style-p_w_picpath：对象列表项标记的图形

list-style-position：对象如何根据文本排列

list-style-type：队形列表项实用的预设标记

6.定位（position）

position：static | relative | absolute | fixed

案例效果：

代码以下：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
*{ margin:0px; padding:0px;}
ul,ol,li{ list-style:none;}
body{ font-size:16px; font-family:"微软雅黑", "幼圆", "黑体", "宋体";}
#banner{ margin:0 auto; ; height:56px; }
#top{ ; height:45px; url(p_w_picpaths /navbg_03.gif) no-repeat;}
#top li{ ; height:45px; float:left; line-height:45px; text-align:center;}
#top li a{ text-decoration:none; color:#FFF; display:block; margin:0 auto; ; height:56px;}
#top li a:hover{ url(p_w_picpaths /mouseover_03.gif) no-repeat; color:#333;}

</style>

</head>