Div的几种选择器
Div 是一个html标签,一个块级元素(单独显示一行),单独使用没有意义,需要结合CSS来使用,主要用于页面的布局。
div选择器:
1.元素选择器:
1 <style>
2 div{
3 font-size: 5px;
4 color: red;
5 }
6 </style>
7 <body>
8 <div >
9 你停在了那条我们熟悉的街。
10 </div>
11 </body>
2.类选择器:
1 <style>
2 .div2{
3 font-size: 5px;
4 color: red;
5 }
6 </style>
7 <body>
8 <div class="div2">
9 你停在了那条我们熟悉的街。
10 </div>
11 </body>
3.id选择器:
1 <style>
2 #div3{
3 font-size: 5px;
4 color: red;
5 }
6 </style>
7 <body>
8 <div id="div3">
9 你停在了那条我们熟悉的街。
10 </div>
11 </body>
4.层级选择器
1 <style>
2 div font{
font-size: 40px;
color:brown;
}
6 </style>
7 <body>
8 <div>
把你准备好的台词全念一遍。
<font> 爱你到最后 不痛不痒</font>
</div>
11 </body>
5.属性选择器:
1 <style>
2 input[type = 'text']{
font-size: 40;
color: yellow;
}
6 </style>
7 <body>
8 <div>
我们的爱 <input type="text" name="password" />
</div>
11 </body>
6.行内引入:
1 <div style="color: orange; font-size:20px ;">
2 怪我没能力跟随。
3 </div>
7.外部引入
style1.css文件中
div{
font-size: 5px;
color: red;
} 利用link导入:
<html>
<head>
<meta charset="UTF-8">
<title> div选择器</title>
<link rel="stylesheet" href="style1.css" type="text/css"/>
</head>
<body>
<div>
你还要我怎样
</div>
</body>
</html>
Div 浮动特性
left:左侧不允许浮动元素
right:右侧侧不允许浮动元素
both 两侧都不允许浮动元素
none 默认值 两侧都允许浮动元素
inherit 从父元素继承clear属性值。
添加浮动 用float,清除浮动用clear。
Div的几种选择器的更多相关文章
- CSS3常用30种选择器总结
CSS3常用30种选择器总结 HTML5/CSS3时尚的圆盘时钟动画 带当前日期 www.html5tricks.com/demo/html5-css3-clock-with-date/index.h ...
- CSS 常见的8种选择器 和 文本溢出问题
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>c ...
- 不可不看!CSS3中三十一种选择器用法
原文 The 30 CSS Selectors you Must Memorize 由 Jeffrey Way 发表于 2012 年 6 月,介绍了 30 种最常用的 CSS 选择器用法,多加了一种, ...
- jQuery的12种选择器
jQuery的12种选择器 1.#id : 根据给定的ID匹配一个元素 显示(用加粗的代替颜色): 这是第一个p标签 2.* : 匹配所有元素,多用于结合上下文来搜索 显示 : 这是p标签 这是di ...
- jQuery的61种选择器
The Write Less , Do More ! jQuery选择器 1. #id : 根据给定的ID匹配一个元素 <p id="myId">这是第一个p标签< ...
- 理解CSS中的三种选择器>+~
1. p~ul p和ul有相同的父元素,选择出p元素之后的所有ul元素,其中,p和ul不一定是紧随,但是必须有相同的父元素 E+F 相邻兄弟选择器.选择匹配F的元素,且该元素位于 ...
- 汇总jQuery的61种选择器及示例
汇总jQuery的61种选择器及示例 恋痿喃 ㄍń稀广 因罘乐睽 ú燔蒇 骤幄觳 ч豹 齑骝氮铷 宅廓Ω孓 锏遒 荛猩ㄜ彬 芡钷ж ┊贩错鹌 掩饰着可还是几步就窜到了门口看着这个让她 ...
- CSS的几种选择器
选择器 目录 选择器 基础选择器 标签选择器 类选择器 id选择器 通配符选择器 复合选择器 后代选择器 子选择器 并集选择器 伪类选择器 基础选择器 标签选择器 标签选择器可以把一类标签全部选择出来 ...
- 最新CSS3常用30种选择器总结(适合初学者)
1. *:通用元素选择器 * { margin: 0; padding: 0; } *选择器是选择页面上的全部元素,上面的代码作用是把全部元素的margin和padding设为0,最基本的清除默认C ...
- css四种选择器总结
css 在网页开发中扮演着重要的角色,被誉为网页开发的三剑客,如果说html是人的外在器官部分,那css无疑是各个器官组成在一起然后表现出来,css又称样式重叠在网页排版布局中的地位举足轻重. 做 ...
随机推荐
- SAP 删除始终使用选定的格式
修改默认格式 se38 SALV_BS_ADMIN_MAINTAIN
- EMQ X 系统调优和性能压测
前言 如果使用 EMQ 来承载百万级别的用户连接可以吗?毕竟在 MQTT 官方介绍上说 EMQ X 可以处理千万并发客户端,而 EMQ X 自己官方称 4.x 版本 MQTT 连接压力测试一台 8 核 ...
- curl命令查用操作
curl -o /dev/null -s -w "http_code: %{http_code} http_connect:%{http_connect} content_type:%{co ...
- TypeError: 'int' object is not subscriptable 报错
Python中报错TypeError: 'int' object is not subscriptable 原因:整形数据中加了下标索引 例如 #python utf-8 a = 10 b = a[0 ...
- vue、iview、VeeValidate 表单验证完整
1.main.js (1).安装vee-validate npm install vee-validate --save (2).安装vue-i18n npm install vue-i18n --s ...
- csdn 复制
$("#content_views pre").css("user-select","text"); $("#content_vi ...
- VirtualBox + Parrot
安装环境:win8 1.官网下载virtualbox安装包,parrot kde sequrity镜像文件 2.用virtualbox创建新的虚拟机,内存4g,类型是linux debian 64,硬 ...
- Vue.js的使用经验
Vue.js的使用经验 Vue.js的意义 解耦了视图与数据 可复用的组件 前端路由 状态管理 虚拟DOM Vue提供了很多实例属性与方法,都以$开头 $el可以访问挂载Vue实例的元素. $se ...
- windows server 2012以上版本离线安装 net framework3.5 方法
方法1. 通过服务管理器安装操作系统原镜像文件 准备windows系统镜像文件,解压windows server.iso文件到 D:\WindowsOS 在服务器管理器上添加.NET Framewor ...
- selenium------关于switch_to的用法场景
基于python3的语法,driver.switch_to_alert()的表达会出现中划线,因此需要把后面的下划线改为点.一.目前接触到的switch_to的用法包括以下几种:1. 切换到制定的wi ...