iis服务器助手广告广告
返回顶部
首页 > 资讯 > 前端开发 > node.js >DIV入门知识点有哪些
  • 962
分享到

DIV入门知识点有哪些

2024-04-02 19:04:59 962人浏览 独家记忆
摘要

本篇内容介绍了“DIV入门知识点有哪些”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!DIV入门简介DIV

本篇内容介绍了“DIV入门知识点有哪些”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!

DIV入门简介

DIV 在编程中又叫做整除,即只得商的整数。 DIV元素是用来为html文档内大块(block-level)的内容提供结构和背景的元素。DIV的起始标签和结束标签之间的所有内容都是用来构成这个块的,其中所包含元素的特性由DIV标签的属性来控制,或者是通过使用样式表格式化这个块来进行控制。

CSS单元的位置和层次-div标签

我们都知道,在网页上利用HTML定位文字和图像是一件“令人心痛”的事情。我们必须使用表格标签和隐式GIF图像,即使这样也不能保证定位的精确,因为浏览器和操作平台的不同会使显示的结果发生变化。

CSS能使你看到希望的曙光。利用今天我们即将学到的CSS属性,你可以精确地设定要素的位置,还能将定位的要素叠放在彼此之上,还有...还有......你自己慢慢看吧!
Cascading Style Sheets(CSS)是 DHTML 的基础。CSS 用来设定你网页上的元素是如何展示的。Cascading Style Sheets Positioning(CSS-P)是 CSS 的一个扩展,它可用来控制任何东西在网页上或是说在窗口中的位置。请你记住这两个名词:CSS 和 CSS-P。

使用 DIV 标签

这里看一下DIV入门之DIV标签的使用,当我们使用 CSS-P 的时候, 我们主要把它用在 DIV(division)tag 上。当你把文字,图像,或其他的放在 DIV 中,它可称作为“DIV block”,或“DIV element”或“CSS-layer”,或干脆叫“layer”。而中文我们把它称作“层次”。所以当你以后看到这些名词的时候,你就知道它们是指一段在 DIV 中的 HTML。

使用 DIV 的方法跟使用其他 tag 的方法一样:This is a DIV tag .
如果单独使用 DIV 而不加任何 CSS-P, 那么它在网页中的效果和使用是一样的。
但当我们把 CSS-P 用到 DIV 中去以后,我们就可以严格设定它的位置。首先我们需要给这个可以被 CSS-P 控制的 DIV 一个 ID 或说是它的名字。比如说我们给下面这个 DIV 的名字是 truck。给名字的目的是我们以后可用 javascript 来控制它, 比如说移动它或改变它的一些性质等等。

◆This is a truck

给层次取什么名字是随意的,名字可以是任何英文字母和数字,但***个必须是字母。有两种把 CSS-P 应用到 DIV 的方法。
Inline CSS:Inline 是最常用的方法。This is a truck .
External STYLE tag:使用 External 方法的结果是一样的。我们会在以后的课程里再详细解释这种方法。现在我们主要讨论Inline 方法。请注意在 External 方法里,在 STYLE 里的 ID 和 DIV 里的关系。

<STYLE TYPE="text/css">  STYLE>

This is a truck .

Cross-Browser CSS 性质:
我们这个课程的主要目的是让你写出的网页在 NS4 和 IE4 上都能工作, 所以我们主要讨论那些对俩者都通用的性质。下面这些性质符合由 W3C 给出的标准。
position 决定 DIV tag 是如何放置的。“relative”意思是DIV的位置是相对于其他 tag 的,而“absolute”是说 DIV tag 的位置是相对于它所在的窗口。
left 相对于窗口左边的位置
top 相对于窗口上边的位置
width DIV tag 的宽度。所有在 DIV 里的文字或html都在里面。
height DIV tag 的高度。这个性质很少用除非你想 Clip 层次。

clip 给出 layer 的 clipping(可看的见的)部分。Clip 可使得 DIV 显示为一个可以定义的很准确的方块。你可以用以下的四个值来给出这个方块的在 DIV 位置和大小。
clip:rect(top,right,bottom,left);
visibility 隐蔽或展现DIV 根据它的值“visible”,“hidden”,“inherit”。
z-index DIV tag 的立体位置。值越大 DIV 的位置越高。
background-color DIV 背景的颜色。
layer-background-color Netscape 的 DIV 背景颜色。
background-image DIV 的背景图像。
layer-background-image Netscape 的 DIV 的背景图像。

“DIV入门知识点有哪些”的内容就介绍到这里了,感谢大家的阅读。如果想了解更多行业相关的知识可以关注编程网网站,小编将为大家输出更多高质量的实用文章!

--结束END--

本文标题: DIV入门知识点有哪些

