HTML&CSS重要概念
夹心776655
这个作者很懒,什么都没留下…
展开
-
【JQuery + HTML+CSS】之表单元素
表单元素form双标签,默认占一整行声明一个表单区域作用:用于收集不同类型的用户输入信息input单标签,可以并排显示,,默认边框,和边距type:text:文本输入框password 密码框,默认掩码显示radio 单选框checkbox 复选框button 普通按钮submit 提交按钮,默认有提交两个字,默认有提交功能,需要配合name属性reset 重置按钮,默认有重置两个字,清空输入框的内容file 文件上传按钮image 图片按钮 默认有提交动作原创 2020-12-21 14:41:43 · 126 阅读 · 0 评论 -
HTML+CSS(精灵图)实现微信滑动门技术
微信滑动门技术为了使各种【特殊形状的背景】能够【自适应元素中文本内容的多少】,出现了CSS滑动门技术。它从新的角度构建页面,使各种特殊形状的背景能够自由拉伸滑动,以适应元素内部的文本内容,可用性更强。 最常见于各种导航栏的滑动门。如微信官网导航。滑动门核心技术就是【利用CSS精灵(主要是背景位置)和盒子padding撑开宽度】, 以便能适应不同字数的导航栏。效果:代码实现:<!DOCTYPE html><html lang="en"><head>原创 2020-12-05 12:49:29 · 514 阅读 · 0 评论 -
【HTML重点】CSS盒模型
CSS盒模型1.CSS盒模型的组成CSS盒模型本质就是一种布局思想, 本质上是一个盒子, 封装周围的HTML标签, 每一个标签都可以看成是一个盒模型组成: 外边距(margin)、边框(border)、填充(padding)、实际内容(content)content: 设置width和height属性值来规定标签的content内容区域的大小。标签内容及子标签默认内容区域开始排列 padding: 定义标签边框与标签内容之间的空间, padding可以单独改变上、下、左、右边距, 也可以一原创 2020-11-27 15:09:12 · 124 阅读 · 0 评论 -
HTML/CSS之如何溢出显示省略号
1.单行文本溢出显示省略号<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>单行显示省略号</title> <style> .原创 2020-11-22 22:34:50 · 144 阅读 · 0 评论 -
【HTML重点】之元素水平垂直居中
1.浮动产生的问题问题: 标签浮动以后, 脱离正常文档流, 导致父标签无法被撑开, 且会影响后续正常布局2.清浮动的方法1. 给浮动标签的父标签固定高度(不够灵活)2. 给浮动标签的最后一个添加空div(块标签), 且添加样式clear:both;3.给父标签添加overflow属性, overflow为visible以外的其他值也可以帮助实现4.给浮动标签的父元素添加clearfix.clearfix:after{ content:""; clear:both原创 2020-11-20 18:21:00 · 175 阅读 · 0 评论 -
【HTML重点】行内元素与块级元素
块级标签的特点:1.从上往下排列, 默认宽度占一行2.高度、行高、外边距以及内边距可以控制3.可以容纳内联标签和其他块标签4.常用块级元素: div, p , h1-h6, ul, ol, li, dt, dd等行内标签的特点:1.并排显示, 默认宽高由内容撑开2.设置高、宽无效, 但水平方向padding和margin可以设置, 垂直方向的无效3.行内标签只能容纳文本或者其他行内标签, 不能嵌套块元素4.常用的行内元素: span, a, strong. b. em,原创 2020-11-20 16:49:58 · 112 阅读 · 0 评论 -
常见的浏览器兼容问题
前端开发中需要时刻与浏览器打交道, 因此如何解决不同版本的浏览器兼容问题至关重要:1. 常见的浏览器及其内核常见的浏览器及其内核 常见浏览器 内核 私有前缀 Chrome webkit -webkit Firefox gecko -moz IE trident -ms Opera presto -o Safari webkit -webkit 2.常见的兼容问题...原创 2020-11-20 14:07:07 · 114 阅读 · 0 评论 -
BFC规则与如何解决图片下间隙问题
1.什么是BFCBlock Formatting Context(块级格式化上下文):指页面中的一个渲染区域, 并且拥有一套渲染规则, 他决定了其子标签如何定位, 以及与其他标签的相互关系和作用。2.如何生成BFC?根标签 float: left | right overflow: hidden | scroll | auto display: inline-block position: absolute | fixed3. BFC特性内部标签会在垂直方向上一个接一个地放置 垂原创 2020-11-20 11:50:33 · 119 阅读 · 0 评论