CSS学习笔记(一)

1.CSS样式规则

格式:

选择器{属性:值;属性:值;······;属性:值;}

例子:


h2 {

        font-size: 30px;

        font-family:"微软雅黑";

        font-weight:normal;

        font-style:normal;

        }


 2.CSS字体样式属性

(1)字体大小:font-size

字体单位属性值如图所示

(2)字体:font-family

字体属性值常常有宋体、微软雅黑、黑体等。

(3)字体粗细:font-weight

字体粗细的属性值有normal、bold、bolder、lighter、100-900(100的整数值);数值400等价于normal,数值700等价于bold。

(4)字体风格:font-style

属性值如下:

normal:默认值,浏览器会显示标准的字体样式;

italic:斜体字体样式;

oblique:倾斜字体样式;

(5)**综合设置字体风格**

设置格式如下:

选择器{font:font-style font-weight font-size font-family;}

注:


1. 按照格式书写,不能变换顺序,各属性以空格隔开。

2. 无需设置的属性可省去(取默认值),必须保留font-size和font-family属性。


3.CSS注释

两种注释的使用规则:


1. 注释格式:

/* 需要注释的内容 */          “/*”为注释的开始,“*/”注释的结束。

2. 注释格式:

<!--需要注释的内容-->          “<!--”为注释的开始,“--> ”注释的结束。


4.CSS三种不同的样式表

1.行内式

语法格式:

<标签名 style=“属性:值;属性:值;······属性:值;”>内容</标签名>

语法中style是标签的属性,HTML中标签都拥有style属性。

2.内部样式表

这种方式是将CSS代码集中书写在HTML中的head头部标签中。

语法格式:


<head>

<style type="text/css">

选择器{属性:值;属性:值;······属性:值;}

</style>

</head>


3.外部样式表

这种方式是将所有的样式放在一个或者多个以.css为扩展名的外部样式表文件,

通过link标签链接到HTML文档中。

语法格式:


<head>

<link href="css文件的路径" type=“text/css” rel="stylesheet"/>

</head>


注:


1.link是单标签

2.href表示链接文件的URL,可以是相对路径或者绝对路径。

3.type的属性值表示链接的外部文件为CSS。

4.rel的属性值表示被链接的文档是一个样式表文件。


4.三种样式表的总结

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 14,686评论 1 92
  • 浏览器与服务器的基本概念 浏览器(安装在电脑里面的一个软件) 作用: ①将网页内容渲染呈现给用户查看。 ②让用户通...
    云还灬阅读 4,849评论 0 0
  • 概述 在网易云课堂学习李南江老师的《从零玩转HTML5前端+跨平台开发》时,所整理的笔记。笔记内容为根据个人需求所...
    墨荀阅读 6,938评论 0 7
  • HTML 5 HTML5概述 因特网上的信息是以网页的形式展示给用户的,因此网页是网络信息传递的载体。网页文件是用...
    阿啊阿吖丁阅读 9,700评论 0 0
  • 1.CSS基本概念 1.1 CSS的定义 CSS(Cascading Style Sheets)层叠样式表,主要用...
    寥寥十一阅读 5,906评论 0 6