本文链接: https://www.lsjlt.com/news/88110.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
  • DIV入门知识点有哪些
    本篇内容介绍了“DIV入门知识点有哪些”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!DIV入门简介DIV ...
    99+
    2024-04-02
  • linux入门知识点有哪些
    这篇文章给大家分享的是有关linux入门知识点有哪些的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。linux目录架构 / 根目录 /bin 常用的命令 binary file 的目錄 /boot 存放系统启动时必...
    99+
    2023-06-13
  • Netty入门知识点有哪些
    本篇内容介绍了“Netty入门知识点有哪些”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!Java NIO再说Netty 之前先简单了解下Ja...
    99+
    2023-06-19
  • FreeMarker入门知识点有哪些
    本文小编为大家详细介绍“FreeMarker入门知识点有哪些”,内容详细,步骤清晰,细节处理妥当,希望这篇“FreeMarker入门知识点有哪些”文章能帮助大家解决疑惑,下面跟着小编的思路慢慢深入,一起来学习新知识吧。FreeMarker是...
    99+
    2023-06-26
  • div+css入门框架架构的知识点有哪些
    本篇内容主要讲解“div+css入门框架架构的知识点有哪些”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“div+css入门框架架构的知识点有哪些”吧! css...
    99+
    2024-04-02
  • Redux入门知识点有哪些
    这篇文章主要为大家展示了“Redux入门知识点有哪些”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“Redux入门知识点有哪些”这篇文章吧。Redux是什么?一个...
    99+
    2024-04-02
  • PHP入门知识点有哪些
    小编给大家分享一下PHP入门知识点有哪些,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!一、 首要条件你首先必须要有一个正在工作着的支持PHP的web服务...
    99+
    2023-06-17
  • JRuby入门知识点有哪些
    本篇内容主要讲解“JRuby入门知识点有哪些”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“JRuby入门知识点有哪些”吧!一、JRuby入门引言Ruby是现在编程界讨论得正热火朝天的一种语言。这...
    99+
    2023-06-17
  • shell入门知识点有哪些
    这篇文章主要讲解了“shell入门知识点有哪些”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“shell入门知识点有哪些”吧!背景一句话概括就是:shell编程就是对一堆Linux命令的逻辑化...
    99+
    2023-06-28
  • Git入门知识点有哪些
    今天小编给大家分享一下Git入门知识点有哪些的相关知识点,内容详细,逻辑清晰,相信大部分人都还太了解这方面的知识,所以分享这篇文章给大家参考一下,希望大家阅读完这篇文章后有所收获,下面我们一起来了解一下吧。版本控制什么是版本控制(版本迭代,...
    99+
    2023-06-29
  • ThinkPHP6.0入门知识点有哪些
    本篇内容主要讲解“ThinkPHP6.0入门知识点有哪些”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“ThinkPHP6.0入门知识点有哪些”吧!一.框架介绍ThinkPHP是一个免费开源的,快...
    99+
    2023-07-02
  • html入门知识点有哪些
    本文小编为大家详细介绍“html入门知识点有哪些”,内容详细,步骤清晰,细节处理妥当,希望这篇“html入门知识点有哪些”文章能帮助大家解决疑惑,下面跟着小编的思路慢慢深入,一起来学习新知识吧。   一、...
    99+
    2024-04-02
  • jQuery入门知识点有哪些
    这篇文章主要介绍“jQuery入门知识点有哪些”,在日常操作中,相信很多人在jQuery入门知识点有哪些问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”jQuery入门知识点有...
    99+
    2024-04-02
  • ReactJs入门知识点有哪些
    本篇内容主要讲解“ReactJs入门知识点有哪些”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“ReactJs入门知识点有哪些”吧!   一、ReactJS简介...
    99+
    2024-04-02
  • JSF入门知识点有哪些
    本篇内容主要讲解“JSF入门知识点有哪些”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“JSF入门知识点有哪些”吧!JSF是java web 的标准,可能会取代jsp 时代。JSF直译过来就是Ja...
    99+
    2023-06-17
  • Django入门知识点有哪些
    本篇内容介绍了“Django入门知识点有哪些”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!Django入门:基本知识熟悉python和dja...
    99+
    2023-06-18
  • TypeScript入门知识点有哪些
    这篇文章主要介绍“TypeScript入门知识点有哪些”,在日常操作中,相信很多人在TypeScript入门知识点有哪些问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”Type...
    99+
    2024-04-02
  • Redis入门知识点有哪些
    这篇文章主要介绍“Redis入门知识点有哪些”,在日常操作中,相信很多人在Redis入门知识点有哪些问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”Redis入门知识点有哪些”...
    99+
    2024-04-02
  • VB入门知识点有哪些
    本篇内容介绍了“VB入门知识点有哪些”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!一、VB入门教程VB与Basic VB之所以叫做“Visu...
    99+
    2023-06-17
  • HTML5+CSS3入门知识点有哪些
    这篇文章主要介绍“HTML5+CSS3入门知识点有哪些”的相关知识,小编通过实际案例向大家展示操作过程,操作方法简单快捷,实用性强,希望这篇“HTML5+CSS3入门知识点有哪些”文章能帮助大家解决问题。 ...
    99+
    2024-04-02
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作