
前端
听友
这个作者很懒,什么都没留下…
展开
-
前端学习(15)相对定位、绝对定位、固定定位、z-index
相对定位:position:relative;top:100px;left:100px;right:100px;botton-100px;相对于原来的位置,进行指定的偏移,相对定位的话,它仍然在标准文档流中,原来的位置会被保留。绝对定位:基于xxx定位,上下左右~没有父级元素定位的前提下,相对于浏览器定位假设父级元素存在定位,我们通常会相对于父级元素进行偏移在父级元素范围内移动相对于父级或浏览器的位置,进行指定的偏移,绝对定位的话,它不在标准文档流中,原来的位置不会被保.原创 2020-07-05 21:21:01 · 245 阅读 · 0 评论 -
前端学习(14)解决父级边框塌陷的问题
clearclear:right; 右侧不允许有浮动元素clear:left; 左侧不允许有浮动元素clear:both; 两侧不允许有浮动的元素clear:none; 解决方案:增加父级元素的高度#father{ border:1px #000 solid; height:800px;}增加一个空的div标签,清除浮动<div class="clear"></div>.clear{ clear:both; margin:0; paddi原创 2020-07-05 19:09:14 · 2144 阅读 · 0 评论 -
前端学习(13)超链接伪类
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><style> /*默认的颜色*/ a{ text-decoration: none; color: aqua; } /*鼠标悬浮的颜色*/ a原创 2020-07-05 17:09:33 · 2464 阅读 · 0 评论 -
前端学习(12)文本样式
颜色:color、rgb、rgba文本对齐的方式:text-align=center首行缩进:text-indent:2em行高:line-height超链接去下划线:text-decoration:none原创 2020-07-05 16:25:22 · 201 阅读 · 0 评论 -
前端学习(11)选择器(基本、层次、结构伪类、属性)
选择器作用:选择页面上的某一个或者某一类元素基本选择器标签选择器:选择一类标签: 标签{}类选择器 class:选择所有class属性一致的标签,跨标签: .类名{]Id选择器:全局唯一! #id名{}优先级:id > class > 标签层次选择器后代选择器子选择器相邻兄弟选择器通用兄弟选择器<!DOCTYPE html><html lang="en"><head> <meta charset="UTF原创 2020-07-05 15:55:31 · 208 阅读 · 0 评论 -
前端学习(10)CSS
四种CSS导入方式:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <!--内部样式--> <style> h1{ color: green; } </style> <!原创 2020-07-05 14:12:44 · 111 阅读 · 0 评论 -
前端学习(9)搜索框滑块和简单验证
<!--邮箱验证--><p> 邮箱: <input type="email" name="email"></p><!--URL--><p> URL: <input type="url" name="url"></p><!--数字--><p> 数字: <input type="number" name="num" max="原创 2020-07-04 23:22:40 · 202 阅读 · 0 评论 -
前端学习(8)下拉框、文本域、文件域
<!--下拉框--> <p> 国家: <select name="列表名称"> <option value="china">中国</option> <option value="us">美国</option> <option value="eth">瑞士</option> ...原创 2020-07-04 23:04:00 · 2579 阅读 · 0 评论 -
前端学习(7)文本框、单选框、多选框
表单元素格式属性1说明type指定元素的类型。text、password、checkbox、radio、submit、reset、file、hidden、image和button,默认为textname指定表单元素的名称value元素的初始值。type为radio时必须指定一个值size指定表单元素的初始宽度。当type为text或password时,表单元素的大小以字符为单位。对于其他类型,宽度以像素为单位maxlengthtype为text或pas原创 2020-07-04 22:30:43 · 1554 阅读 · 0 评论 -
前端学习(6)iframe内联框架
<body><!--iframe内联框架 src:地址 w-h:宽度高度--><iframe src="https://www.baidu.com" frameborder="0" width="1000px" height="800px"></iframe></body>原创 2020-07-04 21:46:35 · 541 阅读 · 0 评论 -
前端学习(5)页面结构分析
元素名描述header标记头部区域的内容(用于页面或页面中的一块区域)footer标记脚部区域的内容(用于整个页面或页面的一块区域)sectionweb页面中的一块独立区域acticle独立的文章内容aside相关内容或应用(常用于侧边栏)nav导航类辅助内容header、footer、nav重要,其他了解即可。...原创 2020-07-04 21:35:55 · 300 阅读 · 0 评论 -
前端学习(4)媒体元素
<!--音频和视频 src:资源路径 controls:控制条 autoplay:自动播放 --> <video src="" controls autoplay></video> <audio src="" controls autoplay></audio>原创 2020-07-04 21:24:52 · 177 阅读 · 0 评论 -
前端学习(3)表格
<!--表格table 行tr,列td--> <table border="1px"> <tr> <!--colspan跨列--> <td colspan="4">1-1</td> </tr> <tr> <!--rowspan跨行--> &l...原创 2020-07-04 21:20:11 · 133 阅读 · 0 评论 -
前端学习(2)列表
块元素:无论内容多少,该元素独占一行(p、h1-h6)行内元素:内容撑开宽度,左右都是行内元素的可以排在一起(a、strong、em)<!--有序列表--> <ol> <li>Java</li> <li>Python</li> <li>前端</li> <li>运维</li> <li>C原创 2020-07-04 21:11:19 · 142 阅读 · 0 评论 -
前端学习(1):HTML标签
开一个前端学习的头,虽然已经开始工作了,知道学习的时间不会像以前一样那么多,但还是要挤出时间学习,事在人为!加油!网页基本标签:<!DOCTYPE html><html lang="en"><head> <!--描述--> <meta charset="UTF-8"> <!--标题标签--> <title>Title</title></head><body&原创 2020-07-04 20:59:18 · 206 阅读 · 0 评论