第十一节 CSS引入的三种方式

 1 <!-- CSS:层叠样式表,有了CSS,HTML中大部分表示样式的标签就废弃不用了,HTML只负责文档的结构和内容,表现形式完全交给CSS,HTML文档变得更加简洁,方便爬虫爬取 -->
 2 <!DOCTYPE html>
 3 <html lang="en">
 4 <head>
 5     <meta charset="UTF-8">
 6     <title>Document</title>
 7
 8     <!-- CSS引入方法:
 9             1、外联式:通过link引入样式,实际开发中都是用外联式
10             2、嵌入式:通过style标签引入,在网页上创建嵌入的样式表,一般在网站首页使用,性能优化,加快网页加载速度,放在head中
11             3、内联式:通过标签的style属性,在标签上直接写样式,不推荐 -->
12
13     <link rel="stylesheet" type="text/css" href="main.css">
14
15     <style type="text/css">
16         h1{
17             font-size: 10px;
18             color: blue;
19         }
20     </style>
21 </head>
22 <body>
23
24     <h1>这是一个一级标题</h1>
25     <div>这是一个div标签</div>
26     <a href="https://www.baidu.com" style="font-size: 20;color: gold;" target="_blank">百度链接</a>
27 </body>
28 </html>

原文地址:https://www.cnblogs.com/kogmaw/p/12420249.html

时间: 2024-10-09 18:00:14

第十一节 CSS引入的三种方式的相关文章

python 中增加css样式的三种方式

增加css样式的三种方式: 1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Title</title> 6 <!--head中style是第一处写css样式的地方--> 7 <style> 8 .cl{ 9 /*背景色*/ 10 background-color

css 圣杯布局三种方式

所谓的圣杯布局就是左右两边大小固定不变,中间宽度自适应.我们可以用浮动.定位以及flex这三种方式来实现 一般这种布局方式适用于各种移动端顶部搜索部分,这是最常见的,如京东手机版主页面顶部搜索: 可以看到左边有个菜单按钮,中间是搜索框,右边是登录两个文字,左右大小是固定的,而中间部分则是随着手机屏幕尺寸的大小而自适应.   第一种方法 float实现: 1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 &

css引入、三种选择器

 css的引入方式有三种:行类样式.内部样式.外部样式表 一.行内样式 使用style样式引入css样式. 二.内部样式 在style标签中书写css代码.Style标签写在head中. 三.外部样式表 css代码保存在扩展名为.css的样式表中 html文件引用扩展名为.css的样式表.有两种方式:链接式.导入式. 链接式与导入式的区别 <link> 1.属于XTHML 2.优先加载css文件到页面 @import 1.属于css2.1 2.先加载HTML结构在加载css文件. css三种选

css使用的三种方式

方式一:行内样式 特点: 1)在一个标签内使用style属性编写css内容 2) 好处:直接和直观    弊端:是只对当前标签起作用 方式二: 内部样式 特点: 1)通常会在html的<head>标签内使用<style>标签编写css内容 2)好处: 可以一次性控制多个标签   弊端:html代码和css都写在html文件中,不好维护 方式三: 外部样式(推荐使用) 特点: 1)独立一个css后缀的文件编写css内容,然后在html文件中使用<link>标签导入外部cs

css折叠样式(1)——使用css样式的三种方式

一.css的声明标签是告诉浏览器应该是用什么形式去解析你,一般为:<!DOCTYPE html>  因为html5支持向下兼容,详细可看上图. 二.css样式的使用方式: (1)内链样式表: demo.html <!DOCTYPE html> <html> <head>     <title>内链样式使用</title>     <meta charset="utf-8"> </head>

css代码插入三种方式

1.内联式 <p style="color:red;font-size: 12px">iutt</p> 2.嵌入式 <style type="text/css"> span{ color: red; } </style> 3.外部式 <link rel="stylesheet" type="text/css" href="css.css"><

CSS布局的三种方式:

============================================================================== 1.默认文档流方式 以默认的HTML元素的结构顺序显示 ============================================================================== 2.浮动布局方式 =====浮动是将块元素的霸道属性--独占一行的行为取消,允许他人和他在一行显示 =====浮动其实是,这个块

CSS中的三种选择器

第一种:标签名选择器 格式:标签名{                    属性一:属性值:                    属性二:属性值:                    ...               }      例子:第一步:div{ background-color:#00ff00; font-size:20px;                 } 第二步:<div> 第二种方式</div > 第二种:类名选择器 格式:.类名{ 属性名:属性值; 属性

页面中插入CSS样式的三种方法

页面中插入css样式的三种方法总结 1. 外部样式 当样式需要应用于很多页面时,外部样式表将是理想的选择.在使用外部样式表的情况下,你可以通过改变一个文件来改变整个站点的外观.每个页面使用<link>标签链接到样式表. <link>标签在(文档的)头部: <head> <link rel="stylesheet" type="text/css" href="path/myCss.css"/> <