CSS设置style属性的3种方法

ID:16063 / 打印

可以将css样式编写到元素的style属性当中:

1.将样式直接写到style属性中,这种样式我们称为内联样式,内联样式只对当前的元素中的内容起作用,内联样式不方便复用,不推荐使用。

eg:

<p style="color:blue;font-size: 50px;">明月几时有,把酒问青天!</p>

2.也可以将CSS样式编写到head中的style标签里,叫做内部样式。将样式表编写到style标签中,然后通过CSS选择器选中指定元素

<head> 	<style type="text/css"> 		p{ 			color:green; 			font-size:40px; 		} 	</style> </head> <body> 	<p>明月几时有,把酒问青天!</p> </body>

3.还可以将样式表编写到外部的CSS文件中,然后通过link标签将外部的CSS文件引入到当前的页面中,href设置外部css文件的相对路径,使结构和表现完全分离。

<link rel="stylesheet" href="css/style.css" />

其他:
在CSS中,祖先元素的样式,也会被他的后代元素所继承;利用继承关系,可以将一些基本样式设置给祖先元素,这样所有的后代元素将会自动继承这些样式;
但是并不是所有的样式都会被子元素所继承。比如:背景相关的样式都不会被继承。

eg:

<!DOCTYPE html> <html> <head> 	<style type="text/css"> 		body{ 			font-size: 25px; 		} 	</style> </head> <body> 	<p>明月几时有?</p> 	<p class="p1">明月几时有?</p> 	<p>明月几时有?</p> 	<p>明月几时有?</p> </body> </html>
上一篇: CSS实现渐变式圆点加载动画
下一篇: CSS中隐藏元素的常见5种方法

作者:admin @ 24资源网   2024-10-30

本站所有软件、源码、文章均有网友提供,如有侵权联系308410122@qq.com

与本文相关文章

发表评论:

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。