美文网首页H5之旅
CSS的基本认识

CSS的基本认识

作者: 聆听者JYZ | 来源:发表于2017-01-17 11:44 被阅读8次

几个认识:

一般行内元素是在同一行横向排列的;;;块级元素元素会占满整个一行,总是换行,在页面中竖向排列。【但是可以设置display,改变块或行元素原来的属性,display:inline(块改成行),display:block(行改成块)】

注意1:disPlay:inline-block,(此时是既具有行元素的横向排列,又具有块元素的可设置宽高等)

注意2:disPlay:none,(隐藏元素,一些设置的属性也会隐藏)

常见的块内元素:<div> <p> <h1> <form> <ul> <li>和h5新增的一些标签(header、section、footer)等标签。

常见的行内元素:<span> <a> <label> <input> <stong> <img>的是行内标签。

CSS3特殊部分:新增display:flex  或display:inline-flex 使元素为弹性盒子,是一个全新的布局方式,也分为块级和行内级,(块级和行级)基本思想是一样的。

盒子浮动:顾名思义,浮动就是可以是元素相互叠加,

属性:float,默认是none,如果设置left、right,元素就会向其父元素左侧或右侧靠近,一旦设置浮动,这个文档就会是3D了,被设置的元素就不会当做下一个元素布局的参照了,(相当于被设置元素被他后面的元素抛弃了,但被设置元素之前的元素都是正常的,(相对于被设置元素也是正常的)),,,此时被设置元素的下一个元素可能会受到影响(被盖住等等)如果不想受影响,此时可以设置下一个元素clear(清除浮动)

相关文章

  • CSS的基本认识

    几个认识: 一般行内元素是在同一行横向排列的;;;块级元素元素会占满整个一行,总是换行,在页面中竖向排列。【但是可...

  • css基本知识

    认识css css作用:给网页中的每个元素进行化妆,排版布局,让网页更精美 完全没有使用css的页面:基本就是一堆...

  • 前端面试准备--2.css盒模型

    css盒模型 1.题目:谈谈你对css盒模型的认识(从理论转化到应用) 基本概念:标准模型+ IE模型border...

  • CSS进击之路

    在认识了基本css后,我们今天再来讲解几个属性、选择器,然后再看看css盒子模型,以及一些问题。 css属性进击 ...

  • 3-4 CSS盒模型

    题目:谈谈你对CSS 盒模型的认识 基本概念 标准模型+IE模型 标准模型和IE模型的区别 CSS 如何设置这两种...

  • Webpack4学习笔记(四)——CSS处理

    本文github地址。 最基本的CSS处理 Webpack最基本的css处理:css-loader + style...

  • day03

    A我今天学到了什么 CSS的基本样式 CSS的基本样式

  • css基本语法与页面应用

    1、csss基本语法和页面引用 css基本语法 css页面引用方法 2、css文本设置 3、css颜色表示法

  • CSS基础

    1. CSS盒模型 1.1 认识盒模型 盒模型是CSS布局的最基本组成部分,它指定元素如何显示及在某种方式上如何相...

  • day03

    A今日所学 一、CSS基本样式 二、CSS继承 B今日已掌握 一、CSS基本样式 二、CSS继承 C今日未掌握

网友评论

    本文标题:CSS的基本认识

    本文链接:https://www.haomeiwen.com/subject/gnsmbttx.html