我们第一天说了简单的HTML,第二天说了简单的CSS.那么今天.咱们就来说一说他们的结合如何使用吧!

首先说引用方式,和使用方法吧!
  1.内部样式表.(放入<head>中)

 <head>
<style>
div{
4 color:red:
5 }
</style>
<head>

[提示]:红色区域是样式,和元素选择器 

 2.内联样式表(写在标签里的样式)

<p style="color: red;"></p>

注意:语法一定要是style =""双引号里面的属性和属性值哦!

  3.外部样式表(引入外部CSS样式表)最好也是放在head里面

 <head>
<link rel="stylesheet" href="xxx.css">
  </head>

注意:其中"stylesheet" //样式表

  href //地址

  xxx.css中的xxx就是文件名,并且是你自定义的文件名!(后缀名.css不能改哦!)

还有就是CSS选择器!选择器是CSS样式表中重要的组成部分

CSS选择器

  1.元素选择器

div,p,span,hr,等等很多直接用元素接花括号的 都是元素选择器

  2.ID选择器(id)

我们在样式表中用id属性值修改标签属性,样式.

语法:

 <div id="div_id">
//div_id id属性和属性值
</div>
//在style里使用
//用法 ID选择器开头必须有#
<style>
#div_id{
width:100px;//div 宽100像素
height:100px;//高100像素
          background:red;//背景颜色是红色;
}
</style>

然后呢,他的效果就是这样的:

今天就写这么多吧!然后呢..........我打算弃坑了!因为 我的讲师说 我们要写点高大上的东西 不要写基础了!所以 我就果断弃坑了!以后有时间 我再继续更这个吧!!!

CSS 简单了解(二)的更多相关文章

  1. CSS标签选择器(二)

    一.CSS选择器概述 1.1.CSS功能 CSS语言具有两个基本功能:匹配和渲染 当浏览器在解析CSS样式时,首先应该确定哪些元素需要渲染,即匹配哪些HTML元素,这个操作由CSS样式中的选择器负责标 ...

  2. 前端学习日记之HTML、CSS 简单总结

    前端学习日记之HTML.CSS 简单总结 标签(空格分隔): html css 前端学习日记 html超文本标记语言 一. h标题标签 h1-h7 <!DOCTYPE html> < ...

  3. css进阶之二:flex弹性布局

    布局模式是指一个盒子与其兄弟.祖先盒的关系决定其尺寸与位置的算法.css2.1中定义了四种布局模式,分别是块布局.行内布局.表格布局.以及定位布局.css3引入了新的布局模式Flexbox布局,灵活度 ...

  4. iOS开发UI篇—Quartz2D简单使用(二)

    iOS开发UI篇—Quartz2D简单使用(二) 一.画文字 代码: // // YYtextview.m // 04-写文字 // // Created by 孔医己 on 14-6-10. // ...

  5. css3 calc():css简单的数学运算-加减乘除

    css3 calc():css简单的数学运算–加减乘除 多好的东西啊,不用js,一个css就解决了. .box{ border:1px solid #ddd; width:calc(100% - 10 ...

  6. 使用C语言实现二维,三维绘图算法(3)-简单的二维分形

    使用C语言实现二维,三维绘图算法(3)-简单的二维分形 ---- 引言---- 每次使用OpenGL或DirectX写三维程序的时候, 都有一种隔靴搔痒的感觉, 对于内部的三维算法的实现不甚了解. 其 ...

  7. HTML与CSS简单页面效果实例

    本篇博客实现一个HTML与CSS简单页面效果实例 index.html <!DOCTYPE html> <html> <head> <meta charset ...

  8. CSS简单使用

    CSS简单使用 标签 : 前端技术 CSS(Cascading Style Sheet : 层叠样式表单)用来定义网页显示效果. 可以解决HTML代码对样式定义的重复,提高后期样式代码的可维护性,并增 ...

  9. css简单的一些基础知识

    css层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言.CSS不仅可 ...

随机推荐

  1. 百度开源上传组件WebUploader的formData动态传值技巧

    基于Web页面的文件上传一直是互联网应用开发中避免不了的,从asp时代的AspUpload组件.到asp无组件上传,到.Net时代的FileUpload,再到HTML5时代的各种基于jQuery的上传 ...

  2. 磁盘IO:缓存IO与直接IO

    文件系统IO分为DirectIO和BufferIO,其中BufferIO也叫Normal IO. 1. 缓存IO 缓存I/O又被称作标准I/O,大多数文件系统的默认I/O操作都是缓存I/O.在Linu ...

  3. 进程间通信系列 之 命名管道FIFO及其应用实例

    进程间通信系列 之 概述与对比   http://blog.csdn.net/younger_china/article/details/15808685  进程间通信系列 之 共享内存及其实例   ...

  4. CSS中的字体设置

    五大类:serif, sans-serif, monospace, cursive, fantasy serif 衬线字体,如 Big Caslon, 宋体 sans-serif 非衬线字体,如 He ...

  5. windows10 配置 华为vpn客户端

    2017-05-08 1. 安装客户端软件VPNClient_V100R001C02SPC703.exe 2. 新建vpn 安装完成后,打开客户端连接vpn,发现未启用虚拟网卡(这是因为还需要安装客户 ...

  6. MarkDown本地图片上传工具制作总结

    引言:开始尝试使用MarkDown语法写文档,发现图片必须用外链的形式才能插入到文章中,而自己平时最常用的插入图片方式就是QQ截屏,觉得很不方便所以制作的小工具辅助上传,因为时间和水平有限,其实代码写 ...

  7. [大数据]-Elasticsearch5.3.1+Kibana5.3.1从单机到分布式的安装与使用<1>

    一.Elasticsearch,Kibana简介: Elasticsearch是一个基于Apache Lucene(TM)的开源搜索引擎.无论在开源还是专有领域, Lucene可以被认为是迄今为止最先 ...

  8. 网际报文控制协议ICMP

    为了更有效地转发IP数据报和提高交付成功的机会,在网际层使用了网际控制报文协议ICMP.ICMP允许主机或路由器报告差错情况和提供有关异常情况的报告.ICMP是因特网的标准协议.但ICMP不是高层协议 ...

  9. 区块链入门(2):搭建以太坊私有链(private network of ethereum),以及挖矿的操作..

    在做一些测试工作的时候, 为了方便控制以及更快的进入真正的测试工作,可能需要搭建一个私有的以太坊网络. 而以太坊节点之间能够互相链接需要满足1)相同的协议版本2)相同的networkid,所以搭建私有 ...

  10. js:不是空字符串的空字符串引起的bug

    今天在用js的时候,使用了两段完全相同的代码,可是一个报错,一个好好的 代码如下: <script type="text/javascript">    console ...