ホームページ > ウェブフロントエンド > htmlチュートリアル > html と css の基本_html/css_WEB-ITnose

html と css の基本_html/css_WEB-ITnose

WBOY
リリース: 2016-06-24 11:32:41
オリジナル
1440 人が閲覧しました

背景:

最近、同社は BS アーキテクチャ プロジェクトを開発しました。同社の主な事業は BS 開発ではありません。プロジェクト マネージャーもアーティストもフロントエンドも存在せず、インターフェイスは非常に醜いです。必要ありません、ハハハ

その後、使用してください。asp.net を使用した後、技術責任者はインターフェイスがあまりにも醜いので変更できないと感じ、devexpress というプラグインに変更しました。見た目は良いのですが、関連リソースが非常に少なく、海外の情報を確認するのが非常に面倒で、新疆のウェブプロキシも非常に遅く、私が大学にいたとき、ウェブデザインの知識はすべて先生に与えられていました。 AJAX コールバック メカニズムとは何ですか? 非同期リフレッシュか何かと呼ばれているようですが、これを学ぶには、まず次のことを行う必要があります。 HTML+CSS+JavaScript の基本は理解できましたね

HTML+CSS の基本的な内容はほぼ理解できましたので、今後の HTML 要素の使い方を確認してください。情報を表示する

<html><head>    <title>常用元素标签</title>    <style type="text/css">    /*CSS样式一般写在这儿,这是CSS注释*/    body{        color:red;    }    </style></head><body>    <!-- html中的注释格式 -->    <h1>1级标题</h1>    <h2>2级标题</h2>    <h3>3级标题</h3>    <h4>4级标题</h4>    <h5>5级标题</h5>    <h6>6级标题</h6>    <em>斜体文字(一般歪果仁强调语义的字体)</em>    <br /><!-- 换行符(空标签) -->    <strong>粗体文字(一般中果仁强调语义的字体)</strong>    <p>段落</p>    <q>简单的引用</q>    <blockquote>对长文本引用,左右会有缩进的效果</blockquote>    <span>没有语义,用于表示特殊的样式</span>    <!-- html代码忽略回车,以及1个以上的空格,多个空格应使用" ",例子如下 -->    <p>没想到输入 空格 这么麻烦,23333</p>    <hr /><!-- 不华丽的分割线(空标签) -->    <address>电子邮件,住址,签名,文档的作者身份</address>    <code>加入一行代码,var = "hello world";</code>    <!-- pre元素,保留语言代码段,保留空格,回车,例子如下 -->    <pre class="brush:php;toolbar:false">    foreach(var item in strArray){        Console.writeLine(item);    }    
  • ul-li,无序的信息列表
  • ul-li,无序的信息列表
  1. ol-li,有序的信息列表:1
  2. ol-li,有序的信息列表:2
              
表格标题
名字 爱好
彭彭
丁满 跳舞
打开百度 对此影评有何感想,发送邮件给我 图片无法显示,用此文字替代
ログイン後にコピー

2. フォーム (背景とのインタラクション)

<html><head>    <title>表单</title></head><body>    <!-- method可以选择"get/post"2种,action是提交表单后执行交互的页面 -->    <form method="post" action="save.php">        <!-- label标签的for属性,与其他控件的name进行关联,在点击label时,把焦点移到与之关联的控件上 -->        <label for="username">用户名:</label>        <!-- id属性,是后台获取值时使用的. type是控件类型 -->        <input type="text" name="username" id="username" value="" />        <label for="pass">密码:</label>        <input type="password" name="pass" id="pass" value="" />        <!-- 表单有2个按钮,submit确定,reset重置 -->        <input type="submit" value="确定" name="submit" />        <input type="reset" value="重置" name="reset" />        <textarea cols="50" rows="10">在文本域中输入内容,在这里输入内容...</textarea>        <!-- 单选,注意name标签,一定要一致 -->        <input type="radio" name="loveChoose" value="喜欢" checked="checked">        <input type="radio" name="loveChoose" value="不喜欢">        <input type="radio" name="loveChoose" value="无所谓">        <!-- 多选 -->        <input type="checkbox" name="checkbox1" value="跑步" checked="checked">        <input type="checkbox" name="checkbox2" value="游泳">        <input type="checkbox" name="checkbox3" value="拳击" checked="checked">        <!-- 下拉列表框 -->        <select>            <option value="看书">看书</option>            <option value="旅游" selected="selected">旅游</option>            <option value="运动">运动</option>            <option value="购物">购物</option>        </select>        <!-- 下拉列表框,按住ctrl可多选,不直观,鬼知道要按ctrl -->        <select multiple="multiple">            <option value="看书">看书</option>            <option value="旅游">旅游</option>            <option value="运动">运动</option>            <option value="购物">购物</option>        </select>    </from></body></html>
ログイン後にコピー

3. CSS スタイルを記述する 3 つの方法

<html><head>    <title>CSS的3种写法</title>    <!-- 关于3中CSS写法的优先级,本例子中,内联式 > 嵌入式 > 外部式;    总结:距离被设置元素越近的,优先级越高 -->    <!-- 写法1"外部式CSS样式":href可修改,文件后缀.css,其他都是固定写法 -->    <link href="style.css" rel="stylesheet" type="text/css" />    <!-- 写法2"嵌入式CSS样式" -->    <style type="text/css">    p{        font-size:20px;/*设置文字字号*/    }    </style></head><body>    <p>好好学习,天天开心</p>    <br />    <!-- 写法3"内联式CSS样式" -->    <p style="color:blue">好好学习,天天向上</p></body></html>
ログイン後にコピー

4. CSS 選択デバイス

れーれー

5.

続く…

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート