前端基础 之css
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的更多相关文章
- 前端基础：CSS样式选择器
前端基础:CSS样式选择器 CSS概述 CSS是Cascading Style Sheets的简称,中文意思是:层叠样式表,对html标签的渲染和布局.CSS规则由两个主要的部分组成:1.选择器:2. ...
- 前端第二篇---前端基础之CSS
前端第二篇---前端基础之CSS 目录 一.css介绍 二.css语法 三.css的几种引入方式 四.css选择器 五.css属性相关 六.盒子模型 拓展 一.css介绍 CSS(Cascading ...
- 02 前端基础之CSS
目录 前端基础之CSS css简介 基本选择器(重要) 组合选择器(重点) 属性选择器 分组与嵌套 伪类选择器 伪元素选择器 选择器的优先级 字体相关 背景属性 边框属性 display属性 盒子模型 ...
- Web前端基础(4):CSS(一)
1. CSS介绍 现在的互联网前端分三层: HTML:超文本标记语言.从语义的角度描述页面结构. CSS:层叠样式表.从审美的角度负责页面样式. JS:JavaScript .从交互的角度描述页面行为 ...
- 2020年12月-第01阶段-前端基础-HTML CSS 项目阶段(一)
品优购项目(一) 目标: 能会引入ico图标 能简单看懂网站优化的三大标签 能使用字体图标 ( 重点 ) 能说出我们css属性书写顺序 1. 品优购项目介绍 项目名称:品优购 项目描述:品优购是一个电 ...
- 前端基础之css样式（选择器）
一.css概述 CSS是Cascading Style Sheets的简称,中文称为层叠样式表,对html标签的渲染和布局 CSS 规则由两个主要的部分构成:选择器,以及一条或多条声明. 例如 二.c ...
- 前端基础之---css
css 介绍 css 规则有两个主要的部分构成 : 选择器 , 以及一条或多条声明. 现在的互联网前端分为三层 : ● HTML :超文本标签机语言,从语义的角度描述页面结构. ● CSS : 层 ...
- Web前端基础(5):CSS(二)
1. 盒模型 在CSS中,"box model"这一术语是用来设计和布局时使用,然后在网页中基本上都会显示一些方方正正的盒子.我们称为这种盒子叫盒模型. 盒模型有两种:标准模型和I ...
- 2021年3月-第02阶段-前端基础-HTML+CSS阶段-Day02
HTML5 第二天 一.rotate 2d旋转指的是让元素在2维平面内顺时针旋转或者逆时针旋转 使用步骤: 给元素添加转换属性 transform 属性值为 rotate(角度) 如 transfor ...
- 前端基础系列——CSS规范（文章内容为转载）
原作者信息 作者:词晖 链接:http://www.zhihu.com/question/19586885/answer/48933504 来源:知乎 著作权归原作者所有,转载请联系原作者获得授权. ...
随机推荐
- android自己定义渐变进度条
项目中须要用到一个弧形渐变的进度条,通过android自带是不能实现的.我是没有找到实现的方法,有大神知道的能够指点.效果图是以下这种 这是通过继承VIew来绘制出来的,网上也有相似的,可是代码那是相 ...
- python--简易员工信息系统编写
补充内容:eval 将字符串变成变量名locals 看输入的是否是字典中的一个keyfunc.__name____怎么看变量名的数据类型斐波那契数列 li=[1,1] while li[-1]&l ...
- java IO 框架图
- iOS UI13_数据解析XML_,JSON
- (IBAction)parserButton:(id)sender { parserXML *parser =[[parserXML alloc] init]; [parser startPars ...
- 《AndroidStudio有用指南》反馈问题和建议
<AndroidStudio有用指南>反馈问题和建议 IntelliJ IDEA在持续更新, Android Studio也在持续更新, 本书也将会持续更新. Android Studio ...
- 计算机鼻祖-Donald Knuth（高纳德） 的传奇
李开复说,练内功,不要仅仅花功夫学习各种流行的编程语言和工具,以及一些公司招聘广告上要求的科目.要把数据结构.算法.数据库.操作系统原理.计算机体系结构.计算机网络,离散数学等基础课程学好.最好还是试 ...
- javascript和c#的深度拷贝的一种通用方法
很简单,序列化后反序列化...
- 一个兼容性比较好的图片左右滚动的js
下载地址:http://www.cnblogs.com/RightDear/admin/Files.aspx 文件:shhds.rar
- mysql-connector-java与mysql版本的对应
记录下mysql-connector-java与mysql版本的对应关系,已方便以后参考,这是最新版本对应, 时间:2017年5月23日 官网文档地址: https://dev.mysql.com/d ...
- asp.net c# select 动态加载数据
1.说明通过 asp.net,利用jQuery ,c#语言给 select控件动态加载数据.前端页面使用的是.aspx类型的HTML页面,后台使用MVC上的controller控制器 2.webcon ...