吾爱乐享
个人学习网站

php学习之css小结1

css:”cascading style sheets”的缩写,层叠样式表,作用:给html标记加样式。

css语法规则:

由“选择器”和“声明”组成

  • 选择器:html标记、class、id、通配符、复合、伪类
  • 声明:由大括号括起来,每个声明用“;”结束,声明由属性和值组成,如:div{color:red;}

引用方式:如何让html和css连接

  1. 内嵌式:当做html的标记来使用,写入到head中。如:<style type=”text/css”>具体的样式</style>
  2. 行内样式:当做html标记的属性来使用,不需要选择器和大括号。如:<h1 style=”color:red;”></h1>
  3. 外链式:把css样式写入到一个css文件中,用link标记引入css文件。比如:<link rel=”stylesheet” type=”text/css” href=”./xxx.css”>
  4. @impost:可以在css文件中再次引入另一个css文件。如:@impost url(./xxx.css);

选择器:

  1. 标准选择器:class(给标记加calss属性)、id(给标记加id属性)、标记、通配符(*)
  2. 复合选择器:多元素(把多个元素用逗号隔开)、后代(找当前标记中嵌套进来的标记—–没有代的限制)、子类(有代的限制,只能有一代)
  3. 伪类:一般都是加在超链接的样式,只有超链接有4种状态
    • 默认:link
    • 放上:hover
    • 点击:active
    • 访问后:visited

基本属性:

  • 字体:font-size(大小)、font-family(什么字体)、font-style(斜体,值为italic)、font-weight(bold加粗)
  • 文本:color(颜色)、text-align(文本水平对齐方式left,center,rgiht)、text-indent(首行缩进)、text-decoration(文本修饰符underline(上)、overline(下划线)、line-through(删除线)、none(无))、line-height(和高设置成一样,目的是文本上下剧中)
  • 尺寸:width、height
  • 背景:background-color(颜色)、background-image(图片)、background-position(定位,九宫格,像素,百分比)、background-repeat(平铺方式:no-repeat、repeat-x、repeat-y)background-attachment(固定fixed)
  • 背景简写:background:颜色 图片 平铺方式 定位 固定。如:background:#ccc url(./xxx.jpg) no-regeat left top fixed;
  • 列表:list-style-type:none、list-style-image:url、list-style-position:inside/outside(在内或在外)
赞(0) 打赏
未经允许不得转载:吾爱乐享 » php学习之css小结1

评论 抢沙发

评论前必须登录!

 

推荐免费资源共享,个人经验总结学习

联系我们联系我们

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