CSS回顾(基础知识,元素,选择器,盒子,颜色)
元素分类:
1.行级元素:内联元素 inline
特征:内容决定元素所占位置,不可以通过CSS改变宽高
span strong em a del
2.块级元素:block特征:独占一行,可以通过CSS改变宽高
div p ul li ol form address
3.行级块元素:inline-block
特征:内容决定大小,可以改变宽高
选择器类型(通用的,没写那些伪类):
父子选择器(派生选择器)
<div>
<em></em>
</div>
div em {margin:0px} 有父子关系的几个元素组成的选择器,div下的所有em子孙
直接子元素选择器
div>em { margin:0 } 表示的是div下的直接子元素
并列选择器
<div class='red'></div>
div.red{ color:green } 表示并列关系
权重值比较:<style='color=red' ...>内联样式,1000
id :100 class:10 标签:1 *:0 ,!important是无穷大权重,但是如果!important+1则要更大
分组选择器
.demo{} .red{}
!!解决图片间隔 margin-left:-6px
盒子组成部分:
盒子壁 border
内边距 padding
盒子内容 width+weigth
margin+border+padding+content
颜色:
1.纯英文单词 red,green
2.颜色代码 #00ff22
3.颜色函数 rgb(00,ff ,ff)
rgb()表示光的三原色,red, green ,blue
CSS回顾(基础知识,元素,选择器,盒子,颜色)的更多相关文章
- HTML&CSS基础-伪元素选择器
HTML&CSS基础-伪元素选择器 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.html源代码 <!DOCTYPE html> <html> ...
- CSS样式基础知识
CSS样式基础知识 CSS样式概述 CSS是Cascading Style Sheet 的缩写.译作“层叠样式表单”.是用于(增强)控制网页样式并允许将样式信息与网页内容分离的一种标记性语言. 引用位 ...
- HTML+CSS+JS基础知识
HTML+CSS+JS基础知识 目录 对HTML+CSS+JS的理解 基础知识 对HTML+CSS+JS的理解 基础知识 插入样式表的三种方式 外部样式表:<link rel="sty ...
- weex中css不能使用子元素选择器
weex中css不能使用子元素选择器 刚入手可能会有错误,有误导地方请谅解,不过都是亲身踩坑
- CSS3 01. CSS3现状、属性选择器、伪类选择器、结构伪类、伪元素选择器、颜色、文本阴影shadow、盒子模型、私有化前缀
CSS 3 现状 兼容性差,需添加私有前缀/移动端优于PC端/不断改进中/渐进增强原则/考虑用户群体/遵照产品的方案 : CSS3手册 需要阅读其--阅读及使用指引 []表示全部的可选项 || 或者 ...
- 前端三件套 HTML+CSS+JS基础知识内容笔记
HTML基础 目录 HTML基础 HTML5标签 doctype 标签 html标签 head标签 meta标签 title标签 body标签 文本和超链接标签 标题标签 段落标签 换行标签 水平标签 ...
- css 3d 基础知识
css3d 总结 3d transform (3D变形)(rotate skew scale translate) 基础知识 perspective (视距,景深) perspective-origi ...
- CSS中的伪元素选择器
定义 伪元素选择器:就是有连续两个冒号的选择器,如::first-line::first- letter.::before 和::after E::first-letter文本的第一个单词或字(如中文 ...
- web前端学习(三)css学习笔记部分(1)-- css入门基础知识+基本样式
1.介绍及语法 1.1CSS概述: CSS指层叠样式表 CSS样式表极大地提高了工作效率 如果值大于一个单词,需要加上引号(意思是值只有一个的时候可以不加引号) 1.2CSS高级语法 1.选择器分组 ...
- CSS中模拟父元素选择器
很多情况下,我们需要找到父元素,但可惜的是css中并没有这样的一个选择器. 至于原因可以看张鑫旭的如何在CSS中实现父选择器效果这篇文章. 简单来说这个实现并不是真正的父元素选择器,只是利用其它思路来 ...
随机推荐
- ionic cordova platform add android Cordova failed to install plugin Error: ENOENT: no such file or directory AndroidManifest.xml
问题描述: 在ionic 项目中出现编译android 的时候 出现 Cordova failed to install plugin Error: ENOENT: no such file or ...
- sql server 性能调优之 资源等待 CXPACKET
一.概述 CXPACKET是指:线程正在等待彼此完成并行处理.什么意思呢? 当sql server发现一条指令复杂时,会决定用多个线程并行来执行,由于某些并行线程已完成工作,在等待其它并行线程来同步 ...
- [Maven]Maven如何得到单独的单元测试报告
----------------------------------------------------------------- 原创博文,如需转载请通知作者并注明出处! 博主:疲惫的豆豆 链接:h ...
- java字符流操作flush()方法及其注意事项
java字符流操作flush()方法及其注意事项 flush()方法介绍 查阅文档可以发现,IO流中每一个类都实现了Closeable接口,它们进行资源操作之后都需要执行close()方法将流关闭 ...
- 编写高质量代码改善java程序的151个建议——[1-3]基础?亦是基础
原创地址: http://www.cnblogs.com/Alandre/ (泥沙砖瓦浆木匠),需要转载的,保留下! Thanks The reasonable man adapts himse ...
- 【个人杂谈】MacBook Pro的使用心得
上个月刚买的MacBook Pro,苹果就发新版了.... 从apple香港官网入手了一台MacBook Pro,带到公司,用了差不多一个月吧,这里讲讲我对MacBook的看法吧. 先声明一下两点: ...
- 【转载】ucos临界段
其实很简单: 临界段就是不可中断的程序段,比如从UART中读取当前传递回来的值,如果有UART中断,此时这个值又会改变.同样临界段就是保护这类全局变量,如在读取时间节拍时,不应该被时钟更新时钟 ...
- Perl流程控制语句
布尔值判断 如果是数字,0表示假,其它所有数字都是真. 如果是字符串,空字符串('')为假,其它所有字符串为真(有例外,见下一条). 如果是字符串'0',perl是当作数值0来处理的,所以这是唯一的非 ...
- ARM 处理器寻址方式之间接寻址的几种表达
我们以 LDR 指令为例来分别举例分析. LDR 指令的格式为: LDR{条件} 目的寄存器,<存储器地址> LDR 指令是字加载指令,用于从存储器中将一个 32 位的字数据送到目的寄存器 ...
- [转]使用Git Submodule管理子模块
本文转自:https://blog.csdn.net/qq_37788558/article/details/78668345 实例代码: 父项目:https://github.com/jjz/pod ...