css-父标签中的子标签默认位置

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
.a{
width: 100px;
height: 100px;
background: red;
position: relative;
top: 40px;
left: 50px;
padding: 30px;
}
.b{
width: 50px;
height: 50px;
background: bisque;
position: absolute;
}
</style>
</head>
<body>
<div class="a">
<div class="b"></div>
</div>
</body>
</html>

如果不给b标签设定top和left。他们会有个默认的值。

top和left会以width和height为基础进行定位。

时间: 2024-08-02 13:44:08

css-父标签中的子标签默认位置的相关文章

让DIV标签中的P标签水平和垂直都居中

http://blog.csdn.net/yaoyyl/article/details/50548589 <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>让DIV标签中的P标签水平和垂直都居中</title> <style type="text/css"> div { width:400px; height:

HEAD标签中的常用标签

目录 知识点 知识点详解 0x01 HTML的主体结构 0x02 HEAD标签中的常用标签 知识点 HTML的主体结构 HEAD标签中的常用标签 知识点详解 0x01 HTML的主体结构 HTML的主体结构分为两大部分:最顶部声明和HTML标签.其中,HTML标签又包含HEAD与BODY两个标签. <!DOCTYPE html> <!-- //最顶部声明,告诉浏览器所使用的HTML规范 --> <html> <!--//html标签开始--> <hea

(转)C#在父窗口中调用子窗口的过程(无法访问已释放的对象)

C#在父窗口中调用子窗口的过程: 1. 创建子窗口对象 2. 显示子窗口对象 笔者的程序中,主窗体MainFrm通过菜单调用子窗口ChildFrm.在窗体中定义了子窗口对象,然后在菜单项点击事件中,加入了如下代码来创建和显示子窗口: Private childFrm myChildFrm = null; //定义子窗口对象 private void OpenChildFrmToolStripMenuItem_Click(object sender, EventArgs e) { myChildF

vue组件之间的通信以及如何在父组件中调用子组件的方法和属性

在Vue中组件实例之间的作用域是孤立的,以为不能直接在子组件上引用父组件的数据,同时父组件也不能直接使用子组件的数据 一.父组件利用props往子组件传输数据 父组件: <div> <child v-bind:my-message="parentMsg"></child>//注意传递参数时要用-代替驼峰命名,HTML不区分大小写 </div> 子组件: Vue.component('child', { // camelCase in Ja

在父字符串中查找子字符串

在父字符串中查找子字符串(指针控制,也可选择标控制) #pragma once #include<iostream> #include<assert.h> using namespace std; char* StrStr(char* source, char* dest) { assert(source&&dest); if (strlen(source) < strlen(dest)) return NULL; char* newSrc = NULL; c

父组件中调用子组件的方法和属性

方案:利用ref属性可以获取到dom元素或者是子组件,从而可以调用子组件的方法(注意2.0版本用ref取代了el) 1.当ref直接定义在dom元素上时,则通过this.$refs.name可以获取到dom,对dom进行原生的操作 <div class="foods-wrapper" ref="foods-wrapper"> 通过this.$refs获取到dom进行操作(注意ref属性的命名不能用驼峰,同时获取的时候也不能用) let menuList

python之body标签中的相关标签2(14)

今日主要内容: 列表标签 <ul>.<ol>.<dl> 表格标签 <table> 表单标签 <fom> 一.列表标签 列表标签分为三种. 1.无序列表<ul>,无序列表中的每一项是<li> 英文单词解释如下: ul:unordered list,"无序列表"的意思. li:list item,"列表项"的意思. 示例: <ul> <li>张三</li&g

HTML之body标签中的相关标签

一 字体标签 字体标签包含:h1~h6.<font>.<u>.<b>.<strong><em>.<sup>.<sub> 标题 标题使用<h1>至<h6>标签进行定义.<h1>定义最大的标题,<h6>定义最小的标题.具有align属性,属性值可以是:left.center.right. 1 2 3 4 5 6 <h1>路飞学城</h1> <h2&g

body标签中的相关标签1

body内标签级别 body标签内内有三种标签元素级: 块级元素:独占一行,可设置宽高,如果不设置宽度,则为浏览器宽度 行内元素:在一行内展示,不能设置宽高,它的宽高根据内容去填充 行内块元素:在一行内展示,可以设置宽高 html内所有标签可以分为两种: 文本级标签:p span a b i u em 文本标签内只能放文字,图片,表单元素 容器级标签:div h系列 li dt dd 容器级标签里可以放任何东西 标签元素级 ** 常见的块级元素: ** 标题 h1~h6 盒子标签 div 段落