CSS设置style属性的3种方法介绍_F11 - 专业站长和开发者的学习网站

分享到

CSS设置style属性的3种方法介绍

css 来源：互联网作者：佚名发布时间：2024-03-17 15:33:46 人浏览

摘要

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

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

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

eg：

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

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

<head>

color:green;

font-size:40px;

}

</style>

</head>

<body>

<p>明月几时有，把酒问青天！</p>

</body>

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

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

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

eg：

<!DOCTYPE html>

<html>

<head>

body{

font-size: 25px;

}

</style>

</head>

<body>

<p>明月几时有？</p>

<p class="p1">明月几时有？</p>

<p>明月几时有？</p>

</body>

</html>

您可能感兴趣的文章 :

原文链接 :

Tag : css(310)

html table+css实现可编辑表格的代码

要实现可编辑的 HTML 表格，你可以使用 JavaScript 和 HTML5 的 contenteditable 属性。 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29
CSS实现三栏布局的四种方法介绍

1. 什么是三栏布局常见的一种页面布局方式，将页面分为左栏、中栏和右栏左右两侧的盒子宽度固定，中间的盒子会随屏幕自适应一般中
CSS中隐藏元素的常见5种方法总结

在CSS中隐藏元素有多种方法，下面列出几种常见方法及其适用场景与区别： 1. display: none 1 2 3 .element-to-hide { display: none; } 适用场景：完全隐
CSS设置style属性的3种方法介绍

可以将css样式编写到元素的style属性当中： 1.将样式直接写到style属性中，这种样式我们称为内联样式，内联样式只对当前的元素中的内容起
使用CSS实现简单的翻页效果的代码

我们先来看一下翻页的过程动图，如下：观察动图，大致将此翻页过程分为三个状态，书页未翻开、书页翻动中、书页翻动完成，对应的是
使用CSS实现有趣的汉堡菜单按钮的代码

使用transition过渡属性和transform变形属性，让汉堡图标和关闭图标之间进行过渡、变形，形成视觉效果。适用于h5页面或者app页面中，隐藏菜
CSS实现菜单箭头动画效果

其实是很简单的一个效果思路：箭头图标相对li标签绝对定位，定位到列表之外+列表元素overflow：hidden +悬停动画 html 1 2 3 li class=listyle1 im
CSS实现剪切蒙版视差滚动效果

大家应该都知道响应式吧，像什么响应式布局等等，这都是我们在开发中经常能遇到的。在年前结束的一个公司项目中，涉及到了相关响应
CSS实现好看的聚光灯效果介绍

使用-webkit-background-clip和clip-path，并配合animation属性，实现一个好看聚光灯效果。可适用于页面加载或展示页面大标题内容。核心代码部分
CSS合并单元格四种方式示例介绍(table/display/flex

效果图：方式一：table【最简单写法】 colspan：规定单元格可横跨的列数。 rowspan：规定单元格可横跨的行数。通过table的colspan和rowspan轻松