Есть ли библиотека CSS, которая имитирует сгруппированный iPhone UITableView? - PullRequest
Новая
       5

Есть ли библиотека CSS, которая имитирует сгруппированный iPhone UITableView?

1 голос
/ 09 июня 2010

Существует ли библиотека CSS, которая имитирует сгруппированный UITableView для iPhone?

Я хочу создать красивую таблицу, которая будет выглядеть точно так же, как сгруппированный UITableView.Поскольку в каждой строке текста есть несколько текстовых стилей, и мне не нужна какая-либо интерактивность, кроме прокрутки, кажется, что было бы проще создать с помощью HTML и отобразить его в UIWebView.Есть ли библиотека css, которая соответствует этой потребности?

Ответы [ 4 ]

1 голос
/ 09 июня 2010

Если вы хотите использовать jQuery вместо CSS, jqTouch - это отличный способ получить внешний вид iPhone на веб-странице:

http://jqtouch.com/

1 голос
/ 14 июня 2013

может быть немного поздно, но если кто-то придет после того, как вы сможете сделать это: 

body
                {
                    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAABCAIAAABhfAhTAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyRpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoTWFjaW50b3NoKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDoxRDgxQTgwM0NDQ0IxMUUyQTZBQUIwNzJBQjVBQzMxQyIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDoxRDgxQTgwNENDQ0IxMUUyQTZBQUIwNzJBQjVBQzMxQyI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjFEODFBODAxQ0NDQjExRTJBNkFBQjA3MkFCNUFDMzFDIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjFEODFBODAyQ0NDQjExRTJBNkFBQjA3MkFCNUFDMzFDIi8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+aF4v3QAAABZJREFUeNpiPHr6MgNuwM7BBmcDBBgAYwsCesD5i4oAAAAASUVORK5CYII=);
                }
1 голос
/ 09 июня 2010

Самое близкое, что я нашел, было это: http://code.google.com/p/iphone-universal/.

Однако, с очень базовыми знаниями CSS, возможно, в сочетании с базовыми навыками Photoshop (или другого редактора), вы должны быть в состоянии создать что-то, что выглядиточень похоже на пользовательский интерфейс iPhone.Это довольно просто.

0 голосов
/ 21 января 2015 

<!DOCTYPE html>
<!-- UITableView HTML5 .. http://jqtouch.com/ minimal code (your own backend) -->
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale = 1.0,maximum-scale = 1.0" />
<style>

body {
  background: #f7f4f0;
}

h1, h1 a, h1 a:hover {
  text-indent: 9px;
  font-size: 18px;
  color: #FFFFFF;
  padding-top: 18px;
  text-decoration: none;
}

div#jqt ul li {
  background: #f7f4f0;
  color: #754719;
  margin-top:30px;
  list-style-position: outside;
  list-style-type: none;
  font-size: 15px;
  border-bottom: 1px solid #00308f;
}

div#jqt .toolbar {
  background: #00308f;
  border: 0;
  border-bottom: 1px solid #000;
  margin-top: -20px;
}

div#jqt .toolbar .btn2 {
  -webkit-border-radius: 5px;
  -webkit-border-image: none;
  display: block;
  background: rgba(40, 29, 25, .4) none !important;
  padding: 6px;
  border: 1px solid #372823;
  float: left;
  color: #FFFFFF;
  -webkit-box-shadow: rgba(255,255,255, .4) 0 1px 0;
  text-decoration: none;
  position: absolute;
  top: 5px;
  right: 18px;
  font-size: 18px;
  display: inline;
}

</style>
</head>
<body>
	
<div id="jqt">
    <div id="home">
        <div class="toolbar">
            <a href="#" ><h1>Back</h1></a>
            <a href="#" class="btn2 slideup">&nbsp; &#10010; &nbsp;</a>
            <a href="/" class="btn2 slideup" style="margin-right:54px;">Edit</a>
        </div><!-- .toolbar -->
        <ul>
            <li>Cell 1</li>
            <li>Cell 2</li>
            <li>Cell 3</li>
        </ul>
    </div><!-- #home -->
</div><!-- #jqt -->

</body>
</html>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...