A股上市公司传智教育(股票代码 003032)旗下技术交流社区北京昌平校区

 找回密码
 加入黑马

QQ登录

只需一步,快速开始

© ljp123 初级黑马   /  2020-2-28 18:39  /  1363 人查看  /  19 人回复  /   0 人收藏 转载请遵从CC协议 禁止商业使用本文

整理关于CSS笔记
关于CSS作用:A.快速维护页面元素的样式属性
B.弥补HTML元素的属性不足
CSS又被称作层叠样式表。
关于CSS的元素属性:
一:
首先是长度单位:A.宽度、高度用px(像素),也可以用%(百分比)。建议使用固定值:width:200px;height:200px;
B.字体大小用pt(磅)表示
其次就是颜色单位:A.颜色的直译英文名称,如:red(红)、green(绿)、blue(蓝).....
B.十六进制表示法:#ff0000
C.简写十六进制:#f00
D.RGB表示法:rgb(255,0,0)
E.百分比RGB:rgb(100%,0%,0%)
二:
1.宽度和高度:
大部分元素都会用到这两个属性-------> width(设置宽度)、height(设置高度)
例:width:200px;height:200px;
2.边框:
border属性,设置边框的宽度、线性、颜色都有线性这个属性,我们最多用到的无疑就是在和中了。
表格(table)和盒子(div)因为看不到它的大小,我们一般都会用border设置显示出边框线
例:border:2px solid red;
这样我们可以看到一个2个像素的红色实线出现在你的表格中。这样就可以清晰的看到表格样式了。
在border中还可以给上下左右单独设置边框线:
border-top:宽度 线型 颜色;border-bottom:宽度 线型 颜色;
border-right:宽度 线型 颜色;border-left:宽度 线型 颜色;
线性我们有三种:none(无)|solid(实线)|dotted(点划线)
3.内边距
就是设置表格或者盒子内的边距,可以设置单独上下左右和边框相同,这里不列举。
例:padding-top:5px;上侧内边距
padding:5px;四个方向的内边距都是5px
padding:5px(上) 5px(左右) 5px(下);
padding:5px(上) 5px(右) 5px(下) 5px(左);
4.外边距
设置外部的边距,可单独设置上下左右。
例:margin-top:5px;上侧外边距
margin:0 auto;(让外编剧为0,auto为网页自动计算居中)
margin:5px(上下) 5px(左右);
margin:5px(上) 5px(左右) 5px(下);
margin:5px(上) 5px(右) 5px(下) 5px(左);
5.控制元素的显示方式属性
可以控制元素不显示,或者以什么方式显示出来。如果不显示在此元素style中加入即可:
例:dispaly:none(不显示)|inline(内联对象)|block(块级对象);
HTML的标记种类为----->内联对象:不能自然换行
块级对象:可以自然换行
这是我自己的小小总结,欢迎大家提出不同看法和建议。

19 个回复

正序浏览
学习要加,骄傲要减,机会要乘,懒惰要除。诶,激励自己的名言,希望对你有用
回复 使用道具 举报
选择了,便走下去。
回复 使用道具 举报
只要朝着一个方向努力,一切都会变得得心应手。加油
回复 使用道具 举报
天天学习,每日进步
回复 使用道具 举报
少壮不努力,老大徒伤悲
回复 使用道具 举报


奋斗吧,,,,,,,,,
回复 使用道具 举报

奋斗吧,,,,,,,,,
回复 使用道具 举报
加油,,加油,,,,
回复 使用道具 举报
奋斗奋斗,,,,,,,,,,,,,,
回复 使用道具 举报
大佬很优秀呀,,,,,,,,,,,,,,,,,,,
回复 使用道具 举报
好好学习呀,,,,,,
回复 使用道具 举报

加油,,,你是最棒的,,,,
回复 使用道具 举报
加油,,,你是最棒的,,,,
回复 使用道具 举报
奋斗奋斗,,,,,,,,,,,,,,,,,,,,
回复 使用道具 举报
学习学习,,,,,,,,,,,,,,,,
回复 使用道具 举报
加油加油,,,,,,,,,,,,,,,,,,,
回复 使用道具 举报

你很优秀哟,
回复 使用道具 举报
你很优秀哟,,加油,,,,,,,,,,,,,,,,,,,,,
回复 使用道具 举报
我爱学习,学习是我的动力,,,,,,,,,,,,,,,,,,,,,,,,,,,,
回复 使用道具 举报
您需要登录后才可以回帖 登录 | 加入黑马