当前位置: 首页 > news >正文

深入认识CSS的行内元素

2019独角兽企业重金招聘Python工程师标准>>> hot3.png

    006zipb5zy79oIjSdtnd1&690

一直从事ios开发,前段时间接触到前端,简单的学习了一下css,下面给大家简单的说一下,我使用css来写一个页面的心得与体会。.我是在w3c那里,通过看文档对css有了初步的认识,css的知识点整体看起来并不难。都是一些属性。但是如果仅仅是这样,那你就大错特错了,其实css并没有人们想象中的那么简单。先来说一下css的行内元素

行内元素(inline): 元素在一行内水平排列,高度由元素的内容决定,height属性不起作用,行内元素也称为内联元素。如span,input等元素。

常见的行内元素有:

–  a – 锚点

–  abbr – 缩写

–  acronym – 首字

–  b – 粗体(不推荐)

–  bdo – bidi override

–  big – 大字体

–  br – 换行

–  cite – 引用

–  code – 计算机代码(在引用源码的时候需要)

–  dfn – 定义字段

–  em – 强调

–  font – 字体设定(不推荐)

–  i – 斜体

–  img – 图片

–  input – 输入框

–  kbd – 定义键盘文本

–  label – 表格标签

–  q – 短引用

–  s – 中划线(不推荐)

–  samp – 定义范例计算机代码

–  select – 项目选择

–  small – 小字体文本

–  span – 常用内联容器,定义文本内区块

–  strike – 中划线

–  strong – 粗体强调

–  sub – 下标

–  sup – 上标

–  textarea – 多行文本输入框

–  tt – 电传文本

–  u – 下划线

 

行内元素的特点:

–  1.设置宽度width 无效。

–  2.设置高度height 无效,可以通过line-height来设置。

–  3.设置margin 只有左右margin有效,上下无效。

  4.设置padding 只有左右padding有效,上下则无效。注意元素范围是增大了,但是对元素周围的内容是没影响的。

5. 和其他元素在同一行

6. 行内元素只能容纳文本或者其他行内元素

 

 

转载于:https://my.oschina.net/u/2971691/blog/856535

相关文章:

  • PHP Smarty template for website
  • 网络中数据传输过程的分析
  • BIO、NIO和AIO的区别(简明版)
  • JavaScript-基础入门.0008.JavaScript作用范围
  • 《微信公众平台开发》图书介绍
  • PE分析
  • 判断用户名是否正确
  • loadrunner中Windows Resource没有数据或不可用
  • vue-todolist-example学习
  • javaScript事件(八)事件类型之变动事件
  • 白话机器学习
  • JavaScript的异步运行机制
  • 嵌入式软件设计第7次实验报告
  • 从@property说起(二)当我们写下@property (nonatomic, weak) id obj时,我们究竟写了什么...
  • httpclient 优化
  • 2018一半小结一波
  • Android单元测试 - 几个重要问题
  • codis proxy处理流程
  • C学习-枚举(九)
  • Essential Studio for ASP.NET Web Forms 2017 v2,新增自定义树形网格工具栏
  • HTTP 简介
  • IIS 10 PHP CGI 设置 PHP_INI_SCAN_DIR
  • Java-详解HashMap
  • KMP算法及优化
  • Mac转Windows的拯救指南
  • MySQL数据库运维之数据恢复
  • vue总结
  • 从setTimeout-setInterval看JS线程
  • 从零开始的webpack生活-0x009:FilesLoader装载文件
  • 复杂数据处理
  • 在Docker Swarm上部署Apache Storm:第1部分
  • 中文输入法与React文本输入框的问题与解决方案
  • raise 与 raise ... from 的区别
  • 积累各种好的链接
  • ​决定德拉瓦州地区版图的关键历史事件
  • #我与Java虚拟机的故事#连载04:一本让自己没面子的书
  • (17)Hive ——MR任务的map与reduce个数由什么决定?
  • (C语言)输入一个序列,判断是否为奇偶交叉数
  • (HAL)STM32F103C6T8——软件模拟I2C驱动0.96寸OLED屏幕
  • (二)WCF的Binding模型
  • (附源码)springboot教学评价 毕业设计 641310
  • (附源码)springboot课程在线考试系统 毕业设计 655127
  • (黑马出品_高级篇_01)SpringCloud+RabbitMQ+Docker+Redis+搜索+分布式
  • (九)信息融合方式简介
  • (六)软件测试分工
  • (论文阅读23/100)Hierarchical Convolutional Features for Visual Tracking
  • (欧拉)openEuler系统添加网卡文件配置流程、(欧拉)openEuler系统手动配置ipv6地址流程、(欧拉)openEuler系统网络管理说明
  • (三) prometheus + grafana + alertmanager 配置Redis监控
  • (一)Dubbo快速入门、介绍、使用
  • (转)大型网站的系统架构
  • (转载)虚幻引擎3--【UnrealScript教程】章节一:20.location和rotation
  • .gitattributes 文件
  • .net framework4与其client profile版本的区别
  • .net快速开发框架源码分享
  • .net中调用windows performance记录性能信息