首页 > 其他分享 >CSS(一)CSS引入方式

CSS(一)CSS引入方式

时间:2023-06-29 20:22:04浏览次数:36  
标签:文件 HTML 方式 样式 html css 引入 CSS

内联样式

在html标签内使用属性style,style属性可以包含任何css属性。直观但不利于维护,不推荐

<p style=" font-size: medium;"> css内联样式</p>

内部样式

在html文件头部声明样式,是这个HTML文件都可以使用,但是不能作用于其他HTML文件

<head>
   <title>Document</title>
   <style>
       p {
           color: red;
           font-size: medium;
      }
   </style>
</head>
<body>
   <p> css内部样式</p>
</body>
</html>

外部样式

在HTML文件的头部通过<link>标签引用外部的css样式文件,易维护。

# html文件
<head>
   <link rel="stylesheet" href="./public.css">
</head>
<body>
   <p>css外部引用</p>
</body>
</html>
# css文件
p {
  color: red;
  font-size: 20px;
}

标签:文件,HTML,方式,样式,html,css,引入,CSS
From: https://www.cnblogs.com/yjh1995/p/17515107.html

相关文章

  • CSS基础-背景
    背景background-color背景颜色,可以使用十六进制、rgb、rgba表示。语法/**selector背景元素的原则去*//**color背景颜色的值,可以是颜色名称、十六进制值、RGB、RGBA*/selector{background-color:color;}示例/**设置body标签背景为白色*/body{backg......
  • jmeter使用beanshell对SHA1WithRSA加密方式进行处理
    importjava.nio.charset.StandardCharsets;importjava.security.KeyFactory;importjava.security.PrivateKey;importjava.security.Signature;importjava.security.spec.PKCS8EncodedKeySpec;importjava.util.Base64;importorg.apache.commons.codec.digest.Dige......
  • 初入前端-CSS(1)
    CSSCSS介绍CSS(CascadingStyleSheets)是一种用于描述网页样式和布局的样式表语言。它与HTML配合使用,用于控制网页中元素的外观和排版。CSS样式由选择器和声明块组成。选择器指定要应用样式的HTML元素,而声明块包含一个或多个属性-值对,定义元素的样式。下面是一个基本的......
  • 初入前端-CSS(2)
    盒模型盒模型(BoxModel)是CSS中用于布局和定位元素的基本概念之一。它描述了一个元素在页面中所占据的空间,并定义了元素的内容、内边距、边框和外边距之间的关系。盒模型由以下四个部分组成:内容区域(Content):指的是元素的实际内容,例如文本、图像等。内边距(Padding):内边距是围......
  • 记录pc网站微信登录(内嵌二维码方式)
    官方文档地址:https://developers.weixin.qq.com/doc/oplatform/Website_App/WeChat_Login/Wechat_Login.html第一步:引入官方js  http://res.wx.qq.com/connect/zh_CN/htmledition/js/wxLogin.js或者把js下载下来放到自己项目里引用 好处是可以自己修改一些东西!(functio......
  • 通过CSS样式缩放图片导致图片模糊的解决方案
    在进行前端页面开发的过程中,通过使用CSS对图片进行等比例缩放,存在会使图片失真的情形。这种情况有点违反我们的通常认知,毕竟放大图片会使图片失真这很正常,但是缩小图片通常应该会使图片变清晰才对。目前我查找了很多资料都还没发现哪篇文章有深入分析其中的原理,姑且认为这是浏览器......
  • SpringBoot 2 种方式快速实现分库分表,轻松拿捏!
    大家好,我是小富~(一)好好的系统,为什么要分库分表?(二)分库分表的21条法则,hold住!本文是《分库分表ShardingSphere5.x原理与实战》系列的第三篇文章,本文将为您介绍ShardingSphere的一些基础特性和架构组成,以及在Springboot环境下通过JAVA编码和Yml配置两种方式快速实现分库......
  • 博科资讯:供应链改变经济发展方式
    导语:中国的第十一个五年规划(2006~2010)把加快实现经济发展方式的转型作为十一五经济工作的主线,而供应链生产模式的发展,正是经济发展方式转型的基本内容之一。近期发生的世界金融海啸,凸现了转变经济模式的重要性,也凸现了发展供应链生产的迫切性竞争力的突破口经济全球化的浪潮使得国际......
  • css实现空心三角形
    <divclass="triangle"></div>.triangle{width:0;height:0;border-style:solid;border-width:08px15px;border-color:transparenttransparent#568CFC;position:relative;}.triang......
  • CSS文字换行之word-wrap和word-break的区别
    CSS文字换行之word-wrap和word-break的区别word-wrap:break-word;word-break:break-all;这两种都可以,区别在于英文场景中,当一个英文单词的长度超过了父级容器长度时,word-wrap:break-word没什么用,word-break:break-all会强制换行,使单词断开。......