CSS的相关知识Ⅰ

总结一些css的基础知识

㈠css样式

css:cascading style sheets  层叠样式表

css内容和样式相分离,便于修改样式。

㈡css语法

㈢css添加方法

⑴行内添加:放在<body>标签里

⑵内嵌样式:放在<head>标签里

⑶单独文件:在<head>标签里添加<link>标签

⑷css添加方法—优先级

就近原则:行内样式>内嵌样式>链接样式>浏览器默认样式

㈣选择器

⑴标签选择器:此类型选择器样式的名字跟标签同名

⑵类别选择器:用“.”开头来定义,用class属性来进行引用。

⑶ID选择器:用“#”开头来进行定义,用ID属性来进行引用

区别:ID与class的区别是ID具有唯一性,ID唯一引用一次,class可以多次引用

⑷样式的嵌套声明:一个样式的名字,空格隔开,另外一个样式的名字

⑸样式的集体声明:一种样式与另外一种样式都要统一的设置为什么样的样式,中间用逗号隔开,它们的样式被统一起来。

⑹样式的全局声明:所有的样式被统一,用星号“*”作为选择器的名字,通常这样全局的样式,都作为整个网页的默认样式来使用。

⑺混合

㈤css样式---文本(text)

⑴单位

⒈px   像素

2.em  字符(em单位是自动的适应用户所使用的字体的)

3.%   百分比(相对概念,涉及继承关系,子层继承父层的属性值设定)

⑵颜色

1.rgb(x,x,x)   rgb值,每个颜色分量取值0-255

2.rgb(x%,x%,x%)  rgb百分值:0%-100%

3..rgba(x,x,x,x)   a值:0.0完全透明与1.0完全不透明之间

4.#rrggbb     十六进制数    例如:红色:#ff0000或者#f00(去掉重复位)

⑶文本样式

    属性                          描述              取值

1.color                      文本颜色           red:#f00  rgb(255,0,0)

2.letter-spacing        字符间距           2px    -3px

3.line-heigh              行高                 14px    1.5em    120%

4.text-align               对齐                 center(居中对齐),left,right,justify(两端对齐)

5.text-decoration      装饰线             none(无装饰线),overline(文本上方),underline(文本下方)

                                                        line-through(装饰线作为删除线贯穿文本之中)

6.text-indent            首行缩进          2em

注意以下几点:

1.利用.line-heigh垂直居中:将.line-heigh属性的取值跟元素heigh的取值设置为相等

2.水平方向对齐方式用text-align  ,如下图所示

3.在超链接样式的设置使用.text-decoration:none这个属性值可以去掉超链接的下划线,如下图所示

㈣字体:font

    属性                          描述

1.font                  在一个声明中设置所有的字体属性        font:bold    18px    幼圆

2.font -family       字体系列       font-family:“Hiragino Sans GB” ,“Microsoft YaHei”,sans-serif;

3.font-size           字号              14px    120%

4.font-style          斜体              italic

5.font-weight       粗体              bold

*font属性简化的使用方法

font:斜体   粗体  字号/行高   字体

font:italic   bold   16px/1.5em  '宋体'

希望有所帮助。

原文地址:https://www.cnblogs.com/shihaiying/p/11241426.html

时间: 2024-11-09 04:54:37

CSS的相关知识Ⅰ的相关文章

CSS选择器相关知识

一,派生选择器 li strong {     font-style: italic;     font-weight: normal;   } 指定一个元素中的子元素的样式.这种的选择器不会因为层级关系失效.如果li中包裹了其他包裹了strong的元素,那么strong元素的样式还是生效的. h1 > strong {color:red;} 和派生选择器的功能差不多,不同的是,多层包裹的话不会生效.只有在h1中包裹的strong元素才能生效. h1 + p {margin-top:50px;}

HTML入门基础教程相关知识

HTML入门基础教程 html是什么,什么是html通俗解答: html是hypertext markup language的缩写,即超文本标记语言.html是用于创建可从一个平台移植到另一平台的超文本文档的一种简单标记语言,经常用来创建web页面.html文件是带有格式标识符和超文本链接的内嵌代码的ascii 文本文件——html结构了解. html文本是由 html命令组成的描述性文本,html 命令可以说明文字. 图形.动画.声音.表格.链接等. html网页结构包括头部 (head).主

