css基本内容笔记(学习整理)
一.css简介
1.什么是css
层叠样式表。
层叠:层层叠加,若果有冲突应用优先级高,不冲突的部分共同作用
样式表:就是css属性样式的集合;
2.作用
a.修饰html,使得html样式更好看
b.提高样式代码的复用性
c.html的内容与样式分离,便于后期维护
3.css的引入方式
1.内嵌样式
把css代码嵌入到html标签中
style=" 属性 :属性值 ; 属性:属性值"
语法:
1.使用style属性;
2.属性写法:属性:属性值;
3.多个样式使用”;“分开;
2.内部样式
<style type="text/css">
div{color:red; font-size:100px;}
</style>
语法:
1.使用style标签属性进行引入;
2.属性写法:属性:属性值;
3.多个样式使用”;“分开;
3.外部样式----推荐使用
将css样式抽成一个单独的css文件,谁用就引用这个文件;
<link rel="stylesheet" style="text/css" href=" css文件地址">
语法:
1.创建css文件写入css属性,
2.在head中使用link标签属性进行引入;
3.属性写法:属性:属性值;
4.多个样式使用”;“分开;
二.选择器
1.基本选择器(优先级 类选择器>Id选择器>标签选择器)
a.标签选择器
语法:html标签名{ css 属性}
b.类选择器
.+class名
class的值可以重复
c.id选择器
#+id名
id只有唯一性,不能重复
2.属性选择器
语法:基本选择器[ 属性="属性值"]{css 属性:属性值; }
3.伪元素选择器
a标签的伪元素选择器
静止状态 :a:link{css属性}
悬浮状态:a hover{css属性}
触发状态: a:active{css属性}
完成状态 a:visited{css属性}
4.层级选择器
按照层级进行选择
三.css属性
1.文字属性:
span{color:red;font-size:100px;font-family:黑体}
font-size:大小;
font-family:字体类型
font-weight:bold;加粗
2.文本属性:
color:颜色
text-decoration:下划线(a标签可以去掉下划线)
属性值:none;underline;
text-agin:对齐方式
属性:left; center; right;
line-high:字体之间的行高
3.背景属性:
">background-image:背景图片
属性:
url("图片地址")
background-repeat:平铺方式
属性: no-repeat;不重复 repeat-x;横向重复
repeat-y; 纵向重复repeat;横纵向平铺
4.列表属性:
list-style-type:列表项前的小标志
属性:太多了,可以查字典
list-style-image:列表项前的小图片;
属性:url("图片地址");
5.尺寸属性:
width:宽度
height:高度
6.显示属性:
display:
属性:none 隐藏
block 块级别显示
inline 行级别显示(行级变成块级别)
7.浮动属性:
float:浮动
属性值:left right
clear:清楚浮动 left right both
技巧:在一个浮动的div之后,添加一个div来清除浮动
四.盒子模型
略
css基本内容笔记(学习整理)的更多相关文章
- HTML+CSS基础小笔记再整理
1. font的两个必须要写的:font-size 和 font-family text-indent 首行缩进(em)1em=一个文字大小 text-algin 对齐方式:left.center.r ...
- CSS进阶内容—盒子和阴影详解
CSS进阶内容 在学习了CSS基本知识之后,我们需要进一步了解CSS,因此写下了这篇文章 当然如果没有学习之前的知识,可以到我的主页中查看之前的文章:秋落雨微凉 - 博客园 CSS三大特性 首先我们先 ...
- iOS学习笔记-精华整理
iOS学习笔记总结整理 一.内存管理情况 1- autorelease,当用户的代码在持续运行时,自动释放池是不会被销毁的,这段时间内用户可以安全地使用自动释放的对象.当用户的代码运行告一段 落,开始 ...
- iOS学习笔记总结整理
来源:http://mobile.51cto.com/iphone-386851_all.htm 学习IOS开发这对于一个初学者来说,是一件非常挠头的事情.其实学习IOS开发无外乎平时的积累与总结.下 ...
- java学习笔记系列整理说明
java学习笔记系列整理说明 陆陆续续也巩固学习java基础也有一段时间了,这里整理了一些我认为比较的重要的知识点,供自己或者读者以后回顾和学习.这是一个学习笔记系列,有自己的整理重新撰写的部分, ...
- HttpClient学习整理
HttpClient简介HttpClient 功能介绍 1. 读取网页(HTTP/HTTPS)内容 2.使用POST方式提交数据(httpClient3) 3. 处理页面重定向 ...
- 《CSS揭秘》笔记(一)
前言 我们在现代 CSS 中所面临的挑战已经不在于如何绕过这些转瞬即逝的浏览器 bug.如今的挑战是,在保证 DRY ① .可维护.灵活性.轻量级并且尽可能符合标准的前提下,把我们手中的这些CSS特性 ...
- 《AngularJS学习整理》系列分享专栏
<AngularJS学习整理>系列分享专栏 <AngularJS学习整理>已整理成PDF文档,点击可直接下载至本地查阅https://www.webfalse.com/re ...
- JavaScript学习整理(转载)
JavaScript的学习整理(一) 目录: 1.换皮肤功能2.显示/隐藏(点击切换)3.显示/隐藏(onmouseover/onmouseout)4.选项卡5.全选/不选/反选(checkbox)6 ...
随机推荐
- Pytorch_Part2_数据模块
VisualPytorch beta发布了! 功能概述:通过可视化拖拽网络层方式搭建模型,可选择不同数据集.损失函数.优化器生成可运行pytorch代码 扩展功能:1. 模型搭建支持模块的嵌套:2. ...
- 用JIRA管理你的项目——(三)基于LDAP用户管理
JIRA提供了基于LDAP方式的用户管理,也就是用户密码的管理交给LDAP,而JIRA只管理用户在系统中的角色. 要打开JIRA的LDAP设置,首先需要验证下你的LDAP服务是否正常! 几乎有所有的L ...
- 二进制部署K8S-2集群部署
二进制部署K8S-2集群部署 感谢老男孩教育王导的公开视频,文档整理自https://www.yuque.com/duduniao/k8s. 因为在后期运行容器需要有大量的物理硬件资源使用的环境是用的 ...
- python实现UDP通讯
Environment Client:Windows Server:KaLi Linux(VM_virtul) Network:Same LAN Client UDPClient.py #-*- co ...
- Hutool :一个小而全的 Java 工具类库
Hutool 简介 Hutool 是一个小而全的 Java 工具类库,通过静态方法封装,降低相关API的学习成本,提高工作效率,使Java拥有函数式语言般的优雅,让Java语言也可以"甜甜的 ...
- LTC4020
今天凯哥说他之前有一块电池放电低于20V了 然后接上4020后 会先浮充 涓流充 大约200ma 充过了20V后又是4A了
- sklearn中,数据集划分函数 StratifiedShuffleSplit.split() 使用踩坑
在SKLearn中,StratifiedShuffleSplit 类实现了对数据集进行洗牌.分割的功能.但在今晚的实际使用中,发现该类及其方法split()仅能够对二分类样本有效. 一个简单的例子如下 ...
- 阿里云RDs 网络白名单 专用网络 经典网络
云服务为了安全性总是有不同的安全规则,第一就是需要明白里面的网络类型 专有网络是您自己独有的云上私有网络.您可以完全掌控自己的专有网络,例如选择IP地址范围.配置路由表和网关等,您可以在自己定义的 ...
- SQLZOO
一.SELECT basics/zh 以顯示德國 Germany 的人口. select population from world where name = 'Germany'; 查詢面積為 5,0 ...
- unity中使用Highlighting System v4.0插件给物体添加高亮
插件:Highlighting System v4.0 操作:在摄像机上挂上HighlightingRenderer脚本 脚本目录在\Assets\Plugins\HighlightingSystem ...