CSS和html一样也是一种标记语言,在网页制作中非常重要,一些非常重要的显示,交互效果都是通过css来完成,css的最新版本是css3。
html中添加css样式的三个位置有:1.内部样式 2.外部样式 3.行内(内联样式)。
样式的预设:
*{ margin:0;padding:0; }
body,h1,h2,h3,h4,h5,h6,p,ul,ol,li,dl,dd,input,textarea{ margin:0;padding:0; }
Ul{ list-style:none; } /* 去掉默认的列表符的样式*/
a{ text-decoration:none; }/*去掉a标签自带的下划线*/
img{ border:none; } /*去掉img自带的边框*/
1、 内部样式:在head内部应用 ,利用<style></style>标签包含起来。
格式:<style type=”text/css”>
选择器{ 属性:属性值; }
</style>
2、 外部样式:w3c标准,真正实现了结构与表现相分离
<link href="css文件路径" rel="stylesheet" type="text/css" />
3、 行内(内联)样式
行内样式是所有加载css方式中最直接的一种,直接使用HTML元素的style属性来改变元素样式。Style可以应用在任何标签上,用这种方法,可以很简单的对某个元素单独定义样式,缺点就是样式只能对当前元素生效,并且也增加了标签中代码的臃肿。
<div style=”color:red;”></div>
外部样式应用方法:
第一步:新建一个css后缀的文件并保存到网站对应目录;
第二步:将style中的内容,全部剪切到css文件中;
第三步:将新建的css文件与html文件关联起来。(注意检查图片路径是否正确)
网站路径:
网站路径分为两种,绝对路径和相对路径
绝对路径一般用于站外的链接,例如:http://www.baidu.com
相对路径:一般用于站内的链接
../ 返回上级目录
/ 打开目录