谁能告诉我做网页界面的大体思路啊?_html/css_WEB-ITnose
我是新手,已经做好了数据库相关的设计,现在就差界面了。
我心里有自己想要完成的设计,但不知道怎么实现。
大体上是这样的:
浏览器最上面10-20%是logo和背景
然后左边20%是超链接列表,右边80%是点击左边的超链接出现的网页。
!!!!!!!
我不知道该怎么实现啊!!!!!!而且列表标签我不知道怎么以有背景的形式呈现啊,每次呈现都是 ·xxxxx
我试过将w3c的源代码复制到我的编译器上,然后编译出来完全都没有背景图啊,就仅仅是列表。
回复讨论(解决方案)
到网上找个网站参考一下。
楼主就当我看不懂中文吧,,,能把你的需求做出图片需求进行说明不。。。。
大哥,你倒是来个大概图啊,草图也可以,用铅笔画的也可以。
至少这样才能给你弄个大概的布局。
不知道是不是中文学得好,大概写了一个。效果如下:
代码如下[用了bootstrap,你可以参考:http://www.bootcss.com]:
<!DOCTYPE html><html xmlns:form="http://www.w3.org/1999/html"><head lang="en"> <meta charset="UTF-8"> <title>申请管理</title> <meta name="viewport" content="width=device-width,initial-scale=1.0"> <link href="http://cdn.bootcss.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet"> <script src="http://cdn.bootcss.com/jquery/2.1.4/jquery.min.js"></script> <script src="http://cdn.bootcss.com/bootstrap/3.3.4/js/bootstrap.min.js"></script> <style type="text/css"> .left { width: 80px; float: left; background-color: #cccccc; } </style></head><body><header class="page-header"> 这里是头部</header><div class="container left"> <nav class="text-center"> <ul class="list-unstyled"> <li><a href="http://www.baidu.com" target="rightcontent">百度</a></li> <li><a href="http://www.sina.com.cn" target="rightcontent">新浪</a></li> <li><a href="http://www.ifeng.com" target="rightcontent">凤凰</a></li> <li><a href="http://www.baidu.com" target="rightcontent">百度</a></li> <li><a href="http://www.sina.com.cn" target="rightcontent">新浪</a></li> <li><a href="http://www.ifeng.com" target="rightcontent">凤凰</a></li> <li><a href="http://www.baidu.com" target="rightcontent">百度</a></li> <li><a href="http://www.sina.com.cn" target="rightcontent">新浪</a></li> <li><a href="http://www.ifeng.com" target="rightcontent">凤凰</a></li> <li><a href="http://www.baidu.com" target="rightcontent">百度</a></li> <li><a href="http://www.sina.com.cn" target="rightcontent">新浪</a></li> <li><a href="http://www.ifeng.com" target="rightcontent">凤凰</a></li> <li><a href="http://www.baidu.com" target="rightcontent">百度</a></li> <li><a href="http://www.sina.com.cn" target="rightcontent">新浪</a></li> <li><a href="http://www.ifeng.com" target="rightcontent">凤凰</a></li> <li><a href="http://www.baidu.com" target="rightcontent">百度</a></li> <li><a href="http://www.sina.com.cn" target="rightcontent">新浪</a></li> <li><a href="http://www.ifeng.com" target="rightcontent">凤凰</a></li> <li><a href="http://www.baidu.com" target="rightcontent">百度</a></li> <li><a href="http://www.sina.com.cn" target="rightcontent">新浪</a></li> <li><a href="http://www.ifeng.com" target="rightcontent">凤凰</a></li> <li><a href="http://www.baidu.com" target="rightcontent">百度</a></li> <li><a href="http://www.sina.com.cn" target="rightcontent">新浪</a></li> <li><a href="http://www.ifeng.com" target="rightcontent">凤凰</a></li> <li><a href="http://www.baidu.com" target="rightcontent">百度</a></li> <li><a href="http://www.sina.com.cn" target="rightcontent">新浪</a></li> <li><a href="http://www.ifeng.com" target="rightcontent">凤凰</a></li> </ul> </nav></div><div class="container-fluid"> <div class="embed-responsive embed-responsive-16by9"> <iframe class="embed-responsive-item" name="rightcontent" src="about:blank"></iframe> </div></div><footer> 这是底部文本</footer></body></html>
新手的优先要做的就是学习
一股浮躁之气
不知道是不是中文学得好,大概写了一个。效果如下:
代码如下[用了bootstrap,你可以参考:http://www.bootcss.com]:
<!DOCTYPE html><html xmlns:form="http://www.w3.org/1999/html"><head lang="en"> <meta charset="UTF-8"> <title>申请管理</title> <meta name="viewport" content="width=device-width,initial-scale=1.0"> <link href="http://cdn.bootcss.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet"> <script src="http://cdn.bootcss.com/jquery/2.1.4/jquery.min.js"></script> <script src="http://cdn.bootcss.com/bootstrap/3.3.4/js/bootstrap.min.js"></script> <style type="text/css"> .left { width: 80px; float: left; background-color: #cccccc; } </style></head><body><header class="page-header"> 这里是头部</header><div class="container left"> <nav class="text-center"> <ul class="list-unstyled"> <li><a href="http://www.baidu.com" target="rightcontent">百度</a></li> <li><a href="http://www.sina.com.cn" target="rightcontent">新浪</a></li> <li><a href="http://www.ifeng.com" target="rightcontent">凤凰</a></li> <li><a href="http://www.baidu.com" target="rightcontent">百度</a></li> <li><a href="http://www.sina.com.cn" target="rightcontent">新浪</a></li> <li><a href="http://www.ifeng.com" target="rightcontent">凤凰</a></li> <li><a href="http://www.baidu.com" target="rightcontent">百度</a></li> <li><a href="http://www.sina.com.cn" target="rightcontent">新浪</a></li> <li><a href="http://www.ifeng.com" target="rightcontent">凤凰</a></li> <li><a href="http://www.baidu.com" target="rightcontent">百度</a></li> <li><a href="http://www.sina.com.cn" target="rightcontent">新浪</a></li> <li><a href="http://www.ifeng.com" target="rightcontent">凤凰</a></li> <li><a href="http://www.baidu.com" target="rightcontent">百度</a></li> <li><a href="http://www.sina.com.cn" target="rightcontent">新浪</a></li> <li><a href="http://www.ifeng.com" target="rightcontent">凤凰</a></li> <li><a href="http://www.baidu.com" target="rightcontent">百度</a></li> <li><a href="http://www.sina.com.cn" target="rightcontent">新浪</a></li> <li><a href="http://www.ifeng.com" target="rightcontent">凤凰</a></li> <li><a href="http://www.baidu.com" target="rightcontent">百度</a></li> <li><a href="http://www.sina.com.cn" target="rightcontent">新浪</a></li> <li><a href="http://www.ifeng.com" target="rightcontent">凤凰</a></li> <li><a href="http://www.baidu.com" target="rightcontent">百度</a></li> <li><a href="http://www.sina.com.cn" target="rightcontent">新浪</a></li> <li><a href="http://www.ifeng.com" target="rightcontent">凤凰</a></li> <li><a href="http://www.baidu.com" target="rightcontent">百度</a></li> <li><a href="http://www.sina.com.cn" target="rightcontent">新浪</a></li> <li><a href="http://www.ifeng.com" target="rightcontent">凤凰</a></li> </ul> </nav></div><div class="container-fluid"> <div class="embed-responsive embed-responsive-16by9"> <iframe class="embed-responsive-item" name="rightcontent" src="about:blank"></iframe> </div></div><footer> 这是底部文本</footer></body></html>
嗯,加油,不过下次发帖还是有个图比较方便。
不知道是不是中文学得好,大概写了一个。效果如下:
代码如下[用了bootstrap,你可以参考:http://www.bootcss.com]:

Outils d'IA chauds

Undresser.AI Undress
Application basée sur l'IA pour créer des photos de nu réalistes

AI Clothes Remover
Outil d'IA en ligne pour supprimer les vêtements des photos.

Undress AI Tool
Images de déshabillage gratuites

Clothoff.io
Dissolvant de vêtements AI

Video Face Swap
Échangez les visages dans n'importe quelle vidéo sans effort grâce à notre outil d'échange de visage AI entièrement gratuit !

Article chaud

Outils chauds

Bloc-notes++7.3.1
Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise
Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1
Puissant environnement de développement intégré PHP

Dreamweaver CS6
Outils de développement Web visuel

SublimeText3 version Mac
Logiciel d'édition de code au niveau de Dieu (SublimeText3)

HTML convient aux débutants car il est simple et facile à apprendre et peut rapidement voir les résultats. 1) La courbe d'apprentissage de HTML est fluide et facile à démarrer. 2) Il suffit de maîtriser les balises de base pour commencer à créer des pages Web. 3) Flexibilité élevée et peut être utilisée en combinaison avec CSS et JavaScript. 4) Les ressources d'apprentissage riches et les outils modernes soutiennent le processus d'apprentissage.

HTML définit la structure Web, CSS est responsable du style et de la mise en page, et JavaScript donne une interaction dynamique. Les trois exercent leurs fonctions dans le développement Web et construisent conjointement un site Web coloré.

Anexampleofastartingtaginhtmlis, qui abinginsaparagraph.startingtagsaressentialtinhtmlastheyinitiateelements, définit les éventualités, et la faculté de réduction des pages et de la construction de la création.

WebDevelopmentReliesOnHTML, CSS, etjavascript: 1) HTMLSTRUCTURESCONTENT, 2) CSSSTYLESIT, et3) JavascriptAdddsInterActivity, Forming TheasisofmodernweBEBExperiences.

GiteEpages STATIQUE Le déploiement du site Web a échoué: 404 Dépannage des erreurs et résolution lors de l'utilisation de Gitee ...

L'algorithme adaptatif de la position de l'axe y pour la fonction d'annotation Web Cet article explorera comment implémenter des fonctions d'annotation similaires aux documents de mots, en particulier comment gérer l'intervalle entre les annotations ...

Pour obtenir l'effet de la diffusion et de l'élargissement des images environnantes après avoir cliqué sur l'image, de nombreuses conceptions Web doivent obtenir un effet interactif: cliquez sur une certaine image pour faire les environs ...

HTML, CSS et JavaScript sont les trois piliers du développement Web. 1. HTML définit la structure de la page Web et utilise des balises telles que, etc. 2. CSS contrôle le style de page Web, en utilisant des sélecteurs et des attributs tels que la couleur, la taille de la police, etc. 3. JavaScript réalise les effets dynamiques et l'interaction, par la surveillance des événements et les opérations DOM.
