首页 > 其他分享 >HTML-CSS

HTML-CSS

时间:2022-12-01 17:25:01浏览次数:38  
标签:样式 HTML 样式表 使用 内联 CSS

知道怎么连接样式表就行。CSS能看懂就行了,具体样式现在都有成套的DESIGN

如何使用样式

当浏览器读到一个样式表,它就会按照这个样式表来对文档进行格式化。有以下三种方式来插入样式表:

外部样式表

当样式需要被应用到很多页面的时候,外部样式表将是理想的选择。使用外部样式表,你就可以通过更改一个文件来改变整个站点的外观。

<head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>

 

内部样式表

当单个文件需要特别样式时,就可以使用内部样式表。你可以在 head 部分通过 <style> 标签定义内部样式表。

<head>

<style type="text/css">
body {background-color: red}
p {margin-left: 20px}
</style>
</head>

 

内联样式

当特殊的样式需要应用到个别元素时,就可以使用内联样式。使用内联样式的方法是在相关的标签中使用样式属性。样式属性可以包含任何 CSS 属性。以下实例显示出如何改变段落的颜色和左外边距。

<p style="color: red; margin-left: 20px">
This is a paragraph
</p>

 

标签:样式,HTML,样式表,使用,内联,CSS
From: https://www.cnblogs.com/JohnsonQ/p/16942058.html

相关文章

  • CSS
    目录表单标签的补充说明CSS层叠样式表CSS选择器css基本选择器CSS组合选择器分组与嵌套属性选择器伪类选择器伪元素选择器选择器优先级CSS样式调节字体样式背景属性表单标......
  • 基础css样式
    目录css层叠样式表css选择器伪类选择器选择器生效优先级css字体颜色背景css层叠样式表CSS主要是用来调节html标签的各种样式'''思考:页面都是由HTML构成的并且页面上......
  • HTML 文本格式化
    HTML文本格式化(w3school.com.cn) 文本格式化标签标签描述<b>定义粗体文本。<big>定义大号字。<em>定义着重文字。<i>定义斜体字。<small>定义......
  • js,jQuery获取html5的data-*属性
    js,jQuery获取html5的data-*属性  今天做项目的时候发现一个坑,关于jQuery获取data-*属性的方法data(),特写此篇来记录。data-*自定义数据属性HTML5规定可以为元......
  • HTML属性
    属性为HTML元素提供附加信息。HTML属性HTML标签可以拥有属性。属性提供了有关HTML元素的更多的信息。属性总是以名称/值对的形式出现,比如:name="value"。属性总是......
  • CSS笔记
    1、概述如何学习CSS是什么CSS怎么用(快速入门)CSS选择器(重点+难点)美化网页(文字,阴影,超链接,列表,渐变.....)盒子模型浮动定位网页动画(特效)1.1、什么是CSSCascading......
  • 前端基础——CSS(如何查找标签、如何添加样式)
    前端基础——CSS(如何查找标签、如何添加样式)一、CSS样式表/*主要用来调节html标签的各种样式思考:页面都是由HTML构成的并且页面上有很多相同的HTML标签但是相同的H......
  • 【开发小技巧】022—CSS如何实现字体小于12px的效果
    大家都知道设置font-size小于12px的时候,显示都为12px。无法实现更小的字体了,但是面对UI图的时候出现小于10px的字体,第一想到的就是把字体直接作为图片放在到页面。那么CSS能......
  • html飘
    <divid="floatnotic"style="color:red;font-size:larger;width:200px;background-color:#ffd800;position:absolute;z-index:99999;display:block;">......
  • MVC中,如果从controller返回的不是一个html,而是一个文本,使用AJAX中如何获取?
    controller代码:publicActionResultUploadPicture(){returnContent("ok");//returnContent("{result:'"+imgMsg+"',url:'"+imgUrl+"'}");//本行是......