CSS的两大重点
一、属性:通过属性的复杂叠加才能做出漂亮的网页
二、选择器:通过选择器找到对应的标签设置样式,选择器的作用是:选择对应的标签,为之添加样式
1》标签选择器:根据标签签名找到标签
div{
color: red;
}
2》类选择器:
.one{
color: yellow;
}
3》id选择器:
#main{
font-size: 40px;
}
4》并列选择器:
div,.one{
color: yellow;
}
5》复合选择器:
div.one{
color: blue;
}
6》后代选择器:
div p {
color: green;
}
7》直接后代选择器:
div>p {
color: green;
}
8》相邻兄弟选择器:
div+p {
color: red;
}
9》属性选择器:
div[name]{
color: red;
}
div[name=“jack”]{
color: red;
}
10》伪类:
:active 向被激活的元素添加样式
:focus 向拥有键盘输入焦点的元素添加样式
:hover 当鼠标悬浮在元素上方时,向元素添加样式
:link 向未被访问的链接添加样式
:visited 向已被访问的链接添加样式
:first-child 向元素的第一个子元素添加样式
:lang 向带有指定lang属性的元素添加样式
11》伪元素:
:first-letter 向文本的第一个字母添加特殊样式
:first-line 向文本的首行添加特殊样式
:before 在元素之前添加内容
:after 在元素之后添加内容
CSS的两大重点的更多相关文章
- css 两大特性:继承性和层叠性
css 有两大特性: 继承性和层叠性, 继承性 面向对象语言都会存在继承的概念,在面向对象的语言中,继承的特点:继承了父类的属性和方法.那么我们现在主要研究css,css中没有方法,所以我们仅仅继承属 ...
- HTML+css基础 css的几种形式 css选择器的两大特性
3.外联样式 css选择器的两大特性 1.继承性:所有跟文本字体有关的属性都会被子元素继承.且权重是0000. 2.层叠性:就是解决选择器权重大小的一种能力,就是看那个选择器的权重大.谁的权重大听谁的 ...
- CSS的选择器分为两大类
CSS的选择器分为两大类:基本选择题和扩展选择器. 基本选择器: 标签选择器:针对一类标签 ID选择器:针对某一个特定的标签使用 类选择器:针对你想要的所有标签使用 通用选择器(通配符):针对所有的标 ...
- 第213天:12个HTML和CSS必须知道的重点难点问题
12个HTML和CSS必须知道的重点难点问题 这12个问题,基本上就是HTML和CSS基础中的重点个难点了,也是必须要弄清楚的基本问题,其中定位的绝对定位和相对定位到底相对什么定位?这个还是容易被忽视 ...
- 12个HTML和CSS必须知道的重点难点问题
这12个问题,基本上就是HTML和CSS基础中的重点个难点了,也是必须要弄清楚的基本问题,其中定位的绝对定位和相对定位到底相对什么定位?这个还是容易被忽视的,浮动也是一个大坑,有很多细节.这12个知识 ...
- 10个HTML和CSS必须知道的重点难点问题
前端日刊 登录 10个HTML和CSS必须知道的重点难点问题 2018-02-26 阅读 2982 收藏 6 原链:segmentfault.com 分享到: 前端必备图书<深入浅出Node ...
- webpack 教程 那些事儿03-webpack两大精华插件,热加载
本节主要讲述 webpack的两大经典开发调试插件,热插拔内存缓存机制 文章目录 1. html-webpack-plugin插件的使用 2. webpack-dev-middleware 插件登场 ...
- JQuery获取元素宽度.width()与.css(‘width’)两个函数的区别
整理翻译自:http://blog.jquery.com/2012/08/16/jquery-1-8-box-sizing-width-csswidth-and-outerwidth/ 大意是: 在J ...
- [转帖] 中国SaaS死或生之二: ERP两大邪术,尽出歪门邪路 ---- 挺好玩的
中国SaaS死或生之二: ERP两大邪术,尽出歪门邪路 http://www.cniteyes.com/archives/33753 文章摘要:在数字化浪潮中,油腻ERP大叔的那些“歪门邪术” ...
随机推荐
- android 学习第一天 了解事件机制,页面跳转等常用操作
点击时间2种 第一种,通过初始化页面 写入点击事件 protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedI ...
- mongodb高级查询
前几篇,老玩家绕道即可,新手晚上闲着也是蛋疼,不如把命令敲一边,这样你就会对MongoDB有一定的掌握啦.如果没有安装MongoDB去看我的上一篇博客 MongoDB下载安装与简单增删改查 前奏:启 ...
- php 获取远程图片保存到本地
php 获取远程图片保存到本地 使用两个函数 1.获取远程文件 2.把图片保存到本地 /** * 获取远程图片并把它保存到本地 * $url 是远程图片的完整URL地址,不能为空. */ functi ...
- 搞定迅雷固件在TP-LINK WR720N,127.0.0.1 9000 获取不到激活码
本帖最后由 exzzzipad 于 2014-7-2 22:33 编辑 基本情况:设备:TP-LINK WR720N目前固件:[antclan][20120825]720N-4M-NAS-withSA ...
- sql里面的分页
SELECT TOP 5 * FROM hos_house WHERE HMID NOT IN( SELECT TOP 5 HMID FROM hos_house WHERE PRICE>250 ...
- ajaxpro返回值类型总结-DataTable(转)
ajaxpro使用总结系列其他内容 ajaxpro ajaxmethod 重载调用问题 ajaxpro方法ajaxmethod调用示例 ajaxpro返回值类型总结-string,int ajaxpr ...
- unity 读取文本与写入文本
void writeData(string str,string file) { string parth = Application.dataPath; Strea ...
- Python-7 列表list
#1 创建列表.向列表中添加元素 1) 列表名称.append(*) 2) 列表名称.extend([*,*,...]) 3) 列表名称.insert(位置,*) member = ['小甲鱼','小 ...
- sqlldr
1.字符集 sqlldr可以指定读取的文件的字符集,如果数据库为gbk,读取的文件为utf-8,这个时候就需要指定字符集 load data CHARACTERSET 'UTF8' 2.sqlldr导 ...
- PCI Express(五) - Xilinx wizard
原文地址:http://www.fpga4fun.com/PCI-Express5.html Xilinx makes using PCI express easy - they provide a ...