css基础1

css:层叠样式表,有叫级联样式表。
css分为内联方式,内部样式,外部样式。
内联方式:只需要将分号隔开的一个或者多个属性/值对作为元素的style属性的值。
属性和属性值之间用:连接。
多对属性之间用;隔开。
内部样式:样式规则位于文本档头元素中的<style>元素内,在文本档的<head>元素内添加<style>元素,在<style>元素中添加样式规则。
每个样式规则有两个部分:选择器和样式声明。
外部样式:创建一个单独的样式表文件用来保存样式规则,1.一个纯文本,文件后缀为.css,文件中只能包含样式规则,样式规则由选择器和样式声明组成。
在文档的<head>元素中添加<link>元素。
<link rel="stylesheet" type="text/css" href="myStyle.css">
css样式的表现特征:
继承性:大多数css的样式规则可以被继承。
层叠性:可以定义多个样式,不冲突时,多个样式表中的样式可以层叠问为一个。
优先级:样式定义冲突时,按照不同样式规则的优先级来应用样式。
内联样式>外部样式或者内部样式(就近原则)
!important可以调整样式规则的优先级。将其加在样式规则之后,中间用空格隔开,-选择器{属性:属性值 !important;}
选择器:
通用选择器*,可以与任何元素匹配。常用于设置一些默认的样式,比如说设置整个文档的文本 的默认字体和大小。
元素选择器:
html文档的元素就是选择器。
类选择器:
语法:.classname{color:red;}。类名称不能以数字开头。
可以将多个类选择器应用于同一个元素。
id选择器:
以一种独立于文档元素的方式来指定样式,它仅作用于id的属性的值。语法:选择器前面需要有一个#号。选择器本身则为文档中某个 元素的id属性的值。
群组选择器:
选择器声明为以逗号隔开的选择器列表。
后代选择器:-选择器一端包含两个或多个 用空格分隔的选择器。
子代选择器:只有在<div>的子元素<span>元素中的文本使用该样式。
伪类选择器:使用冒号作为结合符。伪类选择器,顺序不能打乱.
分为:链接伪类,动态伪类,目标伪类,元素状态伪类,结构伪类,否定伪类。
链接伪类:link适用于尚未访问的链接。visited适用于访问过的链接。
动态链接,用于呈现用户操作:hover用于鼠标悬停在html元素时。:active适用于html元素被激活时。:focus适用于html元素获取焦点时。
选择器的优先级:元素选择器<类选择器<伪类选择器<id选择器<内联样式
overflow处理溢出,hidden表示隐藏超出,scroll内容溢出表示滚动条,auto超出自动显示滚动,不超出不显示,visible默认属性.
transparent表示透明的,可以设置边框颜色,只是不显示边框.
大于半径默认取半径.
可以设置的为块标签img,table,行标签要转化为块标签才可设置,结构化的签:header,footer,nav,aside,session
边框倒角border-radius属性:
border-top/bottom-left/right-radius边框左/右上/下角。
边框阴影box-shadow,想方框添加一个或多个阴影,取值为多个属性列表.
h-shadow,必需,为水平阴影的位置,v-shadow,必需,为垂直阴影位置,(可选:blur,为模糊距离,spread,为阴影尺寸,color为颜色,inset,可将外部阴影outset改为内部阴影)。
box-shadow:h-shadow v-shadow blur spread color inset;
border-image属性,将图片规定为包围div元素的边框,source图片路径,width图片边框的宽度,图片边框是否应平铺repeat,铺满round,拉伸stretch
border-image:source width repeat;
轮廓outline是绘制于元素周围的一条线,位于边框边缘的外围,可起到突出的作用。
outline:color style width;
input{outline:0;}

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 204,684评论 6 478
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 87,143评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 151,214评论 0 337
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,788评论 1 277
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,796评论 5 368
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,665评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,027评论 3 399
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,679评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 41,346评论 1 299
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,664评论 2 321
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,766评论 1 331
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,412评论 4 321
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,015评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,974评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,203评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 45,073评论 2 350
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,501评论 2 343

推荐阅读更多精彩内容

  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,727评论 1 92
  • 学习CSS的最佳网站没有之一 http://www.w3school.com.cn/tags/index.asp ...
    Amyyy_阅读 1,027评论 0 1
  • 选择qi:是表达式 标签选择器 类选择器 属性选择器 继承属性: color,font,text-align,li...
    wzhiq896阅读 1,730评论 0 2
  • 选择qi:是表达式 标签选择器 类选择器 属性选择器 继承属性: color,font,text-align,li...
    love2013阅读 2,303评论 0 11
  • 十年 应该是一件比较值得纪念的事 毕竟 一辈子的十年屈指可数 还记得07年9月1日 火车与轨道的磕磕绊绊 也还记得...
    晨子78阅读 140评论 0 0