HTML5学习_day06(1)--html之定位的定义

最新推荐文章于 2023-12-24 13:24:04 发布

woaiwanshumen

最新推荐文章于 2023-12-24 13:24:04 发布

阅读量347

点赞数

分类专栏： HTML5零基础学习笔记文章标签： html5 定位定义

本文链接：https://blog.csdn.net/woaiwanshumen/article/details/52680525

版权

HTML5零基础学习笔记专栏收录该内容

43 篇文章 0 订阅

订阅专栏

1.什么是定位？

把一个元素按照某一种方式放到某一个地方。

2.定位的语法

position属性

值:

absolute 绝对定位

relative 相对定位

static 静态(系统默认值)

fixed 固定定位

inhret 从父级继承的定位属性

3.定位之后可以设置的四个属性值

top:定义了元素的上外边界与包含块上边界的一个偏移

right:定义了元素的右边界与包含块右边界的一个偏移

bottom:定义了元素下边界与包含块下边界的一个偏移

left:定义了元素左边界与包含块左边

界的一个偏移

优先级：top>bottom left>right

z-index:number;设置元素的叠层值;默认是0

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

woaiwanshumen

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

专栏目录

python requests下载网页_python爬虫 requests-html的使用

weixin_39600319的博客

12-03

2000

一介绍Python上有一个非常著名的HTTP库——requests，相信大家都听说过，用过的人都说非常爽！现在requests库的作者又发布了一个新库，叫做requests-html，看名字也能猜出来，这是一个解析HTML的库，具备requests的功能以外，还新增了一些更加强大的功能，用起来比requests更爽！接下来我们来介绍一下它吧。# 官网解释'''This library inten...

HTML之定位

代码解释生活

06-29

4754

定位：flex布局：http://www.runoob.com/w3cnote/flex-grammar.htmlposition 属性规定元素的定位类型：可能的值值描述absolute生成绝对定位的元素，相对于 static 定位以外的第一个父元素进行定位。元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。fixed生成绝对定位的元素，相对于浏览...

参与评论您还未登录，请先登录后发表或查看评论

定位的概念（HTML）

原地起飞

07-31

1685

文章目录前言HTML中为什么需要定位？一、定位1.定位的组成2.定位模式1、static 静态定位 (默认)2、relative 相对定位3、absolute 绝对定位4、fixed 固定定位5、粘性定位sticky （了解）总结前言 HTML中为什么需要定位？ 1、浮动可以让多个块级盒子一行没有缝隙排列显示，经常用于横向排列盒子 2、定位则是可以让盒子自由的在某个盒子内移动位置或者固定屏幕中某个位置，并且可以压住其他盒子一、定位 1.定位的组成定位=定位模式+边偏移 &nbs

HTML5——多次定位请求

weixin_30481087的博客

04-27

119

多次定位请求及点击一次就不断的触发请求事件，和单次定位请求写法差不多，只需要将navigator.geolocation.getCurrentPosition改为navigator.geolocation.watchPosition。下面将一个小小Demo展示如下: 简要代码如下： <!DOCTYPE html> <html> <head...

html table设置边框线

热门推荐

Liyatao_BeiJing的博客

08-18

1万+

这个问题有4种解决办法： 1、表格里面套表格：

HTML网页的基本概念

qq_48516121的博客

11-03

794

一、HTML的概念 HTML：四个单词的缩写（hyper text mackup language）超文本标记语言 .xml: 可扩展标记语言。之前想存储数据，但是被（JSON）干掉了。最大的作用：作为配置文件。 1、超文本：和普通文本不同的是，可以有颜色、样式，有色有形，可以点击，可以跳转，可以显示图片，可以看视频，可以有声音。 2、特点：不同于Java，前后没有逻辑性，由标签组成; 标记语言，就是有很多标签。 3、有自动纠错功能，纠错功能不是HTML本身...

HTML学习打卡_Day3

WeiComp

11-29

1244

学习 HTML ——打卡！！！Day3 文章目录学习 HTML ——打卡！！！Day31、HTML CSS1.1、HTML 样式-CSS1.2、如何使用 CSS1.3、内联样式1.3.1、HTML 样式实例 - 背景颜色1.3.2、HTML 样式实例 - 字体、字体颜色、字体大小1.3.3、HTML 样式实例 - 文本对齐方式1.4、内部样式表1.5、外部样式表1.6、HTML 样式标签2、HTML 图像2.1、图像标签（<(尖括号) img (尖括号)>）和源属性 (Src)2.2、Alt 属

html-day07垂直对齐&定位

Charlotte_99的博客

02-20

1603

1.垂直对齐:只有行内块元素可以使用该属性 vertical-align:top | middle | bottom | baseline基线默认值; 应用： 1.解决图片3px问题【图片设置垂直对齐方式】 2.让表单中的内容垂直对齐【输入框和按钮垂直对齐】 3.给表格中的内容设置垂直对齐。 2.定位概念:将一个元素放在指定的位置上。特指position. [将a强行放在b身上] 语法： position:定位方式; left：*px; | right:*p

