css 介绍

css(层叠样式表)定义如何显示html 元素

当浏览器读到一个样式表, 他就会按照这个表对文档进行格式化(渲染)

css语法

css实例

css 注释

注释是代码之母

/* 这是注释*/

css的几种引入方式

行内样式

行内式 是标记的的style属性中设定的css样式。不推荐大规模使用。

<p style ="color :red">

内部样式

嵌入式是将css样式集中卸载网页的<head></head>标签对的<style></sty

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
p{
background-color:#f5f5f5;
}
</style>
</head>
<body>
<p> 大鑫鑫是姑姑的大宝贝</p>
</body>
</html>

外部样式

外部样式就是将css写在一个单独的文件中, 然后在页面进行引入即可,推荐使用此方式

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

css选择器

基本选择器

元素选择器

 p{color: :"red";}

id选择器

#i1{background-color:red;}

类选择器

.c1{fon-size:14px;
}
p.c1{color:red;
}

注意:

样式类名不要用数字开头,(有的浏览器不认)

标签中的class属性如果有多个要用空格分隔。

通用选择器

前端基础 之css的更多相关文章

  1. 前端基础:CSS样式选择器

    前端基础:CSS样式选择器 CSS概述 CSS是Cascading Style Sheets的简称,中文意思是:层叠样式表,对html标签的渲染和布局.CSS规则由两个主要的部分组成:1.选择器:2. ...

  2. 前端第二篇---前端基础之CSS

    前端第二篇---前端基础之CSS 目录 一.css介绍 二.css语法 三.css的几种引入方式 四.css选择器 五.css属性相关 六.盒子模型 拓展 一.css介绍 CSS(Cascading  ...

  3. 02 前端基础之CSS

    目录 前端基础之CSS css简介 基本选择器(重要) 组合选择器(重点) 属性选择器 分组与嵌套 伪类选择器 伪元素选择器 选择器的优先级 字体相关 背景属性 边框属性 display属性 盒子模型 ...

  4. Web前端基础(4):CSS(一)

    1. CSS介绍 现在的互联网前端分三层: HTML:超文本标记语言.从语义的角度描述页面结构. CSS:层叠样式表.从审美的角度负责页面样式. JS:JavaScript .从交互的角度描述页面行为 ...

  5. 2020年12月-第01阶段-前端基础-HTML CSS 项目阶段(一)

    品优购项目(一) 目标: 能会引入ico图标 能简单看懂网站优化的三大标签 能使用字体图标 ( 重点 ) 能说出我们css属性书写顺序 1. 品优购项目介绍 项目名称:品优购 项目描述:品优购是一个电 ...

  6. 前端基础之css样式(选择器)

    一.css概述 CSS是Cascading Style Sheets的简称,中文称为层叠样式表,对html标签的渲染和布局 CSS 规则由两个主要的部分构成:选择器,以及一条或多条声明. 例如 二.c ...

  7. 前端基础之---css

    css  介绍 css 规则有两个主要的部分构成 : 选择器  , 以及一条或多条声明. 现在的互联网前端分为三层 : ● HTML :超文本标签机语言,从语义的角度描述页面结构. ● CSS : 层 ...

  8. Web前端基础(5):CSS(二)

    1. 盒模型 在CSS中,"box model"这一术语是用来设计和布局时使用,然后在网页中基本上都会显示一些方方正正的盒子.我们称为这种盒子叫盒模型. 盒模型有两种:标准模型和I ...

  9. 2021年3月-第02阶段-前端基础-HTML+CSS阶段-Day02

    HTML5 第二天 一.rotate 2d旋转指的是让元素在2维平面内顺时针旋转或者逆时针旋转 使用步骤: 给元素添加转换属性 transform 属性值为 rotate(角度) 如 transfor ...

  10. 前端基础系列——CSS规范(文章内容为转载)

    原作者信息 作者:词晖 链接:http://www.zhihu.com/question/19586885/answer/48933504 来源:知乎 著作权归原作者所有,转载请联系原作者获得授权. ...

随机推荐

  1. hdu 2842(矩阵高速幂+递推)

    题意:一个中国环的游戏,规则是一个木棒上有n个环.第一个环是能够任意放上或拆下的,剩下的环x假设想放上或拆下必须前一个环x-1是放上的且前x-2个环所有是拆下的,问n个环最少多少次操作能够所有拆掉. ...

  2. Django-select_related优化查询

    对于一对一字段(OneToOneField)和外键字段(ForeignKey),可以使用select_related 来对QuerySet进行优化. select_related 返回一个QueryS ...

  3. 虚拟化(四):vsphere高可用功能前提-共享存储搭建(使用微软提供的iscsi software target,也可以使用免费开源的openfiler)

    虚拟化(一):虚拟化及vmware产品介绍 虚拟化(二):虚拟化及vmware workstation产品使用 虚拟化(三):vsphere套件的安装注意及使用 虚拟化(四):vsphere高可用功能 ...

  4. FireMonkey下的WndProc实现

    unit Unit1; interface uses Winapi.Windows, Winapi.Messages, System.SysUtils, System.Types, System.UI ...

  5. DIV+CSS常见问题的14条原因分析

    当你在一个浏览器里面做好,在其他浏览器里面却完全不是那么回事情.  很多时候,我们就只是去修补下,或者利用各个浏览器对代码支持的不一致,进行针对各个浏览器进行不同的定义.  其实浏览器的不兼容,我们往 ...

  6. 录音-树莓派USB摄像头话筒

    实测可用: sudo arecord --duration=10 --device=plughw:1,0 --format=cd aaa.wav sudo arecord --duration=10 ...

  7. Oracle rac 配置Weblogic数据源时 实例名及URL的选择

    Oracle 10G 是 RAC 的,即有两个节点.两个节点 IP及实例名分别为:10.1.43.11 stnic110.1.43.21 stnic2配置数据源时 一直使用的是第一个 URL 及 实例 ...

  8. GIN+GORILLA=A GOLANG WEBSOCKET SERVER

    鉴于聊天已然成为大部分app的基础功能,而大部分app用户基数有没有辣么大,常用的聊天server架构如xmpp或者消息队列实现之类的用起来还挺麻烦的,有比较难跟网页端做交互,加之H5标准落地,所以w ...

  9. Ubuntu下安装Android studio【转】

    本文转载自:http://blog.csdn.net/walleit/article/details/65696712 版权声明:本文为博主原创文章,未经博主允许不得转载. 一,软件准备 1. Lin ...

  10. Codeforces Round #373 (Div. 2) C. Efim and Strange Grade —— 贪心 + 字符串处理

    题目链接:http://codeforces.com/problemset/problem/719/C C. Efim and Strange Grade time limit per test 1 ...