TypechoJoeTheme

Mr.Jiang || 小龙的个人博客

搜索到 7 篇与 前端学习 的结果
2020-12-17

重学前端 CSS简写、元素的类型、布局中的定位、以及语义化标签

重学前端 CSS简写、元素的类型、布局中的定位、以及语义化标签
CSS简写1.backgroundbackground-color /* 背景色 */ background-image /* 背景图片 */ background-repeat /* 背景图平铺方式 */ 简写 背景色 背景图片 平铺方式 background: gray url(xxx/xx.png) no-repeat; background: url(xxx/xx.png) repeat-y; background: gray;2.borderborder-width /* 边框宽度 */ border-color /* 边框颜色 */ border-style /* 边框样式 */ 简写 边框宽度 边框样式 边框颜色 border: 1px solid #ccc; border: 1px dashed; /*颜色默认为黑色*/3.fontfont-style: italic; /* 斜体 */ font-weight: bold; /* 加粗 */ font-family: arial,sans-serif; ...
2020年12月17日
140 阅读
0 评论
2020-12-15

重学前端 元素浮动与盒子模型

重学前端 元素浮动与盒子模型
一、元素浮动float: left; float: right;知识点:浮动元素在排列时,参考前一个元素的位置即可,(如果最后一个浮动元素空间不够,换行到下一行,不会出现在第一个,会在自己的前一个元素的位置)。右浮动的顺序问题,第一个元素会到最右边,跟左浮动时顺序颠倒。浮动元素的重叠问题3.1 浮动元素不会覆盖文字内容 3.2 浮动元素不会覆盖图片内容(因为图片本身也属于文本,可以把图片看做时一个特殊的文字) 3.3 浮动元素不会覆盖表单元素(输入框、单选按钮、复选框、按钮、下拉选择框等等)清除浮动4.1 给浮动元素一个父元素,设置高度或者添加 overflow: auto; [自动设置高度,防止因子元素浮动而高度塌陷] 4.2 或者给它添加clear: both;样式. [clear:left/right/both 清除浮动样式 左/右/两者] 二、盒子模型padding 填充 margin 外边距。设置padding或margin都会把盒子撑大。
2020年12月15日
93 阅读
0 评论
2020-12-13

重学前端第六天 学习CSS

重学前端第六天 学习CSS
一、布局与选择器[#box] ID选择器:id表示身份,在页面中元素的id不允许重复,因此id选择器只能选择单个元素[.nav] 类(别)选择器:选择拥有该类别的多个元素[div] 标签选择器:根据标签名称,选择对应的所有标签[*]通用选择器,针对页面上所有的标签都生效二、样式表层叠在实际网页开发中,作用于同一个元素上的多个样式产生冲突的情况,不可避免的经常发生,当多个样式发生重叠时,优先级别高的样式会生效。因此得名:层叠样式表 简称csscss优先级行业样式>ID选择器>类选择器>标签选择器>通用选择器当样式发生冲突时,谁的权重值高,谁就生效2.1 通用选择器 * 权重值 0 2.2 标签(元素)选择器 div p... 权重值 1 2.3 类(别)选择器 .nav 权重值 10 2.4 ID选择器 #btn 权重值 100 2.5 行内样式 权重值 1000 示例:100 1 10 100 10 #box p .tt > #box .tt选择器选择的范围越小越精确优先级就越高三、css文本属性.p1{color:red;} /*...
2020年12月13日
94 阅读
0 评论
2020-12-10

重学前端第三天 表单和容器的作用

重学前端第三天 表单和容器的作用
一、表单<form action=""> action=表单数据提交的地址 form必须有action属性,表示提交地址。所有需要提交的数据,input必须有name属性input按钮的文字,使用value属性表示input必须放在form标签内才能提交get请求通常表示获取数据,post请求通常表示提交数据。get请求发送的数据都写在地址栏上,用户可见。post请求发送的数据用户不可见(提交之前F12,找到Network-All-Headers里面的FormData可以查看)。get请求不能提交大量数据(比如图片、视频、文章),但post可以,因此不要混用。二、容器的作用span,一个容器标签,不具备任何特殊功能,仅当作容器来使用。用于包裹一段文本,便于给文本增加样式。div,一个通用的容器标签,不具备任何特殊功能,仅当作容器来使用,可以包裹任何内容,也可以容器直接互相包裹。三、CSStext-align: center; 让内部元素水平居中。margin: auto; 让元素本身水平居中(需要设置宽度)。2.1 margin: auto;和ma...
2020年12月10日
161 阅读
0 评论
2020-12-09

重学前端第二天 知识点记录

重学前端第二天 知识点记录
1、图片图片在网页上的呈现顺序是从左到右,且以底部对齐的,当这一行的空间不足以摆放剩下的图片时候,图片就会折行显示<!-- img标签title和alt释义 --><img src="" title="鼠标划上去的提示" alt="图片加载失败后显示的文字"><!-- 完整地址叫绝对路径 --><img src="http://1000phone.com/html5/logo.png"> <!-- 相对路径 --><a href="pages/articles/xiaoshuo.html"></a> 2、超链接未使用target="_blank" 只在当前页面打开示例:<a href="https://www.baidu.com">百度一下,你就知道</a>使用target="_blank"示例:<a target="_blank"...
2020年12月09日
150 阅读
0 评论
2020-12-08

重学前端第一天

重学前端第一天
在大学里面学了的专业知识,现在有点不够用了,趁着现在有时间,重新温习下,就当巩固知识了,很多都已经学过了,重新学还得耐得住寂寞,因为很多东西已经学过,再学一次就觉得很枯燥无味,但就怕漏掉什么,还是得好好看好好学。bilibili视频链接:https://www.bilibili.com/video/BV17z4y1D7Yj<!-- 标题标签 1级标题到6级标题 --> <h1></h1> <h2></h2> <h3></h3> <h4></h4> <h5></h5> <h6></h6> <p></p><!-- 段落标签 文字也会独占一行 --> <i></i><!-- 文字会出现斜体效果 --> <b></b><!-- 文字会出现加粗效果 --> <!-- 单标签 --> <br><!-...
2020年12月08日
123 阅读
0 评论