1.css的简介

  •  css:层叠样式表 (层叠:一层一层的;样式表:很多的属性和属性值)
  • 使页面显示效果更好
  • 将页面内容和显示样式进行分离,提高了显示功能。

2.css和html的结合方式(4种)

  1. 在每一个html语言上都有一个属性style,把css和html结合起来

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<div style="background-color: aquamarine;color:blueviolet"> 我睁开双眼踏入这个世界 </div>
</body>
</html>

2.使用html的一个标签实现<style>标签,写在head里面

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
div{
background-color: aquamarine;
color:blueviolet;
}
</style>
</head>
<body>
<div > 我睁开双眼踏入这个世界 </div>
</body>
</html>

3.在style标签里面使用语句

@import url("文件的路径");

-第一步:创建一个css文件

<style type="text/css">
@import url("div.css");
</style>

4.使用头标签link,引入外部css文件

-第一步:创建一个css文件

-<link rel="stylesheet" href="div.css" />

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<link rel="stylesheet" href="div.css" />
</head>
<body>
<div > 我睁开双眼踏入这个世界 </div>
</body>
</html>

  • 第三种方式在某些浏览器下不起作用,一般使用第四种。

CSS学习笔记day1的更多相关文章

  1. CSS学习笔记

    CSS学习笔记 2016年12月15日整理 CSS基础 Chapter1 在console输入escape("宋体") ENTER 就会出现unicode编码 显示"%u ...

  2. HTML+CSS学习笔记 (7) - CSS样式基本知识

    HTML+CSS学习笔记 (7) - CSS样式基本知识 内联式css样式,直接写在现有的HTML标签中 CSS样式可以写在哪些地方呢?从CSS 样式代码插入的形式来看基本可以分为以下3种:内联式.嵌 ...

  3. HTML+CSS学习笔记 (6) - 开始学习CSS

    HTML+CSS学习笔记 (6) - 开始学习CSS 认识CSS样式 CSS全称为"层叠样式表 (Cascading Style Sheets)",它主要是用于定义HTML内容在浏 ...

  4. HTML+CSS学习笔记(5)- 与浏览者交互,表单标签

    HTML+CSS学习笔记(5)- 与浏览者交互,表单标签 1.使用表单标签,与用户交互 网站怎样与用户进行交互?答案是使用HTML表单(form).表单是可以把浏览者输入的数据传送到服务器端,这样服务 ...

  5. HTML+CSS学习笔记(4) - 认识标签(3)

    HTML+CSS学习笔记(4) - 认识标签(3) 1.使用<a>标签,链接到另一个页面 使用<a>标签可实现超链接,它在网页制作中可以说是无处不在,只要有链接的地方,就会有这 ...

  6. HTML+CSS学习笔记(3)- 认识标签(2)

    HTML+CSS学习笔记(3)- 认识标签(2) 1.使用ul,添加新闻信息列表 在浏览网页时,你会发现网页上有很多信息的列表,如新闻列表.图片列表, 这些列表就可以使用ul-li标签来完成.ul-l ...

  7. HTML+CSS学习笔记(2) - 认识标签(1)

    HTML+CSS学习笔记(2) - 认识标签(1) 1.语义化,让你的网页更好的被搜索引擎理解 标签的用途: 我们学习网页制作时,常常会听到一个词,语义化.那么什么叫做语义化呢,说的通俗点就是:明白每 ...

  8. HTML+CSS学习笔记(1) - Html介绍

    HTML+CSS学习笔记(1) - Html介绍 1.代码初体验,制作我的第一个网页 <!DOCTYPE HTML> <html> <head> <meta ...

  9. css学习笔记四

    广州天气变冷了,css学习笔记还是要总结. 总结: 1:几米页面静态页面主要是一列结构头部banner图,mainbody部分放文字内容和图书图片,底部是页面的版权信息 2:腾讯软件中心静态页面制作( ...

随机推荐

  1. Vuex- Action的 { commit }

    Vuex 中 使用 Action 处理异步请求时,常规写法如下: getMenuAction:(context) =>{ context.commit('SET_MENU_LIST',['承保2 ...

  2. 老铁,这年头不会点Git真不行!!!

    版本控制 说到版本控制,脑海里总会浮现大学毕业是写毕业论文的场景,你电脑上的毕业论文一定出现过这番景象! 毕业论文_初稿.doc 毕业论文_修改1.doc 毕业论文_修改2.doc 毕业论文_修改3. ...

  3. 小子给大家分享一个或者多个新手创建tableview经常会遇到的坑(动态创建控件,xib的重用)

    小子最近做了一个根据接口返回的数据在Cell中动态创建控件,感觉应该会一部分人卡在这里,小子就跟大家分享一下: 1.控件重复创建:这个问题出现的原因是动态创建的cell内容的时候,无法进行重用设置,所 ...

  4. 【STL深入理解】vector

    这篇文章不打算讲述vector的基本用法,而是总结一下近期我大量阅读C++经典书籍时遇到的一些关于vector的容易忽略的知识点,特意将它们记录下来,以便以后查阅. 1.v[0]和v.at(0)的区别 ...

  5. es6 模板字变量和字符串占位符

    开发者一直在寻找一种创建多行字符串的形式,但要使用单引号双引号字符串一定要在同一行才行. 老办法: 还有其他办法,虽然能实现,但是太啰嗦 es6模板自变量 使用反撇好(`)替换了单双引号 反撇好中的所 ...

  6. Spring Boot修改启动端口

    spring boot是个好东西,可以不用容器直接在main方法中启动,而且无需配置文件,方便快速搭建环境.可是当我们要同时启动2个springboot工程时,就会有问题,有可能会因为8080端口被第 ...

  7. Zabbix实战-简易教程--监控OSPF

    一.需求背景 网络工程师需要对OSPF进行监控,需求如下: 1.状态展示 OSPF区域状态 OSPF接口状态 OSPF邻居状态 2.问题报警 触发器设置: a.OSPF区域状态  b.OSPF接口状态 ...

  8. 关于mybatis-generator的问题

    1.运行完mybatis-generator没有出现问题,但是代码看不到,出现这种东西: 你需要使用相对路径,如项目名+/src/main/java,就可以解决了 2.附录我的代码以供参考: < ...

  9. d3 画地图终极自适应大小方案

    d3,v4以前用d3画地图的时候,为了让地图差不多正好画在容器的上下左右正中间,不得不慢慢的这样调: const projection = d3.geoMercator() .center([108. ...

  10. 51Nod 1003 阶乘后面0的数量(数学,思维题)

    1003 阶乘后面0的数量 基准时间限制:1 秒 空间限制:131072 KB 分值: 5         难度:1级算法题 n的阶乘后面有多少个0? 6的阶乘 = 1*2*3*4*5*6 = 720 ...