前端
前端的基础知识
房东的喵
不要在狼性的年纪选择安逸
展开
-
轮询界面
HTML<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>源计划</title> <link rel="stylesheet" href="css/yjh.css"/> </head> <body> <div class="box1"&g原创 2020-11-27 19:12:20 · 182 阅读 · 0 评论 -
媒体查询
原创 2020-05-03 14:07:16 · 143 阅读 · 0 评论 -
弹性盒
原创 2020-05-03 13:32:09 · 86 阅读 · 0 评论 -
移动端布局
原创 2020-05-02 20:04:41 · 76 阅读 · 0 评论 -
3D练习-3D旋转相册
HTML文件<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title>曲肖冰</title> <link rel="stylesheet" href="css/index.css" /> </head> <bod...原创 2020-05-02 19:51:58 · 252 阅读 · 0 评论 -
CSS3-3D效果
原创 2020-05-02 19:46:41 · 76 阅读 · 0 评论 -
CSS3-2D效果
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> .box {width: 100px;hei...原创 2020-05-02 17:46:15 · 116 阅读 · 0 评论 -
CSS3-新增属性
默认值为border-box<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> .box {wid...原创 2020-05-02 16:33:26 · 478 阅读 · 0 评论 -
CSS3-服务端字体和iconfont
1.搜索阿里巴巴矢量图标库2.选择想要的图标加入购物车3.下载源代码4.放到所写文件夹下5.链接iconfont.css文件6.<i class="iconfont">编号</i><!DOCTYPE html><html> <head> <meta charset="utf-8"&g...原创 2020-05-02 11:15:28 · 247 阅读 · 0 评论 -
CSS3新增选择器-伪类选择器
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> .nav1 li:first-child {backgr...原创 2020-05-01 17:15:37 · 206 阅读 · 0 评论 -
CSS3新增选择器-属性选择器
指定元素<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> img[title] {border:...原创 2020-05-01 12:56:42 · 158 阅读 · 0 评论 -
HTML5新增标签
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> * {margin: 0;padding: 0...原创 2020-05-01 11:37:04 · 217 阅读 · 0 评论 -
表单表格高级
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> form {width: 600px;border...原创 2020-04-30 16:38:49 · 196 阅读 · 0 评论 -
浏览器兼容
原创 2020-04-30 15:59:46 · 70 阅读 · 0 评论 -
宽度自适应
min-height原创 2020-04-30 15:22:21 · 211 阅读 · 0 评论 -
图片整合
原创 2020-04-30 14:56:28 · 108 阅读 · 0 评论 -
定位锚点-锚点链接
锚点链接:是网页制作中超链接的一种,又叫命名锚记。命名锚记像一个迅速定位器一样是一种页面内的超链接,运用相当普遍设置锚点链接地方法:1.给元素定义命名锚记名语法:<标记 id=“命名锚记名“></标记>2.命名锚记链接语法:<a href="#命名锚记名称"></a>...原创 2020-04-30 12:05:52 · 3956 阅读 · 0 评论 -
定位锚点-元素定位设置
position属性:定义建立元素布局所用的定位机制语法:{position:static/absolute/relative/fixed;}说明:static:默认值。没有定位,元素出现在正常的流中(忽略top,bottom,left,right或者z-index声明)absolute:生成绝对定位的元素,相对于static定位以外的第一个父元素进行定位。元素的位置通过“left”,“...原创 2020-04-30 11:20:47 · 1075 阅读 · 0 评论 -
元素类型
1.元素类型根据css显示分类,XHTML元素分为三种类型块状元素、内联元素、可变元素2.块状元素(block element)(1)块状元素在网页中就是以块的形式显示,所谓块状就是元素显示为矩形区域,常用的块状元素包括div、dl、dt、dd、ol、ul、fieldset、(h1-h6)、p、form、hr、iframe、colgroup、col、table、tr、td等(2)默认...原创 2020-04-30 11:19:32 · 997 阅读 · 0 评论 -
文本溢出
1.overflow属性:定义溢出元素内容区的内容会如何处理语法:{overflow:visible/hidden/scroll/inherit;}说明:visible:默认值,内容不会被修剪,会出现在元素框之外hidden:内容会被修改,并且其余内容是不可见的scroll:内容会被修改,但浏览器会显示滚动条,以便查看其余的内容auto:如果内容被修剪,则浏览器会显示滚动条,以便查看...原创 2020-04-29 17:09:00 · 169 阅读 · 0 评论 -
盒模型
1.盒模型的概念如果CSS对HTML文档元素生成一个描述该元素在HTML文档布局中所占空间的矩形元素框(element box),那么我们可以形象的将其看作一个盒子CSS围绕这些盒子产生一种“盒子模型”概念,通过定义一系列与盒子有关的属性(内容、填充、边框、边界),可以控制各个盒子乃至整个HTML文档的表现效果和布局结构虽然CSS中没有盒子这个单独的属性对象,但它却是CSS中无处不在的一...原创 2020-04-29 17:08:30 · 109 阅读 · 0 评论 -
表格
1.表格<table> <tr> <td></td> <td></td> </tr></table>一对tr表示一行,一对td表示一列(一个单元格)相关属性width="表格宽度"height="表格高度"border="表格边框"borde...原创 2020-04-29 17:07:51 · 354 阅读 · 0 评论 -
表单
1.表单域<form name="表单名" method="post/get" action=""></form>get是从服务器上获取数据post是向服务器上传数据出于安全性考虑,建议使用post提交数据2.表单控件文本框:<input type="text" value="默认值"/> (value输入后不会消失 placeholder输...原创 2020-04-29 17:07:22 · 73 阅读 · 0 评论 -
CSS样式
1. 内部样式表语法:<style type="text/clss">/*cass语句*/</style>说明:使用style标记创建样式时,最好将该标记写<head></head>之间例:<!DOCTYPE html><html> <head> <meta ch...原创 2020-04-29 17:06:50 · 121 阅读 · 0 评论 -
CSS核心属性-文本属性
1.文本类属性css语法css语法由两部分组成:选择符、声明语法:选择符{属性:属性值;属性:属性值;}font-family:字体类型语法:{font-family:字体1,字体2,字体3;}说明:浏览器首先会寻找字体1.如果存在就是用改字体来显示内容,如在字体1不存在的情况下,则会寻找字体2,如字体2也不存在,按字体3显示内容,如字体3也不存在,则会按系统默认字体显示。当...原创 2020-04-29 17:06:14 · 104 阅读 · 0 评论 -
CSS核心属性-列表属性
列表属性:语法:{list-style-type: circle(空心圆)/disc(实心圆)/square(实心方块)/none(去掉列表符号);}说明:定义列表符号样式语法:{list-type-image:url(所使用图片的路径以及全称);}说明:使用图片作为列表符号语法:{list=type=position:outside(外边)/inside(里边);}说...原创 2020-04-29 17:05:43 · 181 阅读 · 0 评论 -
CSS核心属性-浮动属性
float:定义网页中其他文本如何环绕该元素语法:{float:left/right/none;}说明:left:元素活动浮动在文本左面right:元素浮动在右面none:默认值,不浮动特点:1.DIV块元素失去“块状”换行显示特征,变为行内元素2.紧贴上一个浮动元素(同方向)或父级元素得边框。如宽度不够将换行显示3.占据行内元素的空间,导致行内元素围绕显示例:<!...原创 2020-04-29 17:05:02 · 124 阅读 · 0 评论 -
CSS核心属性-背景属性
背景属性:background-color:背景颜色语法:{backeground-color:颜色值;} background-image:背景图片的设置语法:{background-image:url(背景图片的路径及全称);}说明:网页上有两种图片形式:插入图片、背景图插入图片:属于网页内容,也就是结构背景图:属于网页的表现,背景图上可以显示文字、插入图片、表格等容...原创 2020-04-29 17:04:27 · 181 阅读 · 0 评论 -
CSS常用选择符和权重
1.css语法css语法由两部分组成:选择符、声明语法:选择符{属性:属性值;属性:属性值;}说明:(1)每个css样式由两部分组成,即选择符和声明,声明又分为属性和属性值(2)属性必须放在花括号中,属性与属性值用冒号链接(3)每条声明用分号结束(4)当一个属性有多个属性值得时候,属性值与属性值不分先后顺序(5)在书写样式过程中,空格、换行等操作不影响属性显示。例:<...原创 2020-04-29 17:02:36 · 537 阅读 · 0 评论 -
HTML基础
1.如何使用程序点击桌面建立英文名称的文件夹—》将文件夹移入程序内—》文件夹下建立以.html结尾的文件-》编写代码-》运行调试-》打开在浏览器中(Ctrl+F1)2.格式注意缩进<!doctype html><html><head><meta charset="utf-8"></head><body>...原创 2020-04-25 20:37:39 · 95 阅读 · 0 评论