CSS教程
记录学习css
playboy-jordan
磨炼灵魂,提升心智
展开
-
CSS学习之CSS的概念、作用和申明
1、为什么需要css问题1、HTML的作用是负责数据的格式化的展示的。如果使用HTML来进行数据的样式,则发现样式书写起来太过于麻烦,不易于维护。不能够重复的使用问题2、HTML可以有效的组织数据的展示,但是不同类型数据在浏览器中的分布没有办法实现。为了上面的问题:诞生了CSS语言,专门用来给网页进行样式开发。2、 什么是csscss的概念:层叠样式表作用:给网页进行样式的开发。给网页进行布局。特点:语言特别简单开发的样式可以重复使用依赖于HTML3、使用csscss原创 2020-06-14 19:10:51 · 539 阅读 · 0 评论 -
CSS学习之选择器学习
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>css的选择器学习</title> <!-- css的选择器学习: 标签选择器: 标签名{样式名1:样式值1;……} 作用:会将当前网页内的所有该标签增加相同的样式 id选择器: #标签的id属性值{样式名1:样式值1;……} 作用:给某原创 2020-06-15 22:31:09 · 159 阅读 · 0 评论 -
CSS学习之样式使用
<html> <head> <title>css的样式使用</title> <meta charset="UTF-8"/> <!--声明css代码域--> <style type="text/css"> /*添加网页背景图*/ body{ background-image: url(img/a1.jpg);/*添加背景图片*/ background-repeat: no-repe原创 2020-06-15 23:17:10 · 126 阅读 · 0 评论 -
CSS学习之照片墙案例
<html> <head> <title>照片墙案例</title> <meta charset="UTF-8"/> <!--声明css代码域--> <style type="text/css"> /*设置body样式*/ body{ text-align: center; background-color: gray; } /*设置图片样式*/ img{原创 2020-06-15 23:19:35 · 139 阅读 · 0 评论 -
CSS学习之盒子模型学习
<html> <head> <title>css的盒子模型学习</title> <meta charset="UTF-8"/> <!-- css的盒子模型学习: div标签: 块级标签,主要是用来进行网页布局的,会将其中的子元素内容作为一个独立的整体存在。 特点: 默认宽度是页面的宽度,但是可以设置。 高度默认是没有的,但是可以设置。(可以顶开) 如果子元素设原创 2020-06-17 20:37:29 · 259 阅读 · 0 评论 -
CSS学习之盒子模型简单的布局
<html> <head> <title>盒子模型简单的布局</title> <meta charset="UTF-8"/> <style type="text/css"> /*设置div的基础样式*/ div{ width: 300px; height: 300px; } /*设置header和footer的样式*/ #header,#footer{ width: 650原创 2020-06-17 20:42:01 · 163 阅读 · 0 评论 -
CSS学习之定位
<html> <head> <title>css的定位</title> <meta charset="UTF-8"/> <!-- css的定位学习: position 相对定位:relative 作用:相对元素原有位置移动指定的距离(相对的自己的原有位置) 可以使用top,left,right,bottom来进行设置。 注意: 其他元素的位置是不改变的。原创 2020-06-17 20:47:05 · 114 阅读 · 0 评论 -
CSS学习之模仿百度首页
<html> <head> <title>百度首页模拟</title> <meta charset="UTF-8"/> <!-- 模拟百度首页: 1、首页使用css+div进行页面的布局 css代码一般使用外联方式进行开发 2、使用HTML进行每一个块中的内容填充 --> <!--引入外部声明的css文件--> <link rel="stylesheet"原创 2020-06-18 23:00:21 · 661 阅读 · 0 评论