CSS(三)

CSS又上完了,真是快!!!

预习了JS的一部分,写了几条简单的JS代码:

1.成绩判定:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>学生成绩评定</title>
    <script type="text/javascript">
        var a = window.prompt("朋友,请输入你的成绩:");
        if (a==null){
            document.write("拜拜");
        }else if (a>100) {
            document.write("还能愉快的玩耍嘛!!!");
        }else if(a>90) {
            document.write(a+"是优秀");
        }else if (a>=80) {
            document.write(a+"是良好");
        }else if (a>=70) {
            document.write(a+"是中等");
        }else if (a>=60) {
            document.write(a+"是及格");
        }else if (a<60 && a>=0) {
            document.write(a+"是不及格");
        }else{
            document.write("一脸懵逼");
        }
    </script>
</head>
<body>

</body>
</html>

2.判断平年还是闰年:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>平年还是闰年?</title>
    <script type="text/javascript">
        var a = window.prompt("请输入年份");
        if (a==null) {
            document.write("玩我呢?");
        }else if(a==0){
            document.write("你什么时候听说过0年?");
        }else{
            a%4==0 && a%100!=0 || a%400==0?document.write(a+"年是闰年"):document.write(a+"年是平年");
        }
    </script>
</head>
<body>

</body>
</html>

3.输出1-100内的奇数:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>while</title>
    <script type="text/javascript">
        var i=1;
        while (i<=100)
        {
            if (i%2!=0)
            {
            document.write(i+‘<br>‘);
            }
            i++;
        }
    </script>
</head>
<body>

</body>
</html>
时间: 2025-01-01 21:29:27

CSS(三)的相关文章

Css三栏布局自适应实现几种方法

Css三栏布局自适应实现几种方法 自适应实现方法我们可以从三个方法来做,一个是绝对定位 ,自身浮动法 和margin负值法了,下面我们一起来看看这三个例子吧,希望例子能帮助到各位同学. 绝对定位法三栏布局自适应: 代码如下 复制代码 <!doctype html> <html> <head> <meta charset="utf-8"> <title>绝对定位法</title> <style>  .pa

div css三列布局效果实例代码

div css三列布局效果实例代码:三列布局在是比较中规中矩的布局之一,大量的网站都有应用,也是初学者必须要掌握的布局方式之一,下面就是一个三列布局的实例代码,仅供参考之用,希望对初学者有一定的帮助,代码实例如下: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <

css三种引用方式

1 直接在标签内添加 style属性 1 <body> 2 <!-- 内嵌写在标签内 --> 3 <div style="color: red;font-size: 20px">山无陵,天地合</div> 4 </body> 运行效果: 2 写在标签<head>中,内部样式 1 <html lang="en"> 2 <head> 3 <meta charset=&q

CSS(三):基本属性

1.属性选择器 E[att]:选择具有att属性的E元素. 1 /* 获取具有class属性的p元素 */ 2 p[class]{ 3 color: red; 4 } 5 6 <p class="a">class:a</p> E[att="val"]:选择具有att属性且属性值等于val的E元素. 1 /* 获取class属性的值为"a"的p元素 */ 2 p[class="a"]{ 3 color:

CSS三种插入样式表格式

首先简单理解浏览器与网页的交互过程 CSS样式表(stylesheet) cascading style sheet 级联样式表 表现HTML或XHTML文件样式的计算机语言:包含对字体.颜色.边距.高度.背景图片.网页定位等设定 css优势:内容于表现分离 网页的表现统一,容易修改 丰富的样式,使得页面布局更加灵活 减少网页的代码量,增加网页的浏览速度,节省网络带宽 运用独立于页面的css有利于网页被搜索引擎收录 插入CSS样式表分为三种: 外部样式表(External style sheet

CSS设计指南之CSS三种机制:继承、层叠和特指

一.继承 CSS中的祖先元素也会向后代传递一样东西:CSS属性的值.body元素是所有元素的祖先,所有标签都是它的后代,比如为body元素设置一种字体,那么文档中的所有元素,无论它在层次结构中多么靠下,都将继承这些样式.CSS中有很多属性都可以继承,其中相当一部分都与文本有关. 二.层叠 层叠,就是层叠样式表中的层叠,是一种样式在文档层次中逐层叠加的过程.目的是让浏览器面对某个标签特定属性的多个来源时,确定最终使用哪个值. 1.样式来源 浏览器默认样式表:因为你还没有显示设置CSS属性,h1就会

Web前端基础(6):CSS(三)

1. 定位 定位有三种:相对定位.绝对定位.固定定位 1.1 相对定位 现象和使用: 1.如果对当前元素仅仅设置了相对定位,那么与标准流的盒子什么区别. 2.设置相对定位之后,我们才可以使用四个方向的属性: top.bottom.left.right. 特性:1.不脱标  2.形影分离  3.老家留坑 所以说相对定位在页面中没有什么太大的作用.影响我们页面的布局.我们不要使用相对定位来做压盖效果 用途: 1.微调元素位置 2.做绝对定位的参考(父相子绝)绝对定位会说到此内容. 1.2 绝对定位

CSS三种样式

插入CSS的三种方法 有三种方式插入样式表: 外部样式表 内部样式表 行内式样 外部样式表 使用外部样式表,值改变一个文件,您可以改变整个网站的外观! 每个页面必须包含一个外部样式表文件的引用,在<link> 元素里面. <link> 元素包含在 <head> 里面: <head> <link rel="stylesheet" type="text/css" href="mystyle.css"

CSS三列等高

方式1:这种方式主要的原理是给每个框设置大的底内边距,然后 用数值相似的负值外边距消除浮动 <html> <head> <title></title> <style type="text/css"> .wrapper{ overflow: hidden;//清除浮动 width: 100%; position: relative; } .box{ width: 300px; float: left; background: #

css 三(清除浮动专题)

1.  三个关于浮动的概念  不浮动float:none; 清除周围的浮动元素   float:both   这是清除浮动的本意 清除子元素浮动对父元素的影响  clearfix    很多人都理解成这个叫清除浮动.. 2. 什么是清除浮动 清除浮动不是把当前标签的浮动给清除了,如果这样,还加浮动做什么 其实清除浮动指的是清楚当前元素旁边的浮动元素,但是当前元素又不能影响别人,打不赢就跑,所以自己就跑到下面去了. 3. 为什么要清楚浮动 在布局的时候我们经常希望某些内容能够水平排布,水平排布后,