CSS基础 外部样式表 内嵌样式表 行内样式表
CSS简述:css是Cascading Style Sheet的缩写,直译过来为层叠样式表或级联样式表,简称样式表。利用css样式表定义页面样式,将会大大减少设计工作量。一些好的css样式表的建立,可以很好的美化页面 精确定制页面的布局css的语法解析<style type="text/css">p{font-family:"宋体";color:red;font-size:30px;}
CSS简述:css是Cascading Style Sheet的缩写,直译过来为层叠样式表或级联样式表,简称样式表。利用css样式表定义页面样式,将会大大减少设计工作量。一些好的css样式表的建立,可以很好的美化页面 精确定制页面的布局
css的语法解析
<style type="text/css">
p{
font-family:"宋体";
color:red;
font-size:30px;
}
hr{
border:2px dashed red;
}
</style>
如上所示,<style>标签用来声明样式表的规则,p和hr表示选择器,即被修饰的对象。写在{}内的叫做属性和属性值,font-family和border这些都是属性,属性表示希望改变的样式,它们的后面跟着的是属性值,属性值表示改变后的样式
根据样式表的书写位置,可以将样式表分为外部样式表 内嵌样式表以及行内样式表
1.外部样式表
如果希望多个页面甚至整个网站应用同一种风格,类似于军人穿上统一的服装。那么就可以采用外部样式表。外部样式表顾名思义就是写在外部的,即不直接写在html文件中,需要创建一个后缀为.css的文件用来编写样式。然后链接到要使用改样式的html文件中。下面是我创建的一个简单的css外部样式表,创建完外部样式表之后,在将该样式表链接到要使用该样式的html文件当中
链接外部样式表可以使用<link>标签和@import方法
下面是使用<link>标签对外部样式表进行链接 href表示外部样式表的路径 type="text/css"表示文本类型的样式 rel="stylesheet"表示在网页中使用该外部样式
下面是@import方法 使用@import方法需要先用style标签来进行声明,url表示样式表的路径。
2.内嵌样式表
如果只需要网页中某些指定的标签采用统一的样式,那么可以使用内嵌样式表,内嵌样式表直接写在html文件中的head标签内,需要使用style标签声明
3.行内样式表
如果只想对html中单独的某个标签进行样式的设置,那么就可以使用行内样式表。行内样式表直接写在要设置样式的标签内即可
语法格式:<标签名 style="样式属性: 属性值;">.......</标签名>
更多推荐
所有评论(0)