css的引入方法

1.外部途径:

建立xx.css文件与html文件放在同一目录下

加入  <link rel="stylesheet" type="text/css" href="4.css"/>
<!DOCTYPE html>
<html>
  <head>
    <meta name="generator"
    content="HTML Tidy for HTML5 (experimental) for Windows https://github.com/w3c/tidy-html5/tree/c63cc39" />
    <meta charset="utf-8" />
    <title>CSS样式</title>
    <meta name="keywords" content="用css给网页装潢" />
    <meta name="description" content="用css给网页装潢" />
    <link rel="stylesheet" type="text/css" href="4.css"/>
  </head>
  <body>
    <p>段落</p>
    <p>段落</p>
    <p>段落</p>
    <p>段落</p>
  </body>
</html>
p{
    font-size:40px;
    color:red;
}

2.内页样式:直接写到html的头部分

<style type="text/css">
        p{
        font-size:40px;
        color:red;
          }
</style>
<!DOCTYPE html>
<html>
  <head>
    <meta name="generator"
    content="HTML Tidy for HTML5 (experimental) for Windows https://github.com/w3c/tidy-html5/tree/c63cc39" />
    <meta charset="utf-8" />
    <title>CSS样式</title>
    <meta name="keywords" content="用css给网页装潢" />
    <meta name="description" content="用css给网页装潢" />
    <style type="text/css">
        p{
        font-size:40px;
        color:red;
          }
</style>
    <!--   <link rel="stylesheet" type="text/css" href="4.css"/>-->
  </head>
  <body>
    <p>段落</p>
    <p>段落</p>
    <p>段落</p>
    <p>段落</p>
  </body>
</html>

3.行内样式

<!DOCTYPE html>
<html>
  <head>
    <meta name="generator"
    content="HTML Tidy for HTML5 (experimental) for Windows https://github.com/w3c/tidy-html5/tree/c63cc39" />
    <meta charset="utf-8" />
    <title>CSS样式</title>
    <meta name="keywords" content="用css给网页装潢" />
    <meta name="description" content="用css给网页装潢" />
  </head>
  <body>
    <p style=" font-size:40px; color:red;">段落</p>
    <p>段落</p>
    <p>段落</p>
    <p>段落</p>
  </body>
</html>

CSS 基本语法(语法简单的理解就是规则)
1)CSS 规则由两个主要的部分构成:
1、选择器
2、一条或多条声明。
选择器:要给元素装潢加样式(首先得选中需要装潢的元素)
声明:声明由一个属性和一个值组成
属性是您希望设置的样式属性。每个属性有一个值。属性和值被冒号分开,如果
要定义不止一个声明,则需要用分号将每个声明分开,养成良好的习惯,就算一
个声明我们也加上分号。
选择器{属性:值;}
使用空格以及回车让css 更可读!
选择器{
属性:值;
}
2)小试牛刀
选择器有一种最简单的写法直接写上你要选中的元素!
p {
color:red; 该行声明将颜色设置为红色
font-size:30px; 该行声明将字体大小设置为30px
}
查看效果!
3)CSS 加注释
/*注释的内容*/

    <style type="text/css">
        p{
        font-size:40px;
        color:red;
          }/*css的注释*/
</style>
时间: 2024-10-11 11:18:59

css的引入方法的相关文章

python--前端之CSS(css页面引入方法、选择器之基本选择器、组合选择器)

CSS产生背景: 为了让网页元素的样式更加丰富,也为了让网页的内容和样式能拆分开,CSS由此思想而诞生,CSS是 Cascading Style Sheets 的首字母缩写,意思是层叠样式表. 有了CSS,html中大部分表现样式的标签就废弃不用了,html只负责文档的结构和内容,表现形式完全交给CSS,html文档变得更加简洁. CSS基本语法及页面引用 CSS基本语法 CSS 规则由两个主要的部分构成:选择器,以及一条或多条声明. selector { property: value; pr

CSS基础-引入方法,选择器,继承

一.CSS引入方法:行内式.嵌入式.导入式.链接式. 1.行内式. 即:在标签的style属性中设定CSS样式. 例子:<div style="行内式</div> 2.嵌入式 即:将页面各种元素的设置集中写在<head></head>标签里. 例子: <head> <style type="text/css"> div{ background-color:blue; } </style> </

iOS之在webView中引入本地html,image,js,css文件的方法 - sky//////////////////////////////////////ZZZZZZZZZZZZZZZ

iOS之在webView中引入本地html,image,js,css文件的方法 2014-12-08 20:00:16CSDN-sky_2016-点击数:10292 项目需求 最近开发的项目,需要一个webView,同时这个webView会需要引入一些项目中的资源: 一个本地的html文件,作为webView的模板 两张loading图片,在图片未加载的时候进行占位 jquery.js,scrollLoading.js 也是本地的,实现滚动加载图片功能 然后就开始了漫长的Google历程. 在w

xcode,在webView中引入本地html,image,js,css文件的方法

http://www.shuizhongyueming.com/2014/01/load-local-image-js-css-file-to-webview-in-xcode/ xcode,在webView中引入本地html,image,js,css文件的方法

Zen Coding: 一种快速编写HTML/CSS代码的方法[Emmet]

译自:[Smashing Magazine](http://www.smashingmagazine.com/2009/11/21/zen-coding-a-new-way-to-write-html-code/)中文:[Zen Coding: 一种快速编写HTML/CSS代码的方法](http://www.qianduan.net/zen-coding-a-new-way-to-write-html-code.html) 请尊重版权,转载请注明来源! - - - - - - 在本文中我们将展示

阿里iconfont引入方法

原文:iconfont的引入方法 第一步:使用font-face声明字体@font-face {font-family: 'iconfont';src: url('iconfont.eot'); /* IE9*/src: url('iconfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */url('iconfont.woff') format('woff'), /* chrome.firefox */url('iconfont

在html页面引用css文件的方法

引用CSS文件到Html方法-css引入,css引用 使用不同的方法来引用css样式表,最终到达的效果相同,但是使用不同方法应用的css文件将影响到SEO及网页打开速度效率. html引用css方法如下1.直接在div中使用css样式制作div+css网页2.html中使用style自带式3.使用@import引用外部CSS文件4.使用link引用外部CSS文件 推荐此方法 扩展阅读:link与import区别 接下来我们将逐个讲解html引用css方法的例子 1.直接在html标签元素内嵌入c

css样式引入

1.  css样式引入HTML方法:四种方式          样式优先级:行内样式>内嵌式(内部样式)>外部样式(链接式+导入式)(后两者是就近原则) 行内样式:在标签中标记style属性 <p style="font-size:14px;color:green;">直接在HTML标签中设置的样式</p> 内嵌式(内部样式表):在<head></head>标签对中添加<style></style>标签

CSS清除浮动方法集合

CSS清除浮动方法集合 一.浮动产生原因   -   TOP 一般浮动是什么情况呢?一般是一个盒子里使用了CSS float浮动属性,导致父级对象盒子不能被撑开,这样CSS float浮动就产生了. 浮动产生样式效果截图 本来两个黑色对象盒子是在红色盒子内,因为对两个黑色盒子使用了float浮动,所以两个黑色盒子产生了浮动,导致红色盒子不能撑开,这样浮动就产生了. 简单地说,浮动是因为使用了float:left或float:right或两者都是有了而产生的浮动. 二.浮动产生负作用   -