前端(HTML、css)
hello~bye~
这个作者很懒,什么都没留下…
展开
-
JavaScript基础
1、原样输出标签的内容:<:<>:>2、单行注释//(ctrl+/)多行注释(ctrl+shift+/)/**/3、JavaScript中基本数据类型有个特殊的数据类型 null空 undefined未声明复合数据类型:声明变量:var xxxx=xxx,可以一次性声明多个变量如:var name = "",age = 18,sex = "";变量赋值:xxx = 18标识符:用户自定义的所有名字都叫做标识符规律:必须由..原创 2020-11-19 20:18:20 · 242 阅读 · 0 评论 -
CSS_属性简写
background:gray url() no-repeat/repeat-y;border:1px solid #333;font:字体样式 加粗 字号大小/行高 默认字体,备用字体,备用字体,备用字体。。。margin/padding:上 右 下 左/上 左右 下/上下 左右/上下左右...原创 2020-11-18 16:35:32 · 76 阅读 · 0 评论 -
CSS_边距填充
边距:元素与元素之间的距离。(无法靠近)填充:指向一个元素的内部,增加空间,(内边距),与外边距不同,填充会改变元素的大小。随着填充的增加,元素会被撑大。示例:<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> * { margin: 0; /*将原创 2020-11-18 16:09:12 · 496 阅读 · 0 评论 -
CSS_浮动注意的问题
浮动元素会脱离文档,与其他元素发生重叠,但不会与文字内容分发生重叠。所以利用浮动可以做文字环绕效果。原创 2020-11-18 11:24:47 · 131 阅读 · 0 评论 -
CSS_浮动排版布局
当在排版布局时,abc都用了float,此时abc相当于脱离父元素浮出来了,但是d没有使用浮动,就会出现d的一部分处在abc的下面(因为abc浮上去了),d就被遮住了一部分,这时候有几种处理方法:(1)在abc的外层加上一层父元素,并设定高度<!DOCTYPE html><html lang="en"><head> <style type="text/css"> .outer{ height: 100px;原创 2020-11-18 10:52:14 · 1323 阅读 · 0 评论 -
CSS_文字环绕效果_float
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>浮动演示</title> <style type="text/css"> .fudo.原创 2020-11-18 09:56:29 · 875 阅读 · 0 评论 -
CSS_背景图的使用
1、在body设置属性为height:100%时其实不能是100%的,因为这个高度是相对于父元素,body的父元素为html标签,这时候可以设置:html,body{height:100%}2、background-image:url();background-repeat:no-repeat;background-position:左右 上下;...原创 2020-11-17 17:35:39 · 193 阅读 · 0 评论 -
CSS_文本的属性
color:文本颜色font-family:字体font-size:字体大小font-weight:bold;文字加粗font-style:italic;斜体text-indent:60px;首行缩进text-align:center;水平对齐方式line-height:100px;行高text-decoration:underline/none;如果想要段落的一行高一点,但是文字又垂直居中显示,可以尝试下面的代码:{height:100px;line-hei原创 2020-11-17 17:18:47 · 97 阅读 · 0 评论 -
图片格式
gif:支持动画,只有全透明和不透明两种模式,只有256种颜色。jpg:才有有损压缩算法,体积较小。不支持透明,不支持动画png:采用无损压缩算法,体积相对较小,支持背景透明,不支持动画。svg:怎么放大都不会失真,通常用于保存颜色形状相对简单的形状。...原创 2020-11-17 15:15:29 · 71 阅读 · 0 评论 -
HTML_导航
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>样式学习</title> <style> #navigator{ .原创 2020-11-17 14:32:14 · 949 阅读 · 0 评论 -
HTML_表单
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>表单测试</title></head><body> <!--常见的input标.原创 2020-11-17 10:23:52 · 86 阅读 · 0 评论 -
HTML_标签的嵌套
超链接不能嵌套超链接p标签不能嵌套p标签标题标签h1-6不能相互嵌套原创 2020-11-17 09:37:20 · 155 阅读 · 0 评论 -
HTML5_表格
<html> <head> <meta charset = "utf-8"> <title>表格测试</title> </head> <body> <h3>这是一个表格</h3> <table border = "1px" cellspacing = "0px"> <!-.原创 2020-11-17 09:35:44 · 160 阅读 · 0 评论 -
改变li列表中的某一项
改变ul下面的li中显示的单个 ul li:first-child{}//改变第一个项; ul li:last-child{}//改变最后一个项; ul li:nth-child(n)//改变第n项;...原创 2018-07-17 09:56:57 · 293 阅读 · 0 评论 -
css显示全屏背景图片
css设置全屏背景图片 *{ margin: 0; padding: 0; } html,body{ width: 100%; height: 100%; } ...原创 2018-07-17 09:54:21 · 6003 阅读 · 0 评论 -
精灵图
把多个小图标放在一张图片上,减少浏览器加载图片的时间,通过代码控制显示哪一个小图标 方法一: <head> <meta charset="UTF-8"> <title></title> <style> .box{ ...原创 2018-07-17 09:41:56 · 167 阅读 · 0 评论