HTML学习Day1——网页的基本结构

ProQianXiao的博客

08-19

3128

网页的基本结构我们都知道网站是由一个一个网页构成的，每一个网页就是一个HTML文件。对于网页来讲，它有三个要素，结构、表现和行为。结构就是指网页的布局和骨架，是由HTML设置的；表现就是指网页的样式，由CSS控制；行为就是指网页的功能或者事件，比如点击按钮触发事件，是由JAVAScript控制的。一、最简单的网页 <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"&gt

系统学习前端之CSS---day01

最新发布

weixin_63522291的博客

12-24

1409

和

day5-html-css-js

05-10

在"day5-html-css-js"的学习资源中，你可能会深入学习以下HTML知识点： 1. **HTML5新特性**：HTML5增加了许多新的标签，如`<header>`, `<footer>`, `<article>`, `<section>`等，使页面结构更加清晰，便于SEO和无...

FE21-HTML-DAY1-Hrynko-Szabo

02-16

总的来说，"FE21-HTML-DAY1-Hrynko-Szabo"涵盖了HTML的基本概念、HTML5的新特性，以及与CSS和JavaScript的交互。这是一门全面介绍前端开发入门的课程，旨在帮助学习者理解如何构建静态网页，并为更深入的前端技术...

signup_form_htmlcss:学习HTML CSS Day＃1

05-06

在“signup_form_htmlcss:学习HTML CSS Day＃1”这个主题中，我们开始探索Web开发的基础，特别是关于创建一个注册表单的实践。HTML（超文本标记语言）和CSS（层叠样式表）是构建网页内容和外观的两种关键技术。在这...

day06-scroll-animation（滚动-动画）

07-04

在IT行业中，网页动画设计是提升用户体验和交互性的重要手段之一。"day06-scroll-animation（滚动-动画）"这个主题聚焦于如何利用HTML、CSS和JavaScript技术来创建基于滚动的动态效果。以下是对这些技术及其在滚动...

HTML5学习_day06(4)--html之固定定位

woaiwanshumen的博客

10-08

523

1.固定定位的定义position: fixed 它使相对浏览器窗口进行定位的，同样脱离文档流的，可以通过left,right,top,bottom来调整元素所在的位置就是让该标签一直显示在网页某个位置无论你怎么滚动界面 2.用户 1.一般用来做页面的导航部分与底部 2.可以用来做网页中插入广告和商业推广注意：1.我们在使用时候尽量使用在页面的底部，因为他脱离了文档流，也

HTML5学习_day01(2)--HBuilder工具tab快捷键使用

woaiwanshumen的博客

09-20

4229

快捷键TAB使用 1.标签快速生成格式：标签名按tab键自动生成标签例子： div 生成 2.多个标签快速生成格式：标签名*10 按TAB键后自动生个10个标签例子： div*3 生成 3,快速生成并添加内容格式:标签名{内容} 生标签并把内容写入标签之间例子： div{这是我的div} 生成这是我的di

HTML5学习_day06(5)--html之固定总结(轮播图垂直居中)

woaiwanshumen的博客

10-08

2376

1.position:relative 不会脱离文档流 2.position:absolute | fix 脱离文档流 3.absolute是相对于父级非static(没有设置定位默认值)进行定位(若父级是static 继续往上找有定位的父级) 4.fixed始终是相对于浏览器窗口来进行定位定位的用途： 1.图片的叠加 2.元素的垂直居中 3，布局位置的改变 4.广告植入

HTML5学习_day01(6)--html颜色的几种写法

woaiwanshumen的博客

09-20

2293

颜色的几种写法 1.颜色第一种写法:用颜色名来表示,red,blue,green,pink,dark,yellow等 background-color: green; 效果： 2.颜色第二种写法:通过16进制值表示(把图片拖进PS工具，按I，按住CTRL左击你所想要的颜色就能获取颜色代码); 纯红:#FF0000=#F00; 黑色:#000000=#000;

HTML5学习_day10(2)--css文件书写格式

woaiwanshumen的博客

10-11

1955

css文件书写格式 1.尽量将样式写在一个单独的css文件里面，在head里面去引用 1)实现了内容与样式的分离， 2）减少了页面的体积 3）css文件可以被缓存，重用，维护成本低 (注意：css文件只加载一次，重新刷新页面时会在缓存里面找) 2.不要使用@import(这个也是可以调用css文件但是是在style标签内使用 @import url(css路径);) 影响css

HTML5前端学习：定位应用实战——小米官网模拟

"这篇内容是关于HTML5前端学习的，主要聚焦在第二周的Day10，即定位技术的实践应用。作者通过模仿小米官网的布局来加深对定位的理解，内容涉及CSS中的margin、padding、position等属性的使用。" 在HTML5大前端的...