css

认识css:

指层叠样式表,控制页面布局和样式。

html和css的关系:

html结构层 负责从语义的角度搭建页面结构

css样式表 辅助从审美的角度美化页面

javascript行为层 负责从交互的角度提升用户体验

id name  style = 样式名称代表

行内标签

h1 style=“ color:red;font-size:12px;”

内嵌样式

head

style type=“text/css”

p{color=green;

font-szie=12px;

background=black;

/head

外联样式:

link rel=“stylesheet” href=“css/main.css”

@import url(css/mian.css)

选择符{属性:值;}

id在style设置属性时在前面加“#”号,可以用字母,数字,下划线

#p1 {font-size:20px}

id="p1"

类选择器class,在类前面加“.”,

.web{font-size:20px}

p calss=“web”

复合选择器:

h1.p2{font-size:20px;}

说明是在《h1 class=“p2”》不可以选择到《h1》标签里

后代选择器:

.box li{}----(首先找到calss的box标签 然后找到里面的li标签)

复合选择器:

h1,p1,p2,{属性值}

子元素选择器:

h1>p{}----(找到h1标签里的p标签给予属性,剩余其余标签不被选中)

属性选择器:

h1[id][clss]{}---(h1标签里有id 和class都可以实行属性)

css伪类:

:link:应用于没被访问过的链接

:hover:鼠标到某个位置会有方块反应

:active:鼠标点击链接时产生的效果

:visited:应用在访问过的网站

:focus:应用于有键盘输入焦点的元素

css伪元素:

:first-line:一行显示效果。

:first-letter:第一个显示效果

:first-child:选择属于第一个子元素的元素

:before,after:属性前后加上效果

css层叠性(最终属性为准)和继承性(子承父业)

css优先级:

*标签>body标签

标签级>*>body

clss类选择器>标签级

id>class

style行内>id选择器

width:宽度

height:高度

color:前景色

backcolor:背景色

font-size:字体大小

*:通配符=代表页面中所有标签的属性

margin:外边距

padding:内边距

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,801评论 1 92
  • CSS基础 本文包括CSS基础知识选择器(重要!!!)继承、特殊性、层叠、重要性CSS格式化排版单位和值盒模型浮动...
    廖少少阅读 3,181评论 0 40
  • 本课来自http://www.imooc.com/learn/9请不要用作商业用途。 HTML5 HTML介绍 H...
    PYLON阅读 3,318评论 0 5
  • 学习CSS的最佳网站没有之一 http://www.w3school.com.cn/tags/index.asp ...
    Amyyy_阅读 1,094评论 0 1
  • 转载请声明 原文链接地址 关注公众号获取更多资讯 第一部分 HTML 第一章 职业规划和前景 职业方向规划定位...
    前端进阶之旅阅读 16,621评论 32 459