随笔分类 -  HTML+CSS

HTML+CSS教程(八)CSS3(border/background/浏览器私有化前缀/背景/渐变/过渡)
摘要:一.边框 1.边框圆角border-radius2.边框阴影box-shadow3.边框图片border-inage-source:url("")border-image-repeat:设置背景图的平铺方式,streth(拉伸)round(图片自动调整缩放比例)border-image-slice裱 阅读全文
posted @ 2020-04-26 09:07 豆皮没有豆 阅读(225) 评论(0) 推荐(0)
HTML+CSS教程(七)HTML5及CSS3的简单介绍(语义化标签、表单、多媒体、属性/伪类选择器)
摘要:一.HTML5 1.HTML:超文本标记语言(超文本:视频.音频.超链接.图片…;标记语言:标签组合) 2.HTML5的简单介绍: html5 是html4.0 升级版,HTML5 并不仅仅只是做为HTML 标记语言的一个最新版本,更重要的是它制定了Web 应用开发的一系列标准,成为第一个将Web 阅读全文
posted @ 2020-04-26 09:00 豆皮没有豆 阅读(331) 评论(0) 推荐(0)
HTML+CSS教程(六)浮动-float+定位-position+居中问题
摘要:一.浮动(float)1.文档流:是指盒子按照 html 标签编写的顺序依次从上到下,从左到右排列,块元素占一行,行内元素在一行之内从左到右排列,先写的先排列,后写的排在后面,每个盒子都占据自己的位置.2.浮动的概念:所谓的浮动就是指元素脱离文档流,漂浮到文档流的上方,不会占据位置。3.浮动的特性: 阅读全文
posted @ 2020-04-25 17:24 豆皮没有豆 阅读(635) 评论(0) 推荐(0)
HTML+CSS教程(五)外联样式、组选择器、圆角边框、样式优先级、伪类、盒子模型、元素溢出
摘要:一.外联样式 通过link标签引入外部css文件夹中的xxx.css文件到head标签中 例: 二. 1.组选择器 选择器名称1,选择器名称2,选择器名称3,…{属性:属性值;属性;属性值} 例: <!DOCTYPE html> <html> <head> <meta charset="utf-8" 阅读全文
posted @ 2020-04-15 13:37 豆皮没有豆 阅读(539) 评论(0) 推荐(0)
HTML+CSS教程(四)选择器(id选择器,类选择器,标签选择器,子代选择器,后代选择器,组选择器,伪类选择器)/css引入页面的形式(行内样式、内嵌样式、外联样式)
摘要:一.回顾内容 前端的三大组成(三大模块) HTMl(超文本标记语言) 结构层 css(层叠样式表) 表现层:用来美化HTML结构 JS(Java script)(脚本语言) 行为层:提供用户和界面的交互二.CSS(层叠样式表)1. CSS的概念及其介绍CSS 指层叠样式表 (Cascading St 阅读全文
posted @ 2020-04-15 11:39 豆皮没有豆 阅读(1240) 评论(0) 推荐(0)
HTML+CSS教程(三)marquee滚动效果
摘要:一.marquee1.marquee标签的属性scrollHeight:获取对象的滚动高度。scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离。scrollTop:设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离。scrollWidth:获取对象的滚动宽度 阅读全文
posted @ 2020-04-15 11:30 豆皮没有豆 阅读(1168) 评论(0) 推荐(0)
HTML+CSS教程(二)frameset框架和iframe内嵌
摘要:一.框架(frameset)1.用<frameset></frameset>代替了<body></body>2.rows设置行的占页面的百分比;cols设置列的所占百分比;*表示剩余的百分比;frameborder设置框架的边框(取值0/1)0–不显示边框1–在每个页面之间都显示边框;borderc 阅读全文
posted @ 2020-04-15 10:34 豆皮没有豆 阅读(384) 评论(0) 推荐(0)
HTML+CSS教程(一)简介及其基本标签的使用方法
摘要:一.前端HTML(结构):HyPer TEXT Markup LanguageCSS(样式): 样式就是对于结构的一种美化JavaScript(js: 行为/ 提供了用户和界面的交互方式)jQueryJQueryEasyUIBootstrap(响应式的布局)二.HTML简介 HTML文件是由HTML 阅读全文
posted @ 2020-04-15 10:27 豆皮没有豆 阅读(376) 评论(0) 推荐(0)
HTML+CSS教程(十一)补充css中clip:rect用法
摘要:css中有一个属性叫做clip,用于修剪裁剪.配合其属性关键字rect可以实现元素的矩形裁剪效果. top right bottom left 分别指最终裁剪可见区域的上边,右边,下边,左边.而所有的数值都表示位置,且是相对于原始元素的左上角而言的. 经典案例: <!DOCTYPE html> <h 阅读全文
posted @ 2018-12-04 11:22 豆皮没有豆 阅读(296) 评论(0) 推荐(0)
HTML+CSS教程(十)css3(3D属性详解及动画)
摘要:一.3D 转换 1.左手坐标系 :伸出左手,让拇指和食指成“L”形,大拇指向右,食指向上,中指指向前方.这样我们就建立了一个左手坐标系,拇指,食指和中指分别代表X、Y、Z 轴的正方向. 2. CSS 中的 3D 坐标系 CSS3 中的 3D 坐标系与上述的 3D 坐标系是有一定区别的,相当于其绕着 阅读全文
posted @ 2018-11-25 15:23 豆皮没有豆 阅读(339) 评论(0) 推荐(0)
HTML+CSS教程(九)CSS3(2D变换)
摘要:一.2D变换 1.旋转transform:rotate 例: <html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> .wrap{ width: 400px; height: 400px; backgr 阅读全文
posted @ 2018-11-16 17:39 豆皮没有豆 阅读(125) 评论(0) 推荐(0)