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又称样式重叠在网页排版布局中的地位举足轻重. 做 ...
随机推荐
- 面向对象继承---复习：包含继承关系，里氏转换，ArrayList与Hashtable集合，文件处理
using System; using System.Collections; using System.Collections.Generic; using System.IO; using Sys ...
- MSF设置监听
一.msf需要生成一个payload 需要生成一个paylaod,window下面生成一个exe,注意:权限不够用sudo权限 sudo ./msfvenom -p windows/x64/meter ...
- 【面试题】 用vue想要拿20k，面试题要这样回答（源码版）
总结给大家推荐一个实用面试题库 1.前端面试题库 (面试必备) 推荐:★★★★★ 地址:前端面试题库 2.前端技术导航大全 推荐:★★★★★ 地址:前端技术导航大全 ...
- vite+vue3.0+ts搭建项目
项目git地址:https://gitee.com/suyong01/vue3-ts-template vue+ts+vite项目初始化 # npm 6.x npm init @vitejs/app ...
- Unity打包发布PC程序之——默认管理员权限运行
https://blog.csdn.net/x1017619024/article/details/103970708
- Linux 下查看mysql 加载的配置文件， 并且解决报错 “this is incompatible with sql_mode=only_full_group_by”
# 查看命令地址 which mysql /usr/local/mysql/bin/mysql # 查看配置文件地址 /usr/local/mysql/bin/mysql --verbose --he ...
- Dapper、EF、WebAPI转载记录
轻量级框架Dapper基础 https://www.cnblogs.com/Sinte-Beuve/p/4231053.html 基本使用 https://www.cnblogs.com/hxzb ...
- .NET CORE-通过内置IOC容器IServiceCollection进行服务注册
第一种方式: 在Startup中的ConfigureServices方法中注册服务: services.AddTransient<ITestServiceA, TestServiceA>( ...
- 复杂SQL语句及其优化
一,复杂SQL语句类型 1 ,笛卡尔连接 题目1:找出工资超过各自经理的员工姓名 表:employee(id , name , depid , salary, manager_id ) SELECT ...
- 2023-03-02 记录一下关于chatGPT使用方法
国内版: 在线免费web版: https://chat.forchange.cn/(不用登录) https://app.writesonic.com/login(要登录) 在线免费微信版:AI对话未来 ...