1、css的书写位置

  1》行内样式:

    <span style="color:red;">haha</span>

  2》内部样式

    在style标签中

      span{

        color:red;

        }

  3》外部样式

    <link href=""  rel="stylesheet" type="text/css" />

2、元素分类

  1、块级元素:block

    特点:1》独占一行2》宽度高度可以设置3》如果不设置宽度,则宽度为父亲的100%4》不设置高度,高度为里面的内容自动撑开

    例子:div p nav header section h1-h6

    具有上下左右外边距和上下左右内边距

  2、行内元素:inline

    特点:1》可以并排显示在一行2》宽度高度不能设置,只能有里面的内容自动撑开

    例子:span a em strong i b

    没有上下内外边距,但有左右内内外边距

·  3、行内块元素:inline-blick

    特点:1》元素可以并排2》高度宽度都可以自行设置3》默认的宽高是浏览器给的

    例子:input img

3、对应元素属性的相互转化

  display:

    --block --inline-block --inline --none

css的书写位置+元素分类的更多相关文章

  1. CSS学习笔记之元素分类

    在讲解CSS布局之前,我们需要提前知道一些知识,在CSS中,html中的标签元素大体被分为三种不同的类型:块状元素.内联元素(又叫行内元素)和内联块状元素. 常用的块状元素有: <div> ...

  2. 5.css背景以及书写位置

    1.样式表书写位置 ◆内嵌式写法 <head> <style type=”text/css”> 样式表写法 </style> </head> 2.◆外链 ...

  3. 李洪强和你一起学习前端之(5)css书写位置 优先级和伪类

    亲爱的,时间过得真快,不知不觉我们一起学习前端已经4天了,这4天的时间里,我们是不是收获很大呢,每当我们学习一个新的知识点的时候,每当我们做出一个新的东西来的时候,我们是不是欣喜若狂,世界从来否不会辜 ...

  4. 深入css布局篇(1) — 盒模型 & 元素分类

    深入css布局(1)-- 盒模型 & 元素分类     " 在css知识体系中,除了css选择器,样式属性等基础知识外,css布局相关的知识才是css比较核心和重要的点.今天我们来深 ...

  5. Web前端开发基础 第四课(CSS元素分类)

    元素分类 在讲解CSS布局之前,我们需要提前知道一些知识,在CSS中,html中的标签元素大体被分为三种不同的类型:块状元素.内联元素(又叫行内元素)和内联块状元素. 常用的块状元素有: <di ...

  6. CSS元素分类及区别

    元素是文档结构的基础,在CSS中,每个元素生成了一个包含了元素内容的框(box,也译为“盒子”).但是不同的元素显示的方式会有所不同,例如<div>和<span>就不同,而&l ...

  7. CSS中的元素分类

    CSS中的元素分类 元素是文档结构的基础,在CSS中,每个元素生成了一个包含了元素内容的框(box,也译为"盒子").但是不同的元素显示的方式会有所不同,例如<div> ...

  8. CSS权威指南学习笔记 —— HTML元素分类

    HTML文档由各种元素组成.比如,p.table.span等等.每个元素都会对文档的表现有所影响.CSS中,每个元素都会生成一个框(传说中的盒子),其中包含元素内容. 元素可以根据它的创建方式分为两种 ...

  9. 【从0到1学Web前端】CSS伪类和伪元素 分类: HTML+CSS 2015-06-02 22:29 1065人阅读 评论(0) 收藏

    1.CSS中的伪类 CSS 伪类用于向某些选择器添加特殊的效果. 语法: selector : pseudo-class {property: value} CSS 类也可与伪类搭配使用 select ...

随机推荐

  1. SpringBatch批处理框架

    1.前言:本博客是对于刘相SpringBatch批处理框架的学习 1.1.参考网站:https://docs.spring.io/spring-batch/4.2.x/reference/html/i ...

  2. C++——友元函数和友元类

    友元函数:让函数可以访问类的私有属性 #include <iostream> using namespace std; class A { public: friend class B;/ ...

  3. win7防火墙里开启端口的图文教程 + SNMP测试感触

    转:http://www.cnblogs.com/vipsoft/archive/2012/05/02/2478847.html 开启端口:打开“控制面板”中的“Windows防火墙”,点击左侧的“高 ...

  4. 在ubuntu下编写python

    一般情况下,ubuntu已经安装了python,打开终端,直接输入python,即可进行python编写. 默认为python2 如果想写python3,在终端输入python3即可. 如果需要执行大 ...

  5. org.apache.ibatis.binding.BindingException: Parameter 'xxx' not found. Available parameters are [arg1, arg0, param1, param2]

    这个异常说明参数没有加上@Param注解,加上这个注解就行了. 默认情况下mybatis把参数按顺序转化为[0, 1, param1, param2],也就是说#{0} 和 #{param1} 是一样 ...

  6. 一个因为系统字号设置导致的rem计算渲染异常问题

    测试同学突然拿着一部手机过来说,H5渲染各个元素都变大了,有些元素撑出了屏幕外面. 本来以为是某个Webview的渲染兼容问题,结果发现所有的浏览器都这样. 莫名其妙,隐约感觉是 rem计算出了问题, ...

  7. Visual Studio 2019安装教程

    一.下载 网址:https://visualstudio.microsoft.com/zh-hans/vs/ 下载后是一个.exe文件 二.安装 双击打开下载的.exe文件,进入文件的提取 提取完成后 ...

  8. 面试系列14 redis的过期策略都有哪些

    (1)设置过期时间 我们set key的时候,都可以给一个expire time,就是过期时间,指定这个key比如说只能存活1个小时?10分钟?这个很有用,我们自己可以指定缓存到期就失效. 如果假设你 ...

  9. java_缓冲流(文件内容排序)

    /** 案例:诸葛亮出师表文本排序 * 1.使用HashMap集合,k存储每行文本序,v存储文本 * 2.创建字符缓冲输入流,构造方法中绑定字符输入流 * 3.使用字符串缓冲输入流中的方法readLi ...

  10. mybatis 查询sql时foreach使用法

    找到俩个例子摘下来 sql查询用户in传list参数 <select id="getEmpsByConditionForeach" resultType="com. ...