CSS3常见效果CSS3中对样式进行了进一步的优化,此处显示部分开发中常见的效果圆角效果控制盒子的四个角的弧度语法:border-radius控制的是元素的四个角的弧度,当弧度值大于或等于元素宽高的一半时,元素会变成一个圆<style type="text/css"> #box1{ width: 200px; height: 200px;
定位浮动更多的用于对模块化(无具体像素值要求)区域进行整体排版,对于精确到像素值的页面调整需要使用定位,例如:购物车上的数量、消息通知等属性名描述position:relative;相对定位(相对默认位置进行定位,不脱离文档流,仍占据页面位置)position:absolute;绝对定位(相对第一个带有定位属性的父元素进行定位,默认是浏览器)position:fixed;相对浏览器进行固定定位相对
浮动浮动是改变元素在文档流(元素默认从上往下布局的方式就叫文档流)中的规则,让元素可以在水平方向上进行排版float:left/right<head> <style type="text/css"> img { float:left; } </style&g
CSS盒子模型课程目标1.常用样式2.盒子模型3.CSS3常见效果盒子模型介绍引用百度百科层叠样式表其实就是对静态页面进行装饰,但是,特别要注意的点是:通常建议表现形式与页面内容分离(例如:人就是内容,穿着打扮就是表现形式) 常用样式基础样式样式名描述text-align设置内容位置text-decoration控制下划线 none没有 underline有line-hight行高font-siz
选择器选择器可以快速、方便的选择所需要使用的页面元素基本选择器基础选择分三种,分别是:标签选择器、类选择器、id选择器标签选择器标签选择器主要是根据标签的名字进行元素的选择语法:标签名{}例如:div{color:red;font-size:20px;}<div class="div-cls">昨日头条:国家公祭日</div> <div class="p-cls" i
CSS样式课程目标1.css引入方式(重点)2.css选择器(重点)3.css盒子模型(重点)4.css3常见效果(重点)级联样式表css概述层叠样式表其实就是对静态页面进行装饰,但是,特别要注意的点是:通常建议表现形式与页面内容分离(例如:人就是内容,穿着打扮就是表现形式)css引入方式行内样式行内样式(将样式直接写在标签上),需要使用style属性<!-- 行内样式 -->
Copyright © 2005-2024 51CTO.COM 版权所有 京ICP证060544号