相关知识: JavaScript

相关知识: JavaScript JavaScript是一种编程语言,它被广泛用来实现web站点和应用中的交互效果. JavaScript可以同样式进行交互,你可以通过编写程序来动态改变文档上元素的样式. 有三种方法可以实现这样的效果: 控制样式表—可以添加.删除.修改样式表. 控制样式规则—可以添加.删除.修改样式规则. 控制DOM中的单个元素—可以不依赖样式表来修改元素样式. 更多细节 要了解 JavaScript的更多细节,可以到这个wiki JavaScript . 范例: 一个Java

angular管道相关知识

什么是管道 每个应用开始的时候差不多都是一些简单任务:获取数据.转换它们,然后把它们显示给用户. 获取数据可能简单到创建一个局部变量就行,也可能复杂到从WebSocket中获取数据流.一旦取到数据,我们可以把它们原始值的toString结果直接推入视图中. 但这种做法很少能具备良好的用户体验. 比如,几乎每个人都更喜欢简单的日期格式,例如1988-04-15,而不是服务端传过来的原始字符串格式 -- Fri Apr 15 1988 00:00:00 GMT-0700 (Pacific Dayli

python的list相关知识

关于list的相关知识 list01 = ['alex',12,65,'xiaodong',100,'chen',5] list02 = [67,7,'jinjiao_dawang','relax1949',53] #打印list01.list02 print(list01) print(list02) #列表截取.切片 print(list01[1]) print(list01[-2]) print(list01[1:3]) #列表重复 print(list01 * 3) #列表组合 prin

三层交换机相关知识

三层交换机相关知识 这次的作死之路又要开始了.这次的对象主要是交换机:还是三层的: 这是这次实验的总体用图: 现在现根据图上的标志:将所有的主机配置好:目前没有做任何vlan:所以PC1和PC3是能够互通的: 接下来:我想先去探索下三层交换机关闭portswitch会怎么样: 第一步:先关闭了再说: 因为按照图中的设计:PC1的帧如果想要到达PC2,那么就必然要经过LSW1.但是现在我关闭了g0/0/1端口的portswitch:现在pc1并不能ping通pc2: 通过百度:三层交换机的端口不仅

php学习day7--函数的相关知识

今天我们主要学了函数的相关知识,是个比较基础的知识,但也是很重要的. 一.函数 函数就类似于一个工具,我们写好函数之后可以直接进行调用,可以很大的减少代码的从用性,提高页面性能和可读性. 1.函数的定义 在php中函数的定义方式为: function  name($形参1,$形参2.....){ 要执行的代码 return  123: } 在上方的函数定义式中,name代表函数名,小括号内是形参,是用来传递参数,花括号中的就是调用时需要执行的代码. 函数的调用方式: name(实参1,实参2,.

svn常规操作与相关知识

Svn常规操作与相关知识 一.何谓版本控制 它是一种软件工程籍以在开发的过程中,确保由不同人所编辑的同一档案都得到更新,它透过文档控制记录程序各个模块的改动,并为每次改动编上序号,并且编辑错误之后还可以回溯到以前的版本 二.可供我们选择的版本控制系统 1.VCS  (本地版本控制) 2.VSS.CVS(集中版本控制) 3.ClearCase.SVN.Perforce.TFS(集中版本控制) 4.Mercurial(水银/水星).Git(分布式版本控制) 差异: 1.Git和其他版本控制系统的主要

黑马程序员---Objective-C基础学习---类、对象、方法相关知识笔记

------Java培训.Android培训.iOS培训..Net培训.期待与您交流! ------- 类.对象.方法相关知识笔记 Objective-C相对于C语言有了面向对象的特性,但是ObjC又没有其他面向对象语言那么多语法特性,ObjC本身对面向对象进行了精简.下面是一些相关知识笔记. 类定义 成员变量 方法和属性 self关键字 类定义 在C#.Java等其他高级语言中定义一个类是相当简单点的,直接一个关键字class加一对大括号基本就完成了,但是在ObjC中类的定义相对变化比较大.现